Bath Synth — веб-синтезатор, вдохновлённый купанием в ванне. Мягкие мелодии, глубокий фон и ритм из пузырьков и стуков складываются в lo-fi, под который приятно отдыхать.
Интерфейс собран из предметов ванной комнаты: батарея-змеевик, стиральная машина, полка с флаконами, ванна, шторка и драм-сэмплер в виде напольной плитки. Ванна с пузырями: реализована с помощью библиотеки p5.js, при клике и движении курсора появляются пузырьки и играет сэмпл. Есть и звуки самого интерфейса: шорох носков, скрип ручек, шум стиралки.
Три голоса, у каждого своя цепочка:Synth 1: Tone.Synth → Phaser → общие эффекты; Synth 2: AMSynth → Filter → Chorus → общие эффекты; Synth 3: MonoSynth (низкий фон) → общие эффекты.Общие эффекты у каждого голоса: Tremolo → PingPongDelay → Reverb → мастерЧетыре драм-дорожки: отдельные Sampler’ы со своими каналами. У дорожки bubbles есть собственный PingPongDelay.Разведение по каналам сделано: у каждого голоса и дорожки свой Channel со своей громкостью.У каждого синта три мелодии на выбор. Новая мелодия включается только после конца текущего loop.
Скринкаст
Работа с ИИ
В процессе разработки я использовала Claude (Anthropic) как помощника для программирования и работы со звуком.
Основные направления использования:
— Программирование: создание и редактирование HTML, CSS, JavaScript.
— Отладка: поиск и исправление ошибок в анимации и интерфейсе.
Вот примеры моих промптов:synth 2 пусть будет дополняющая мелодия к synth 1 средней высоты с другим ритмом можно арпеджио synth 3 полностью переделать мелодия в низкой октаве заполняющая фоноваяпроверь почему не работает анимация стиральной машинки при нажатии на start button (должен крутиться барабан)сделай чтобы крутилки knob крутились при зажатии более естественно и плавно, а то сейчас они могут прыгнуть на высокую громкостьизмени звуки при наведении на bubble zone, пусть это будет просто sample звука, который при клике и движении курсора будет воспроизводиться
