Как студии Subcult Joint удалось создать более 2000 спрайтов и более 10 000 2D-светильников в Cookie Cutter

Feb 22, 2024|11:00 мин.
Cookie Cutter от Subcult Joint — ключевое изображение Cherry

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

Задача:

Оптимизация ресурсов высокого разрешения и освещения для производительности на нескольких платформах

Персонал проекта:

15

Платформы:

PC, PlayStation®5, Xbox Series X|S

Местоположение:

Брайтон, Великобритания

Как небольшой команде продемонстрировать анимацию, нарисованную вручную, в лучшем свете на разных платформах? Subcult Joint шесть лет работали над проектом Cookie Cutter, который включает тысячи ассетов высокого разрешения, созданных с использованием традиционных методов анимации и оптимизированных в Unity. Студия должна была балансировать между четкой графикой и гибким игровым процессом, и они активно использовали 2D Lights, чтобы добавить глубины графике и игровому дизайну, ориентированному на исследования.

Узнайте, как они реализовали это Vision — и о внезапных изменениях, которые в последний момент раскрыли возможности ускоренного управления ассетами и помогли им вывести освещение на новый уровень.

Вишня и потрошение робота-врага

Каттер печенья от Subcult Joint

Художник, аниматор, преподаватель Unity Learn и основатель Subcult Joint Стефано Гульельмана начал работать над Cookie Cutter в 2018 году. Его вдохновлял отвергнутый персонаж предыдущего проекта Unity: Cherry, жесткий Android. «Я был влюблен в ее дизайн, поэтому начал создавать для нее анимацию», — говорит он. Стефано имел четкое Vision относительно избитого игрового процесса Metroidvania от Cookie Cutter, но для этого ему требовалась поддержка разработчика. Получив финансирование, он нанял программиста Франческо Биццини и список художников и дизайнеров для совместной работы над проектом.

Результаты:

• Продано 60 000 копий и получено 1 200 000 долл. США за месяц с момента запуска

• Удобство управления более чем 2000 спрайтовыми таблицами и более 50 спрайтовыми атласами

• Засветил игру более 10 000 2D-светильников

• Успешный апгрейд до Unity 2022 LTS в середине проекта

Трейлер: Каттер печенья от Subcult Joint

Упаковка контента

Визуализация Cookie Cutter, нарисованная вручную, — это важный источник продаж. Стефано знал, что их будет сложно создать, но дополнительные усилия стоили бы того. «Глазные конфеты — это то, что заставляет нас влюбляться в видеоигры», — говорит он. «В Subcult Joint мы восхищаемся мастерами Studio Ghibli и Disney. Мы еще не достигли такого уровня, но с Cookie Cutter мы хотели развить свои навыки анимации и создать действительно классную игру».

Этот проект крайне амбициозный для небольшой команды. Большинство художественных ассетов (более 1000 фонов, спрайтов, анимаций и эффектов частиц) визуально сложны и кропотливо созданы с использованием традиционных методов анимации. Между персонажем игрока (Cherry) и персонажем NPC (27 стандартных типов врагов и 5 гигантских боссов) каждый персонаж Cookie Cutter имеет 20–40 анимаций. Работа над каждой из этих анимаций может занять от восьми до 48 часов. Разные художники полагались на несколько разных DCC, но Стефано создал большую часть ассетов в Adobe Photoshop.

Когда Стефано закончил работу над иллюстрацией, он использовал PSD Importer, чтобы преобразовать ее в текстуру размером 8K, а затем оптимизировать ее в редакторе для предотвращения переполнения видеопамяти. Интеллектуальное использование настроек импорта текстур помогло уменьшить размер текстур на платформу, а следование лучшим методикам, таким как мощь двух, позволило добиться дальнейшей оптимизации.

Анимация Cookie Cutter, открытая в редакторе Unity

Взгляд в редакторе на различные состояния анимации Cherry. В Subcult Joint много времени уделяли разработке переходов анимации для обеспечения плавности игрового процесса.

«После завершения работы в Photoshop я вручную создал свои спрайтовые листы, помещая ячейки анимации одну за другой в новый файл, всегда кратный 512 x 512, следуя правилу двух правил в Unity, — говорит Стефано. «Оттуда редактор спрайтов Unity упростил нарезку листа или другие трюки, перемещая пиксель листа или поворот листа на кадр». Эти рабочие процессы обеспечили оптимизацию визуальных эффектов Cookie Cutter для различных платформ с минимальными проблемами производительности.

К моменту завершения проекта студия Subcult Joint собрала более 2000 атласов спрайтов в более чем 50 атласов спрайтов, упорядоченных по иероглифам. «Sprite Atlases сильно упростил экспорт игры на различные целевые консоли, сохранив стабильную частоту кадров», — говорит Стефано. «Мы практически сосредоточились на выпуске 60 FPS, чтобы игровой процесс и общая производительность были плавными, как масло. Это потрясающим образом оптимизировало использование памяти и ускорило время загрузки».

