Как PIGIAMA KASAMA сократили 218 МБ из веб-игры Kasama: Пробуждение

Касама: Пробуждение - это эпизодическая, сюжетно-ориентированная, веб-основанная приключенческая игра, созданная PIGIAMA KASAMA. Чтобы создать эту игру для веба, команде нужно было оптимизировать производительность на всех устройствах, сохраняя при этом высокую визуальную точность. Вот как они воплотили свою Vision в жизнь.

Как студия может предоставить визуально потрясающий и эмоционально захватывающий опыт в Интернете?

После двух лет создания игр для других брендов, команда PIGIAMA KASAMA была уверена, что оригинальная игра с акцентом на повествование найдет свою аудиторию в интернете. Пока Касама: Пробуждение началось как VR и настольная игра в жанре файтинг, они решили адаптировать игру в эпизодическое приключение-головоломку.

Чтобы испытать Кастанию, мы встроили игру ниже, чтобы вы могли насладиться ею в настольных браузерах. Для мобильных устройств, пожалуйста, ознакомьтесь с приложением Spatial.

Как давние разработчики Unity, основатели студии Маттео Фанчин и Париде Стелла хотели найти партнера по разработке и запуску платформы, который разделял бы схожие приоритеты, такие как свобода творчества, высокая визуальная точность, отличный опыт для игроков и мультиплатформенная поддержка.

«Мы обнаружили, что Spatial является лучшей платформой для пользовательского контента (UGC).» «Объединяя возможности упрощения процессов и доступность, которую она предоставляет игрокам, с гибкостью, которую мы имеем при создании с Unity, мы смогли расширить аудио, визуальные и опытные границы для веб-игры», — говорит Фанчин.

Команда Spatial подчеркивает ценность, которую команда PIGIAMA KASAMA привнесла в сотрудничество. Джейк Стейнерман, глава отдела по связям с разработчиками, говорит: «Мы создали платформу таким образом, чтобы создатели могли предоставлять действительно высококачественные впечатления в интернете, на мобильных устройствах и в VR. Когда мы увидели ранние версии Касама: Пробуждение и другая работа, которую проделала команда, мы знали, что должны поддержать это."

Бросая вызов статус-кво

Несмотря на то, что команда PIGIAMA KASAMA обладает креативностью, опытом и поддержкой от Unity и Spatial, их Vision принесло много вызовов. Одним из главных препятствий было оптимизировать игру для производительности на различных устройствах, сохраняя при этом высокую визуальную точность. «Ограничения WebGL требовали от нас инновационного подхода к реализации графики, игровых механик и общего пользовательского опыта», — объясняет Стелла.

Чтобы соответствовать их визуальным и производительным ожиданиям, им нужно было сжать размер сборки, не жертвуя качеством. Они выбрали Universal Render Pipeline (URP), Shader Graph, анимационную систему Unity и встроенное сжатие анимации для достижения этой цели.

Результаты

• Уменьшил текстурную память игры с 264 МБ до 140 МБ
• Уменьшите количество вершин сетки с 550 000 до 351 000
• Уменьшено аудио-память с 86 МБ до 9 МБ
• Уменьшен размер спрайта для пользовательского интерфейса с 45 МБ до 28 МБ
• Сократил количество уникальных материалов, используемых с 75 до 57
• Улучшенная производительность с 4 FPS в начале до минимум 30 FPS на устройствах низкого уровня
• Набрало более 80 000 воспроизведений в течение первых семи недель после запуска

Максимизация ограниченных ресурсов

Их подход к дизайну заключался в том, чтобы с самого начала учитывать ограничения ресурсов, но также иметь гибкость и возможность увеличивать или уменьшать визуальную точность по своему усмотрению. Вычислительная мощность и ограничения памяти оказались их самыми большими проблемами, и для поддержания производительности им пришлось снизить разрешение некоторых текстур. «Мы разместили текстуру самого высокого качества там, где она была наиболее заметна», — говорит Стелла.

Команда использовала минимальное количество ресурсов, и этот подход повлиял на все. Они держали количество полигонов низким, а размер текстур маленьким, чтобы максимально ограничить количество материалов. Они также оптимизировали UV, двумерные текстурные координаты, которые соответствуют информации о вершинах для геометрии.

«Поскольку движения камеры известны и очень ограничены, мы смогли провести агрессивное отсечение окклюзии на всех геометриях перед процессом текстурирования, чтобы каждый полигон и пиксель использовались по максимуму», — говорит Фанчин. Этот процесс предотвращает выполнение Unity расчетов рендеринга для GameObjects, которые полностью скрыты от вида.

Анимация была еще одной областью, где команда сократила размер. Они использовали тип анимации Humanoid из системы анимации Unity, вместе с системой ретаргетинга анимации Mecanim. Кроме того, встроенный процесс сжатия анимации в Unity помог им оптимизировать производительность, уменьшив общий вес анимаций в проекте. Это было особенно полезно для уменьшения анимации захвата движения для лицевой мимики персонажа, которая, как правило, бывает чрезмерно детализированной и тяжёлой.

