[Перевод] Дизайн цвета загадочных миров Dead Cells


Привет, меня зовут Гвенаэль Массе, мы с Тома Вассё — единственные художники инди-студии Motion Twin. Среди прочего, передо мной была поставлена задача создания дизайна фонов Dead Cells. Надеюсь, что информация о моём производственном процессе может кому-нибудь пригодиться.

Давайте приступим. Фундамент художественного стиля Dead Cells основывался на трёх столпах: насыщенной цветовой палитре, кельтской архитектуре и теме алхимии.


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

Благодаря этому игрок лучше понимает происходящее, а значит, и быстрее реагирует на потенциально смертельные источники опасности. И это замечательно подходит к такой активной игре, которой мы стремились сделать Dead Cells.

С практической точки зрения, мы используем столько яркости, сколько можем, то есть мы почти полностью сосредоточены на насыщении средних тонов. Комплементарные палитры (состоящие из противоположных цветов) отлично передают ощущение замкнутости пространства, и поэтому мы активно используем их в дизайне уровней внутри помещений. На открытых уровнях мы делаем упор на близкие по оттенку цвета, потому что они позволяют придать больше нюансов и деталей ландшафту, но даже здесь мы используем комплементарные палитры, подчёркивающие разницу между открытыми и закрытыми областями.

29c1b671c505bc0b0f0b5b1615a59263.jpg


Комплементарные палитры, используемые в закрытом уровне (Toxic Sewers)

191b9f487fd6ec419b8ac046753e5724.jpg


Палитра из близких цветов, использованная на открытом уровне (Promenade of the Condemned)

Всегда насыщенные, но никогда не гостеприимные


Чтобы сохранить согласованность между лором игры и её графикой, мы использовали этот принцип на каждой из уровней. Мы всегда добавляли настораживающие фоновые элементы, которые внезапно открываются игроку, внимательно наблюдающему за фоном. Нам всегда нравится контраст, создаваемый мирным окружением в котором можно было бы провести выходные, и мрачными следами, оставленными тварями, которые на самом деле здесь живут.
Эта идея применяется с самого начала Dead Cells. В первой сцене главный персонаж поднимается в сиянии тёплого света, в то время как труп погибшего великана покоится в тенях холодных цветов.

da6aa6c7996c87f63213e4aa6796ca52.jpg


Начальная сцена Dead Cells

Несмотря на наличие зомби и постоянное присутствие в игре ощущения опасности, мы не хотели имитировать художественный стиль подобных игр. Например, палитры с высокой контрастностью и низкой насыщенностью активно используются в Salt and Sanctuary или в серии Souls, создавая достаточно драматическую атмосферу.

ecbf17b1b692f46419c726c9f2702a6e.jpg


7a6b4a349d99a58c503a4a3a873954d3.jpg


Пара произвольных скриншотов из Интернета

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

Поэтому Dead Cells пытается сочетать отчаяние и ощущение увядшей славы останков древнего королевства с более светлыми тонами, яркими персонажами и юмористическими штрихами. Мы хотели создать игру, которая бы не воспринимала себя слишком серьёзно. С точки зрения художника, насыщенность позволяет графически соответствовать этому стремлению. Лучи яркого солнечного света противопоставляются мрачным подземельям и рушащимся башням, красивый лес и пёстрый свет контрастирует с окровавленными ловушками и пыточным инвентарём.

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

Кроме того, существовала и практическая причина: контрастность цветовых палитр повышает читаемость игры. Источники угрозы выделяются на уровне и время реакции игрока естественно лучше, если он чётко видит, что пытается его убить.

И наконец, когда ты начинаешь проект наподобие Dead Cells, надеешься, что он будет готов примерно за полтора года, но подсознательно ты понимаешь, что эта игра станет твоим миром, твоей повседневной работой, твоими сверхурочными, темой твоих разговоров на несколько лет… Поэтому нужно создавать то, в чём тебе приятно будет находиться долгое ремя!

Кельтская архитектура


События Dead Cells происходят на Острове, вдохновлённом островом Скай в Шотландии, и в частности, архитектурой X-XIII веков. На эти постройки в основном повлияло кельтское христианство, поэтому мы выбрали такую архитектуру, как отсылку к холодной и жестокой природе старых зданий, а также остальных знаковых черт этого стиля, например, характерных базальтовых колонн.

Мы пытались воссоздать в Dead Cells гнетущую атмосферу, создаваемую этими элементами, чтобы напоминать игроку об опасном мире, который он исследует. Органические детали архитектуры служат связью между этим неуютным антуражем и оккультной стороной лора Dead Cells: алхимией.

83c83480b8e1247b2e235f828ab130ef.jpg


Одна из фотографий, использованных как референсы для Острова из Dead Cells

bfdd5295b460f4836c3a677719f95193.jpg


Базальтовые колонны, ставшие источником вдохновения для концепт-арта Dead Cells

4a8d090bacc281896b61cc2b7e7d67d6.jpg


Другие фотографии, использованные в качестве референсов для игры, можно посмотреть здесь.

Алхимия и магия


Этот третий столп объединяет всё вместе: лор, фон, монстров, геймплей, биомы и т.д. Например, Collector принадлежит магическому аспекту Dead Cells и является ключевым элементом системы развития меты, позволяющим игроку узнать о мире немного больше.