Черри сбила врага своей атакой на мотоцикле

Каттер печенья от Subcult Joint

Настройка игрового процесса

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

Учитывая это, ему нужно было уметь работать в редакторе и быстро настраивать игровой процесс без риска сломать проект. Это привело к тому, что Франческо называет одной из самых больших технических трудностей в программировании: Создание гибкой системы в Unity, работающей с плохим вмешательством кода.

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

Боевые способности Cherry

Каттер печенья от Subcult Joint

Для создания пробивного игрового процесса и жестоких комбинаций экшенов Франческо внедрил в Unity сторонний визуальный инструмент ActionGraph для модульного проектирования и структурирования автоматов конечных состояний. Когда загружаются спрайты анимации, ActionGraph позволяет добавить логику игрового процесса в каждый кадр, позволяя художникам настроить параметры, например, коллайдеры или числа повреждений на лету. Например, Стефано может использовать ActionGraph, чтобы добавлять хитбокс в атаку и настраивать его активность на определенных кадрах, включать и отключать счетчики переходов, запускать генерацию боевых ресурсов и тратить их и так далее, без участия программиста.

Кроме того, Франческо запрограммировал несколько собственных настроек редактора, чтобы больше художников и специалистов Subcult Joint могли принять участие в проекте. UpWire, основанный на системе визуализации xNode, позволяет художникам с легкостью управлять как человеком, так и ИИ, редактировать коллайдеры, добавлять визуальные эффекты в определенные узлы анимации и многое другое.

Upwire для управления вводами, коллайдерами и визуальными эффектами

Комбинированная система графов от Cookie Cutter — Subcult Joint может настраивать хитбоксы и параметры для создания атак, объединяющих их, добавлять визуальные эффекты, такие как тряска камеры, и настраивать реакцию врагов на атаки.

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

Boss Sprite Sheet из Cookie Cutter

Graph Combo для боя с боссом. Subcult Joint может настроить такие факторы, как сила, направление и значение отражения атаки, или настроить реакцию босса на атаки различных типов оружия Cherry.

Timeline EZ Events, еще один пользовательский инструмент Франческо, позволяет дизайнерам отправлять сообщения и вызывать функции непосредственно в редакторе без ограничений по параметрам, включая объекты сцены, а также добавлять несколько функций к объекту GameObject. Например, команда может создать рычаг, открывающий дверь при нажатии и одновременно скрывающий маркер «запертая дверь» на карте и мини-карте.

События Timeline EZ

Для создания кат-сцен Cookie Cutter студия Subcult Joint использовала Timeline EZ Events. Этот инструмент позволяет создавать кинематографические моменты, создавая последовательность анимации персонажей, движений камеры, звука и визуальных эффектов.

Чтобы помочь дизайнерам в работе над мини-картой Куки Каттера, что очень важно для любой игры, посвященной исследованиям, Франческо создал EzMiniMapPro. «Этот инструмент используется для создания карт игровых зон и имеет ряд полезных функций по настройке и оптимизации изображения, — говорит Франческо. «В процессе выполнения поддерживает анимированные маркеры наложения и автоматические исследовательские маски на основе того, что видит камера. Маску можно записать и восстановить с помощью SaveGame».

Разработка и внедрение этих настроек потребовали много усилий, но они открыли творческую свободу всей команде, дав каждому сотруднику Subcult Joint место за столом переговоров по дизайну, механике и игровому балансу Cookie Cutter.

EzMinimapPro

С помощью EzMiniMapPro Subcult Joint смогли записать всю карту, созданную в редакторе, и экспортировать изображение в Photoshop. Оттуда Стефано мог нарисовать поверх сгенерированной карты визуальный стиль игры, после чего импортировать ее обратно в Unity.

Проектирование мира

Огромный мир Cookie Cutter — Мегаструктура — включает девять областей, которые нужно исследовать. Когда работа над концепт-артом области была завершена, дизайнер уровней Subcult Joint Габриэль Рэймонд Рой создал лабиринт для игроков.

«Хороший дизайнер уровней умеет создавать начальные и второстепенные пути, которые интересно исследовать, а также прокладывать, — говорит Стефано. «Каждый тупик должен иметь определенную награду за игрока, а на каждом открытом участке должны быть встречи с врагами, чтобы игроки могли обрабатывать материалы».

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

Вид камеры Cookie Cutter в перспективе

Освещение Мегаструктуры

«Мы старались придать каждой области уникальность, но с учетом обстановки киберпанка и нашей любви к вешалкам и металлическим заводам я не уверен, насколько нам это удалось, — шутит Стефано.

