Вот несколько интересных демонстраций WebGL и Web Audio API, которые я видел за последние пару недель.
EVE Online Ship Viewer — это великолепное онлайн-приложение для просмотра кораблей, созданное с помощью WebGL. Очень хороший способ продемонстрировать произведения искусства игровой вселенной.
На странице примеров API веб-аудио есть несколько убедительных примеров обработки звука с его помощью. WebGL City — одна из демоверсий, ссылка на которую находится на странице примеров. Это небольшая демонстрация вертолета, летающего по ночному городу. Вертолет (отключите музыку, нажав «m», включите звук вертолета, нажав «n») использует функции пространственного звука API веб-аудио для панорамирования звука вертолета от одного динамика к другому.
Какая-то предприимчивая душа реализовала игру-змейку, используя только фрагментный шейдер WebGL в GLSL Sandbox . Я ошеломлен.
«Большой взрыв» может выглядеть как любая другая анимация частиц в WebGL, но на самом деле симуляция частиц выполняется на графическом процессоре. Симулятор представляет собой фрагментный шейдер, который считывает предыдущие положения частиц из текстуры и записывает новые положения частиц в текстуру FBO.
Blocky Earth берет данные Google Earth и обрабатывает их в MineCrafts. Он хорошо передает разницу в высоте. Например, я смотрел на Австралию и ледниковый щит Антарктики, и вы могли видеть, что континентальный лед имеет толщину в несколько километров.
The Midem Music Machine — это забавная музыкальная демо-версия от Mr.doob и Пола Ламера. Это что-то вроде музыкальной шкатулки с шариковым приводом, в которой шарики отскакивают от бит-н-бопсов. У CreativeJS есть хорошая рецензия на эту тему, посмотрите.
Продолжая тему компьютерной визуализации музыки, я недавно наткнулся на страницу о bytebeat , форме музыки, создаваемой с помощью минималистической формулы кода. Страница ссылается на классную визуализацию музыки в формате WebGL . Грегг Таварес подхватил эту идею и создал песочницу bytebeat для создания и обмена собственными bytebeat-мелодиями прямо из браузера.