Аудіовізуалізатор — 15 реактивних WebGL-сцен

Звук безперервно розкладається на 32 частотні смуги приблизно 90 разів на секунду — незалежно від частоти кадрів екрана. Кожна смуга порівнюється зі своїми нещодавніми гучними моментами й із фоновим шумом, тому тихий мікрофон і гучний файл рухають картинку однаково, а тиша чи шум кімнати лишають сцену спокійною й темною. Удари розпізнаються окремо — бочка, малий барабан, хай-хети — і відстежується ритм; захоплення темпу відпускається, щойно музика замовкає, тож у тиші нічого не пульсує. Сцени віддають басу розмір і великі форми, верхам — іскри й дрібні деталі, ударам — спалахи, кола на воді й блискавки, а «Форма хвилі» та «Спектр» малюють справжній спектр.

Спершу дозвольте браузеру доступ до мікрофона. У тиші картинка спокійна навмисно — увімкніть музику поруч із мікрофоном або оберіть файл. Якщо музика ледь гучніша за шум кімнати, наблизьте джерело, зробіть гучніше або підніміть повзунок чутливості. Якщо грає файл, а браузер не запустив звук сам, натисніть ▶.

Так! Натисніть S або кнопку «Заставка». Візуалізатор розгорнеться на весь екран і по колу показуватиме всі 15 сцен, змінюючи їх кожні 30 секунд. Натисніть Escape або клацніть будь-де, щоб вийти.

Кожна сцена — це фрагментний шейдер на відеокарті, тож потрібен WebGL з увімкненим апаратним прискоренням: чорний прямокутник майже завжди означає, що прискорення вимкнене в налаштуваннях браузера, а не що сцена зламалась. Ривки — інший кінець тієї самої історії: з 15 сцен найважчі «Електрична буря» й «Лавовий потік», найлегші — «Спектр» і «Форма хвилі», тож перейдіть на легшу сцену, вимкніть кінематографічні ефекти (P), вийдіть із повноекранного режиму або закрийте вкладки, які борються за ту саму відеокарту.

Так. Перейдіть у режим завантаження файлу й оберіть будь-який аудіофайл (MP3, WAV, OGG, FLAC). Музика відтворюється через динаміки, а сцена реагує на неї в реальному часі.

Оберіть файл і сцену та натисніть «Створити відео»: сторінка намалює всю пісню кадр за кадром, 30 кадрів на секунду, і зведе картинку зі звуком пісні в MP4 або WebM — у кадрі 16:9 для YouTube, 9:16 для Reels, TikTok і Shorts або в квадратному 1:1. Кожен кадр обчислюється за тим звуком, який у ньому звучить, тому спалахи влучають точно в удари, а на повільній відеокарті відео просто збирається довше, а не втрачає кадри. Кнопка ● записує те, що екран показує саме зараз, — вона потрібна для мікрофона.