Для придания каждой зоне собственного визуального колорита Subcult Joint широко использовала в URP точечное и свободное 2D-освещение. Мир Куки Каттера освещают более 10 000 пользователей. «Каждый свет в игре освещает наши спрайты в реальном времени, создавая ощущение плотности и слаженности персонажей, анимации и окружений, — говорит Стефано. «В темных местах персонажи затеняются и купаются в лучах света, попадая под перенасыщенные и загрязненные небесные фонарики снаружи. Мне очень нравятся эти детали!»

Масштабный мир Куки Каттера, Мегаструктура

Каттер печенья от Subcult Joint

Subcult Joint использовали готовые 2D-освещения Unity без специального управления, применяя их на всех слоях по оси Z, как и спрайтовые окружения. «2D-светильники по умолчанию потрясающе освещают игровую область, и это здорово, что вы можете решать, какие слои они могут затронуть», — объясняет Стефано. «Мы хотели, чтобы слой по умолчанию всегда был понятен игроку, чтобы он мог понять, где ходить, а где нет. Затем мы добавили освещение для фона, переднего плана и дальних слоев».

Привлекательное 2D-освещение от Cookie Cutter играет важную роль в общем игровом дизайне. Как Metroidvania, игра имеет исследовательскую направленность. Освещение используется для создания экологических сигналов для игрока. «Освещение — это сюжет, показывающий, куда двигаться игроку, куда он движется, или где скрыты второстепенные необязательные пути», — объясняет Стефано.

Мерцающие огни привлекают внимание игрока. Стефано рассказывает, как он создал такой эффект: «Самое прекрасное в 2D Lights — это возможность их анимации, — говорит он. «Создать мерцающие огни очень просто: Вы выбираете источник света, заходите в окно Animation, создаете другую анимацию и играете с интенсивностью — 0, 9, 0, 9 — и копируете эту анимацию на другие источники света, если хотите создать аналогичный эффект в другом месте».

2D-анимация, таблицы спрайтов, источники света и эффекты в каттере для печенья

Преимущества бонусов благодаря обновлению версии в последний момент

Ближе к концу разработки Cookie Cutter проблемы с переполнением видеопамяти стали препятствием для сборки PlayStation 5. В Subcult Joint поняли, что им нужно обновить версию Unity, чтобы устранить проблему.

Сделать это так близко к запуску было не идеально, но не охватить широкую аудиторию PlayStation не представлялось возможным - поэтому они засучили рукава и принялись за перенос проекта на Unity 2022 LTS, самый актуальный выпуск на тот момент. Это дало им доступ к новым инструментам профилирования и отладки, таким как обновленный профайлер памяти.

«Новая функция сравнения снимков в Memory Profiler помогла нам выявить и устранить сохраняющиеся проблемы с переполнением видеопамяти, — говорит Франческо. «2022 LTS также ускорила импорт текстур, а обновление в итоге сделало нашу игру намного стабильнее».

Регенерация вишни с помощью ее функций Void

Каттер печенья от Subcult Joint

Как оказалось, переход на новейшую версию Unity позволил им добавить в Cookie Cutter последний слой визуальной отделки, которую иначе было бы невозможно получить, поскольку теперь они получили доступ к готовой к коммерческому использованию системе 2D Lights. Это потребовало индивидуального анализа и исправления тысяч экспериментальных ранее источников 2D-освещения в игре на основе новых параметров — к счастью, этот процесс стал быстрее благодаря новым функциям.

Благодаря обновленному атласу спрайтов 2022 LTS Subcult Joint смогла легче и эффективнее выводить сотни анимаций, нарисованных вручную, на различные целевые платформы. А полная версия 2D Lights от URP помогла сделать окружение еще более глубоким и настроенным.

«Мы использовали новый 2D Light Explorer, чтобы выбирать каждый источник света и вносить изменения вручную, — объясняет Стефано. «В основном мы использовали пятнистые и свободные источники света, и в Unity 2022 LTS была обновлена функция выпадения источников света, которая выглядела намного лучше предыдущей. Это была большая работа, но мы смогли устранить проблемы и улучшить игру еще больше».

Первая игра Subcult Joint Cookie Cutter — это пример магии, возникающей при работе художников и программистов. Эта небольшая команда создала визуально амбициозную и успешную игру Metroidvania, которая за первый месяц была продана тиражом более 60 000 копий, и они смогли придерживаться исходного Vision без компромиссов с графикой и игровым процессом.

Обновление до новейшей версии Unity не только помогло Subcult Joint решить застарелые технические проблемы до выпуска, но и позволило им расширить охват платформы Cookie Cutter и полностью раскрыть весь потенциал игры.

Вишня из Cookie Cutter едет на мотоцикле

Каттер печенья от Subcult Joint

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

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