Найти их свет

Хорошее освещение имеет огромное значение и его трудно достичь в веб-игре," говорит Стелла, и команда хотела убедиться, что качество освещения соответствует остальной части игры. Освещение также было ключевым элементом игровых механик. Команда использовала это для создания напряжения, направления движения игрока и выделения важных областей или объектов в игре. Динамические эффекты подчеркнули ключевые моменты и переходы в истории.

«Мы хотели использовать запеченное освещение как можно больше.» Это способ создать впечатление высококачественного освещения на платформах, которые обычно не предлагают такой степени точности," - говорит Фанчин.

Одной из самых сложных задач команды был переход освещения в среде без загрузки сцены и создание динамических изменений освещения, когда включаются светильники. Они использовали пользовательский шейдер, который в реальном времени манипулировал картами освещения, чтобы сделать все плоским и создать иллюзию динамического света. Стелла объясняет, что «для достижения этого важно рассматривать дизайн игры и дизайн окружения как единый процесс, а не разделять его. Каждый элемент должен служить другому.

Они использовали Shader Graph для разработки пользовательского шейдера, что было особенно полезно во время того, что команда называет «сценой кошмара». Он покрывает карту черной слизью, одновременно нейтрализуя освещение, делая окружающую среду черно-белой.

«Когда игрок включает свет, шейдер обращает этот эффект, создавая иллюзию, что свет активируется и очищает черную слизь из освещенной области», — говорит Фанчин.

Этот пользовательский шейдер также был чрезвычайно полезен в другой главе, в которой взрывается большое количество каштанов. Обработка каштанов как отдельных Entities была непрактичной, поэтому они сгруппировали их в одну сетку и использовали шейдер для управления тряской и взрывами.

Каждый каштан отображается на сетке UV слева направо, соответствуя последовательности взрыва, при этом каштаны на вершине куч взрываются первыми. Шейдер выбирает предопределенные группы каштанов по индексу, в то время как другой скрипт размещает взрывы системы частиц в точных местах, где каштаны собираются взорваться.

«Этот подход позволил нам эффективно управлять большим объемом геометрии и сложной динамикой без перегрузок производительности, обеспечивая соответствие требованиям веб-производительности», — объясняет Стелла.

Из-за ограничений размера сборки они также сделали некоторые художественные выборы для улучшения производительности. Они выбрали работать с темными областями, чтобы скрыть элементы. Это помогло им оптимизировать количество полигонов и обтянутую сетку. «Мы добавили гораздо больше деталей в более светлые области», — говорит Фанчин.

Управление процессом производства аудио

Звуковое оформление повлияло на всё, от темпа игрового процесса до дизайна окружения и взаимодействий, и направляет игроков, углубляя их эмоциональную связь с сюжетом. Команда PIGIAMA KASAMA создала и произвела саундтреки, чтобы соответствовать настроению и темпу каждого эпизода. Они также работали с актёрами озвучивания и наняли лингвиста для создания языка. Их целью было создать аудиальный опыт, который усиливал бы погружающее качество игры.

«Всякий раз, когда у опыта или продукта плохой звук, вы это слышите.» Если звук хороший, он невидим," - говорит Стелла.

Они выполнили строгий трехэтапный технический процесс для производства аудио, прежде чем внедрить его в игру.

Этап 1: Унификация аудиоклипов и сведение/мастеринг

Первый этап требовал объединения нескольких аудиоклипов, особенно для зацикленных звуков, таких как звуковые пейзажи и саундтрек игры. Этот процесс распространился на некоторые одноразовые звуковые эффекты, которые были наложены и объединены в единые треки. Эти изменения были интегрированы во время этапа сведения и мастеринга, обеспечивая, чтобы объединенные клипы сохраняли согласованность в аудиодинамике и общем балансе в различных средах воспроизведения. Этот этап был важен для минимизации несоответствий и обеспечения целостного аудиовосприятия, особенно для циклических Sequences, которые должны были плавно переходить в игре.

Этап 2: Преобразование формата в оптимизированные стандарты сжатия

На втором этапе оригинальные аудиофайлы высокого качества, обычно в форматах AIFF и FLAC, были преобразованы в формат OGG. Частота дискретизации 48 кГц и глубина звука 16 бит, соответствуют отраслевым стандартам для поддержания баланса между качеством звука и эффективностью производительности. Кодек сжатия Vorbis был использован, что позволило значительно уменьшить размер файла без ущерба для воспринимаемого качества звука.

Этап 3: Unity реализация и настройка