92d6f53858ec604673ccb70e20da3e33.jpg


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

9f2dec56b10ff1f02a2224f7351337c6.jpg


Эти три лейтмотива образуют фундамент художественного стиля Dead Cells. Поверх него были добавлены правила, связанные с геймплеем и техническими ограничениями (читаемостью действий, дизайном уровней, камерой и т.д.), учитывающие ту же самую старую цель: обеспечение соответствия дизайна уровней с приятностью для глаза игрока.

Читаемость действий


Активность игрового процесса Dead Cells требует, чтобы игрок имел возможность и способность реагировать быстро; в противном случае игра казалась бы нечестной и раздражающей. Чтобы помочь игроку «считывать» происходящее на экране, графика должна отражать степень важности каждого элемента информации.

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

Следующим после коллизий игрок должен увидеть различные геймплейные элементы, с которыми он может взаимодействовать: лестницы, платформы и т.д… Их степень контрастности должна находиться где-то между фоном и препятствиями.

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

ce5c2b68041e4452749cea4229674070.gif


Сохранение единства геймплейных компонентов


Некоторые геймплейные компоненты встречаются на каждом уровне, поэтому они должны быть заметны игроку каждый раз, когда появляются на экране, вне зависимости от графического стиля уровня и его закрытости/открытости.

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

6c8c8129cbcc5469764a56f0b283a214.jpg


Сравнение фонтана молодости и могилы элиты.

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

Переходы между двумя биомами


Уровни игры генерируются процедурно, но с миром всё иначе: последовательность имеющихся уровней спроектирована и тщательно продумана. Это позволяет нам соединять биомы убедительным и правдоподобным образом, чтобы у игрока не возникло ощущения, что переход нелогичен. Например, спуск в глубины канализации для того, чтобы добраться до крепостного вала (вершины замка) без логичного перехода не имел бы смысла.

Чтобы устранить эту проблему, мы добавили обязательный лифт перед попаданием на крепостной вал, а также длинный туннель перед канализацией. Они наглядно сообщают игрока направление и местоположение.

9619082750a18fd78bada197f9316950.jpg


Выходу на крепостной вал всегда предшествует лифт

Добавление глубины к открытым уровням


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

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

0dff0dcb83a95dec0f817f4e27c7d9af.jpg


Концепт-арт кладбища

Вкратце о нашей технике


Украшение интерьеров

Одной из основных проблем в дизайне декораций для уровней Dead Cells стало то, что для их создания мы используем процедурную генерацию. Чтобы обеспечить единство в пределах биома и сохранить реалистичность расположения декоративных элементов (дверей, альковов, факелов и т.д.), несмотря на случайность, создаваемую процедурной генерацией, мы начали с разделения фона на секции разных размеров. К каждому элементу декораций применялся собственный набор правил: например, факелы должны располагаться рядом с альковом или дверью.

46981cb4e90dea61b71121a829c27bb3.jpg


Каждый цвет обозначает отдельный тип секции.

Цветовые палитры и карты градиентов

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

107a793f2697c81e0ef20126d723e27d.jpg


Текстура для деревьев на фоне

f343310b83c8190757ce0b56e582da70.jpg


Карты градиентов

Такой подход очень часто доказывал свою полезность. Например, мы могли создавать вариации одинаковых уровней или при необходимости перерабатывать весь биом. Биом уровня Promenade изначально был оранжеватым и напоминал пламя, что стало проблемой, когда мы решили для целей геймплея поменять этот уровень местами с уровнем перед крепостным валом (Ramparts). Мы обнаружили, что эти два биома слишком близки графически, чтобы находиться рядом друг с другом…

d7f3d15e497de01d1e4944fe41355a56.jpg


Слева: первая версия Promenade of the Condemned, справа: Ramparts

Но благодаря нашему рабочему процессу мы гораздо проще смогли заменить карту градиентов, придав уровню совершенно иное ощущение.

c4d37df752c2691b5650c8cbbe0eac57.jpg


Вторая версия Promenade of the condemned

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

7b2cc6e30f0a63b592691d84315f0384.jpg


Наш небольшой самописный инструмент для настройки переменных

Карты нормалей

Любопытный факт: Motion Twin — это, вероятно, одна из немногих видеоигровых студий, рисующих карты нормалей… вручную. Если вкратце, то карта нормалей — это вторая текстура, применяемая к базовой текстуре и определяющая, как элементы будут реагировать на свет (будь то свет от факела, заклинание, и т.д.). Обычно карты нормалей генерируются в 3D-пакетах или при помощи специальных плагинов Photoshop. Однако все испытанные нами плагины разочаровали нас. Часто они рендерили слишком плоскую, размытую или чеканную картинку, схожую с поверхностью монеты. Это не совсем то, к чему мы стремились.

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

509a3cec4418b6be3121e40e2a2c4ed2.jpg


Вот как выглядит текстура Dead Cells в Photoshop.

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

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

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

Надеюсь, эта статья вас заинтересовала, а может быть, даже оказалась полезной. Разумеется, если у вас возникли вопросы или что-то не совсем понятно, то вы можете обратиться с Тома или со мной в Twitter.

© Habrahabr.ru