Визуализатор звука — 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. Каждый кадр считается по тому звуку, который в нём звучит, поэтому вспышки попадают точно в удары, а на медленной видеокарте видео просто собирается дольше, а не теряет кадры. Кнопка ● записывает то, что показывает экран прямо сейчас, — она нужна для микрофона.