Заключительный этап включал интеграцию обработанных аудиофайлов в Unity. Это включало тщательный выбор подходящих методов загрузки (например, потоковая передача для более длинных треков или предварительная загрузка для критических звуковых эффектов) для оптимизации производительности во время игры. Команда настроила параметры сжатия Vorbis, чтобы найти баланс между качеством звука и использованием ресурсов.

Кроме того, были тщательно приняты решения о том, следует ли обрабатывать определенные аудиофайлы в {Mono} или стерео, в зависимости от их роли в звуковом дизайне и желаемых эффектов пространственной локализации в игре.

Строгий процесс оптимизации, реализованный на заключительном этапе, привел к значительным улучшениям в хранении и производительности. Используя формат OGG и регулируя настройки сжатия, аудио ресурсы были сжаты до примерно 10 МБ в общей сложности. Это означает значительное сокращение по сравнению с предполагаемыми 500 МБ, если бы использовались несжатые файлы AIFF, или 100 МБ для эквивалентов MP3. Эти результаты не только минимизировали общий размер игры, но и обеспечили эффективное использование памяти и плавное воспроизведение звука во время игры.

Развертывание на нескольких платформах

Сотрудничая с Spatial над многоплатформенным веб-релизом, команда PIGIAMA KASAMA приняла URP, предпочтительный конвейер платформы. Будучи дизайнером с 15-летним опытом работы в CGI, Стелла использовала множество инструментов для различных целей и была впечатлена возможностями URP.

URP отлично работает. Я быстро научился использовать это для достижения нашей цели с Касама: Пробуждение. Я думаю, что это достигло практически всего, о чем я думал, так что я очень доволен," - говорит он.

Гибкость и эффективность конвейера рендеринга были особенно важны для команды при развертывании на веб-платформах, поскольку кроссплатформенная совместимость и настраиваемость помогли им легко масштабироваться.

Производительность может быть оптимизирована для каждой платформы, даже на устройствах нижнего уровня, и разработчики могут использовать свои собственные шейдеры. Он создан для того, чтобы хорошо справляться в будущем», объясняет Стайнерман. «С точки зрения платформы Spatial, по мере того как мы начнем поддерживать будущие версии Unity, мы ожидаем, что URP также будет поддерживаться там.»

Серверы Spatial создали индивидуальные сборки и оптимизировали каждую платформу. Они помогли команде PIGIAMA KASAMA с их сборкой WebGL, а также с отдельными сборками для Android и нативной iOS. У них были разные целевые качества для определенных платформ.

Глубина резкости работает довольно хорошо на WebGL, но мы обнаружили, что она менее производительна на некоторых мобильных устройствах. С другой стороны, аудио на Android и iOS работает гораздо производительнее», — говорит Фанчин. «Мы могли бы лучше использовать фильтры и эквалайзер, аудиоинструмент, который позволяет разработчикам регулировать уровень громкости определенных частот в аудиоресурсе, на Android, но это не сработало бы на WebGL.»

Они настроили определенные элементы так, чтобы они соответствовали каждой платформе, в то время как другие были адаптированы специально для платформы. Для WebGL мы использовали текстуру с более высоким разрешением, так как экран обычно больше, и использовали текстуры с более низким разрешением на меньших мобильных экранах. В целом, многоплатформенный релиз прошел довольно гладко," заключает Стелла.

Включение игроков в путешествие

После того как команда PIGIAMA KASAMA решила создать веб-игру, им нужно было найти способ разрабатывать качественный контент в управляемых частях. Они выбрали систему эпизодического выпуска, которая позволила им собирать отзывы игроков после каждого эпизода, которые они могли бы учитывать в будущих выпусках. Это также помогло им быстро тестировать и повторять.

«Мы разработали гибкую дорожную карту, которая позволяет нам корректировать процесс разработки на основе отзывов игроков и новых технологий», — объясняет Стелла. Каждый эпизод планируется с учетом будущего, что обеспечивает естественное развитие повествования и игровых механик со временем.

Выбор этого графика выпуска также принес множество проблем. Команда должна обеспечить согласованность между эпизодами как с точки зрения качества, так и повествования. Управление ожиданиями игроков также может быть потенциальным препятствием, поскольку эпизодические релизы требуют деликатного баланса между предоставлением достаточного количества контента, чтобы удовлетворить игроков, и поддержанием их интереса к следующему выпуску.

В целом, команда многому научилась и с нетерпением ждет возможности применить эти знания во втором эпизоде. «Мы гордимся тем, что продолжаем демонстрировать качество опыта, который разработчик может создать для WebGL», — говорит Фанчин. «Как небольшая студия, мы рады видеть, чего мы можем достичь с технологическими достижениями, такими как Unity 6 и WebGPU.»

Расширенные возможности с Unity 6

Главная цель Unity 6 — предоставить возможность быстрой и простой разработки игр непосредственно вам, где бы ни находились ваши игроки. Загрузите Unity 6 в Unity Hub.