Введение в Hydra
Hydra — это live-кодируемый видеосинтезатор, который работает прямо в браузере. Инструмент создан художницей Olivia Jack и вдохновлён аналоговыми модульными видеосинтезаторами.
Что такое Hydra?
Hydra позволяет создавать визуальные эффекты в реальном времени с помощью простого JavaScript кода. Синтаксис вдохновлён модульным синтезом — вместо физических кабелей вы соединяете JavaScript-функции через точки.
Простейший пример
Принцип модульного синтеза
ИСТОЧНИК → ТРАНСФОРМАЦИИ → ВЫХОД
source → transforms → .out()
Числовые аргументы внутри функций аналогичны положению ручек на модулях синтезатора.
Пять типов функций
1. Sources (Источники)
Генерируют визуальный сигнал: osc(), noise(), shape(), voronoi(), gradient(), solid()
2. Geometry (Геометрия)
Трансформируют координаты: rotate(), scale(), pixelate(), kaleid(), repeat()
3. Color (Цвет)
Изменяют цветовые значения: color(), brightness(), contrast(), saturate(), hue(), invert()
4. Blend (Смешивание)
Комбинируют два источника: add(), mult(), diff(), blend(), layer(), mask()
5. Modulate (Модуляция)
Используют один источник для искажения геометрии другого: modulate(), modulateScale(), modulateRotate()
Выходные буферы
Hydra имеет четыре выходных буфера: o0, o1, o2, o3
Динамические параметры
Любой параметр может быть функцией, которая вычисляется в реальном времени:
Следующие шаги
Изучите детально каждый аспект Hydra:
- Источники — все генераторы визуалов
- Трансформации — геометрия и цвет
- Смешивание — комбинирование источников
- Модуляция — продвинутые эффекты
- Аудио-реактивность — визуализация звука