Как звучит ноль мегабайт и траблы с триггером
Продолжаем нашу инди-графоманию и летопись разработки браузерной головоломки со светом Reflection. Пощупать свежий билд с звуковым сопровождением можно здеся.
Для тех, кто пропустил предыдущие серии эпопеи:
В прошлой статье я похвастался внедрением призмы и пообещал, что фоновая музыка, которая крутилась на тестовой виртуалке домашнего сервера, к понедельнику отправится на прод. Ну что, докладываю: музыка на проде!
А вместе с ней подоспела новая порция геймдев-рефлексии, а именно «триггер», идея которого оказалась сложнее всей уже реализованной игры. Погнали разбираться.
Как звучит ноль мегабайт.
В прошлый раз я упоминал, что тестирую фоновую музыку и главная задача заключалась в том, чтобы не утяжелять веб-игру. Если залить в проект три-четыре MP3-трека для фона, вес страницы подскакивает на 15–20 мегабайт. Для браузерной игры, которую игрок может запустить на смартфоне в метро, это приговор, так как пока игра загрузится, игрок уже закроет вкладку.
Поэтому для решения проблемы, после исследования, я решил использовать Web Audio API. В игре нет ни одного звукового файла. Вообще. Ноль килобайт аудиоассетов в сетевой вкладке браузера.
Работает это следующим образом:
1. Басовый дрон: Два генератора на 65.41 Гц (C2) и 98.00 Гц (G2) с расстройкой в 4 цента. Медленный LFO (0.08 Гц) плавно шевелит частоту, создавая глубокий аналоговый гул, будто где-то в подвале мерно гудит трансформатор оптической лаборатории;
2. Медитативные пэды: Генератор плавно перебирает пентатонику (Csus2, Am7, Fadd9, Gsus4). Каждый аккорд длится целых 18 секунд — длинная атака, долгое звучание, мягкий спад. Звуки наслаиваются друг на друга, и получается бесконечный, ненавязчивый саундтрек.
3. Хрустальные колокольчики: Случайные высокие нотки, которые звучат раз в 8–16 секунд.
4. Интерактивный фильтр (самый гуд): Когда вы просто думаете над уровнем, частота среза low-pass фильтра прижата к 380 Гц (звук мягкий, глухой, не лезет на передний план). Но как только лучи начинают попадать в приёмники, фильтр плавно раскрывается до 580 Гц, а при полной победе — до 750 Гц. Музыка буквально расцветает навстречу вашему успеху!
По моему субъективному мнению, атмосфера игры изменилась на 180 градусов. Раньше это был сухой лабораторный стенд, а теперь — полноценный медитативный дзен. Зайдите, послушайте в наушниках — оно реально гипнотизирует.
Триггер.
Это просто
Идея на словах элементарная, просто ставим на поле специальный датчик (тот самый триггер). Луч света падает на датчик, на поле что-то происходит (открывается запертая дверь, исчезает стена или разблокируется спящий элемент). Вроде бы ничего криминального?
А вот в геймдизайне/геймплее начался сущий ад. Вот три развилки, над которыми я сейчас ломаю голову (и то не факт, что итоговая реализация именно такой окажется):
1. Удержание или фиксация. Представьте, луч посветил на триггер -дверь открылась. А что будет, если игрок повернет зеркало и луч уйдет/исчезнет? Тут два варианта, либо дверь закрывается (над удерживать луч на триггере), либо дверь остается открытой, так как ее состояние зафиксировалось. Скорее всего будет некая гибридная реализация;
2. Цветовой триггер. Цвета (красный, зеленый, синий) в игре уже реализованы, можно воспользоваться уже готовыми игровыми особенностями для нового игрового элемента;
3. Отображение и понятность. На текущем игровом поле критически важно, чтобы игрок сразу понимал, что триггер открывает ту или иную дверь. Как это реализовать, чтобы игроку все было понятно? Рисовать соединительные провода? Делать одинаковую цветовую маркировку или геометрические значки (квадрат к квадрату, ромб к ромбу)? Пока окончательного решения у меня нет, только поставлены вопросы.
Оценить работу процедурного звука можно в веб-версии Reflection. Короткие заметки об архитектуре и разработке небольших проектов публикую в Telegram-канале «Между версиями». Буду рад обсудить в комментариях реализацию Web Audio узлов и ваши подходы к проектированию связей элементов.