Процесс воссоздания стиля студии Ghibli в 3D

Анализ ключевых особенностей творческого подхода.

Разработчики из Kids With Sticks в своём блоге рассказали, как пытались воссоздать художественный стиль студии Ghibli для своей неанонсированной игры. Для этого они проанализировали творчество японской студии и выделили ключевые особенности её подхода. Мы выбрали из текста главное.

При переносе 2D-стиля в 3D одной из ключевых проблем стал перенос фонов. Анимировать мазки кистью на предметах не так уж сложно, а вот их оптимизация — реальная проблема. Именно поэтому разработчикам пришлось значительно упростить объекты, текстуры и материалы, чтобы рисовать нужно было как можно меньше элементов.

Процесс воссоздания стиля студии Ghibli в 3D

По словам разработчиков, стиль Ghibli — по-настоящему сложная и комплексная вещь, поэтому они потратили несколько недель на тестирование и эксперименты с разными подходами. В итоге Kids With Sticks пришла к нескольким ключевым чертам стиля.

  • Текстуры должны выглядеть живописно, а не мультяшно.
  • Тщательный подбор цветовой гаммы вызывает определённые эмоции.
  • Растительность нарисована размыто и с минимумом деталей. Исключение: элементы, которые важны для изображения биома, обрамления кадра и так далее.
  • Небо и фон имеют решающее значение с точки зрения создания атмосферы вымышленного мира.
  • Изменчивое окружение — мир реагирует на действия и преобразуется.
  • Мультфильмы Ghibli используют элементы как восточной, так и западной культур и, таким образом, интересны глобальной аудитории.
  • Цвета используются понятно и предсказуемо: ночные и дневные кадры часто имеют одну и ту же цветовую палитру, а диапазон цветов меняется в зависимости от эмоции, которую они должны вызвать.
  • Материал камней: Ghibli использует много плоских поверхностей. Они часто нарисованы слабозаметными мазками кисти, а для крупных камней видимые детали создаются очень тщательно, чтобы отразить шероховатость, но не настолько, чтобы отвлекать внимание от силуэта камня. Текстуры не доминируют над формой, а скорее дополняют и делают её более разнообразной.
  • Материал деревьев: стволы деревьев на заднем плане обычно нарисованы одним или двумя цветами, а на коре есть незначительные детали. Стволы больших деревьев на переднем плане детализированы, но формы упрощены, а мазки кисти можно различить.
Процесс воссоздания стиля студии Ghibli в 3D

Также Kids With Sticks сосредоточилась на цветовой палитре, чтобы вызвать определённые эмоции от разных биомов.

Магия и неизведанность
Магия и неизведанность
Воображение и свобода
Воображение и свобода
Приключение
Приключение
Опасность
Опасность
Возрождение и обновление
Возрождение и обновление

В своей игре Kids With Sticks использует полностью динамическое освещение.

Процесс воссоздания стиля студии Ghibli в 3D

Разработчики использовали только подвижный SkyLight с DFAO и направленный свет с Distance Field Shadows, а это — основа освещения для их игры.

Distance Fields меш
Distance Fields меш
Distance Fields <a href="https://api.dtf.ru/v2.8/redirect?to=https%3A%2F%2Fru.wikipedia.org%2Fwiki%2FAmbient_occlusion&postId=107600" rel="nofollow noreferrer noopener" target="_blank">ambient occlusion</a>
Distance Fields ambient occlusion

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

Без DFO
Без DFO
С DFO
С DFO

Для создания листвы, кустов и деревьев разработчики пересматривали классические мультфильмы студии Ghibli. Так художники смогли выбрать эталонные элементы и изображения, чтобы в дальнейшем использовать их при создании 3D-сцен.

Текстура, созданная вручную в Photoshop
Текстура, созданная вручную в Photoshop
После создания текстуры разработчики сделали несколько простых мешей в Blender. Следующим шагом было создание больших мешей, из которых потом можно собрать деревья или кусты
После создания текстуры разработчики сделали несколько простых мешей в Blender. Следующим шагом было создание больших мешей, из которых потом можно собрать деревья или кусты
Затем разработчики использовали модификатор Data Transfer для правильного затенения
Затем разработчики использовали модификатор Data Transfer для правильного затенения
Верхний ряд — затенение с модификатором. Снизу — без модификатора. Важно включить опцию Auto Smooth в Blender: без неё кастомные нормали не будут работать
Верхний ряд — затенение с модификатором. Снизу — без модификатора. Важно включить опцию Auto Smooth в Blender: без неё кастомные нормали не будут работать
После применения модификатора можно собирать финальные деревья или кусты
После применения модификатора можно собирать финальные деревья или кусты

Итоговый вариант не до конца устраивал команду. Поэтому разработчики решили экспериментировать дальше.

Процесс воссоздания стиля студии Ghibli в 3D
Команде не нужны были реалистичные листья — они не вписывались в общий стиль. Упрощение позволило сделать листву более живописной
Команде не нужны были реалистичные листья — они не вписывались в общий стиль. Упрощение позволило сделать листву более живописной

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

В итоге команда нашла иное <a href="https://api.dtf.ru/v2.8/redirect?to=https%3A%2F%2Fforums.unrealengine.com%2Fdevelopment-discussion%2Frendering%2F1560181-two-sided-material-with-custom-vertex-normals&postId=107600" rel="nofollow noreferrer noopener" target="_blank">решение</a>
В итоге команда нашла иное решение
Листва без кастомных нормалей
Листва без кастомных нормалей
Финальный результат
Финальный результат
Разработчики использовали highlight height mask для изменения цвета кустов и деревьев. Позже это позволило изменить направленный свет, чтобы усилить освещение
Разработчики использовали highlight height mask для изменения цвета кустов и деревьев. Позже это позволило изменить направленный свет, чтобы усилить освещение
Это дало возможность создать больше цветовых вариаций на деревьях и растительности
Это дало возможность создать больше цветовых вариаций на деревьях и растительности
Для пропсов разработчики использовали только базовый цвет и карту нормалей
Для пропсов разработчики использовали только базовый цвет и карту нормалей

По словам команды, на этом этапе было очень важно уметь создавать стилизованные текстуры. Художники пытались использовать Coat3d, но в конечном итоге остановились на Photoshop и Substance Designer.

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

В качестве фона разработчики использовали нарисованные в 2D пейзажи, наложенные на 3D-объекты. Команда хочет, чтобы у игроков возникало ощущение, что их окружает огромный мир.

Процесс воссоздания стиля студии Ghibli в 3D

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

Процесс воссоздания стиля студии Ghibli в 3D

Для создания финальной картинки разработчики решили дополнительно подкорректировать цвета, чтобы это было больше похоже на стиль Ghibli.

До
До
После
После
До
До
После
После

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

159159
24 комментария

Круто, но вообще финальных результат не похож на визуал гибли

44
Ответить

Комментарий недоступен

21
Ответить

Даже китайцы лучше копируют:

4
Ответить

Комментарий недоступен

9
Ответить

Этот пример несоизмеримо больше похож на работы студии Gibli, чем пример из статьи

2
Ответить

пытались воссоздать художественный стиль студии Ghibliстиль Ghibli — по-настоящему сложная и комплексная вещьпотратили несколько недель на тестирование и эксперименты с разными подходами

А могли бы просто поиграть в Ni no Kuni и посмотреть как все придумали за них.

9
Ответить

В создании второй части Ghibli вообще не принимали участие, а в первой стиль узнаётся лишь в персонажах.

Ответить