В сети есть очень классный сайт Chrome Experiments, который создан для демонстрации инновационных веб-экспериментов на основе открытых стандартов, таких как JavaScript и HTML5. Если Вы ещё не видели Chrome Experiments, то рекомендую потратить на посещение нескольких минут и насладиться самыми крутыми эффектами в области разработок JavaScript и HTML5. Всё это проекты пользователей, которые наглядно демонстрируют, что можно сделать с помощью технологий на основе стандартов с открытым исходным кодом.
Предлагаю Вашему вниманию Топ 10 лучших демонстраций веб-экспериментов JavaScript и HTML5, которые выделяются среди тысячи других проектов пользователей на Chrome Experiments.
Среди многих оригинальных проектов, я собрал субъективно самые интересные. Здесь есть эксперименты, связанные с музыкой, образованием, наукой, игры и многое другое. Для запуска некоторых из них нужен либо Google Chrome, либо Яндекс.Браузер (либо другие браузеры на основе Chromium).
Кстати, у нас есть классное сравнение браузеров, где пытались ответить на вопрос «Какой браузер лучше — Гугл Хром или Яндекс Браузер» (по разным факторам: начиная от уровня поддержки последних стандартов, включая тот самый HTML5 до разбора их скорости / производительности).
3D Периодическая таблица
Визуальное и интерактивное обучение является лучшим способом что-либо узнать. 3D периодическая таблица поможет Вам узнать больше об элементах периодической таблицы Менделеева Д.И. в интерактивном режиме. Вы можете щелкнуть на любом элементе, и он покажет информацию о себе: плотность, атомная масса, атомный номер и другое. Для того, чтобы изучить его, нажмите на кнопку Explore Atom и увидите модель выбранного элемента в 3D.
3D Периодическая таблица
Короткометражка о вашем местонахождении
Wilderness Downtown — уникальный короткий фильм, созданный разработчиками Google Creative Lab. Идея фильма и отличие от других короткометражек в том, что Wilderness Downtown показывает видео в нескольких окнах сразу и основан на картах Google, просмотре улиц и Google Maps API. Введите в поисковой строке любое местоположение и наслаждайтесь демонстрацией сцен вокруг этого места сверху, в панорамном режиме и круговом движении в сопровождении хорошего музыкального фона. Это стоит попробовать. Но советую выбирать места с доступностью 3D моделей на картах Google.
Wilderness Downtown
Браузерный мячик
Марк Махони (Mark Mahoney) создал Browser Ball. Суть проекта в том, что бы показать всю мощь JavaScript. Браузерный мячик позволяет открывать несколько окон браузера и перетащить пляжный мячик из одного окна в другое. При этом мячик может и сам перекатиться из одного окна в другое.
Browser Ball
Музыкальные эксперименты
TypaTone является музыкальным экспериментом. Он показывает клавиатуру, правда только на английском языке, которая позволяет набрать текст. Каждая буква имеет свою уникальную тональность и в совокупности набранные буквы создают мелодию. Для набора текста Вы можете использовать и обычную клавиатуру Вашего устройства.
TypaTone
Можно сначала ввести весь текст, а затем начать воспроизведение музыки. Кроме того получившимся музыкальным фрагментом можно поделиться с друзьями.
Нарисуй квадрат
Проект Нарисуй квадрат может проверить, насколько хорошо Вы можете определить размеры в браузере. Попробуйте нарисовать прямоугольник заданных размеров и сравнить с оригиналом. Если Вы не профессионал веб графики, то вряд ли у Вас получится начертить несколько фигур подряд со 100%-ной точностью.
Нарисуй квадрат
Голосовая игра
Игра Spell Up от Google является одним из лучших проектов на Chrome Experiments, которая позволяет узнать написание слов английского языка в интерактивном режиме. Она имеет три уровня сложности. Чтобы играть, необходимо использовать микрофон. С его помощью Вы называете нужные буквы, которые показываются на экране, чтобы составить правильно всё слово целиком правильно. За правильно названные буквы начисляются очки.
Игра Spell Up
Игра имеет словарь, который подскажет значение слова и поможет перевести его на любой язык. Она также просит Вас произнести слово, чтобы проверить его. Если Ваш ребенок хочет научиться английскому языку, рекомендую попробовать.
Endurance из Интерстеллар
Смотрели фильм Интерстеллар 2014 года? Если нет, то Вы многое потеряли.
На всём протяжении фильма присутствует космическая станция Endurance, о техническом оснащении которого можно поговорить отдельно. Если Вы неравнодушны к космическим кораблям, и хотите посетить Endurance, чтобы всё разузнать самому, то этот проект для Вас.
Этот проект был создан коллективно несколькими кампаниями (AvatarLabs, Xymatic и Warner Bros). Вы сможете исследовать корабль снаружи, виртуально прогуляться по его внутренним палубам и узнать даже больше, чем показано в фильме.
Endurance из Интерстеллар
Надувные шары
Bouncy Balls или надувные шары ещё один потрясающий эксперимент, который к тому же является одним из самых забавных. Нажатия левой мыши позволяют подбросить шары вверх. Физика движения каждого шарика настолько хороша, что сначала даже не верится, что это происходит в браузере. Подбрасывать можно не только шары, но и смайлики, пузыри и прочее. Можно задать количество предметов и высоту прыжков. А подбрасывать можно не только мышкой, но и громко крикнув «БУМ» в микрофон.
Bouncy Balls
Планета Судоку
Планета Sudoku позволяет играть в судоку — всемирно известную логическую головоломку. Игра позволяет выбрать размер поля, может изменить цвет фона на тот, который Вы захотите. В ходе игры показывается количество ходов и счёт.
Планета Sudoku: отличная игла с миллионами паззлов Sudoku и несколькими уровнями сложности
Океан слов
Океан слов — детская игра, которая показывает слова и буквы на английском языке, которые разбросаны в океане. Вы должны управляя китом собрать все буквы и встречающиеся бонусы, чтобы собрать слово и заработать очки. Игра начнётся заново, если Вы допускаете ошибки.
Океан слов
Это действительно интересный способ для ребёнка выучить слова и варианты их написания. Советую попробовать.
Вот некоторые из самых лучших проектов на Chrome Experiments, которые мне удалось отыскать. Если Вы знаете похожие экспериментальные проекты, которые поражают техническими новшествами веб-разработок, то напишите об этом в комментариях.
