Создание современного игрового 3D окружения от White Noise Team.

В рамках работы над проектом Twin Soul мы ведем Devlog и часто получаем вместе с фидбеком вопросы о создании игрового контента. Подобную информацию трудно уместить в рамках одного комментария, что сподвигло на написание данной статьи.

Вне зависимости от того, слышали ли вы краем уха слова “полигон” и “нормалка”, занимаетесь разработкой видеоигр, или же простой обыватель — мы постарались сделать статью максимально понятной и интересной для всех. А конкретно — мы расскажем о нашем пайплайне (поэтапный алгоритм ведения работы) создания простых игровых моделей (на жаргоне разработчиков — “пропсов”; от англ. “props”), познакомим с технической терминологией, и дадим несколько практических советов.

1. Сбор референсов.

В первую очередь все начинается с подбора референсов (вспомогательные изображения в качестве примера). Неисчерпаемым и бессмертным источником референсов является Google.

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

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

Для более глубокого погружения мы стараемся максимально правдоподобно копировать референс в виде 3Д. “Эксперты” любящие писать “Вот так вот не бывает!” знайте — на каждое “не бывает” у нас есть фото, подтверждающее обратное.

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

2. Моделирование — базовая теория.

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

Готово! Получена желаемая форма, но для использования в игре она не годится. Это пока еще скетч, на основе него предстоит сделать две модели, и начнем с низко полигональной (полигон — плоскость 3Д модели описанная точками), будем называть такие объекты — LP (low poly).

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

Вроде то что нужно, но хотелось бы скруглить конус и вообще сгладить все острые углы. При этом нам нельзя увеличивать количество полигонов.
Дело в том что каждый полигон по стандарту имеет свой уникальный вектор, отвечающий за его шейдинг (как ложится на поверхность тень) и называется этот вектор — нормаль. Именно из-за набора уникальных нормалей у каждого полигона — конус выглядит граненым. К счастью, c помощью настроек групп сглаживания можно задать для всей модели одну и ту же нормаль.

Выходит не очень, и становится очевидно, что для “графона” грамотный подход в работе с нормалями жизненно необходим. Относительная погрешность в виде подобных артефактов допускается, но в данном объекте сгладим только конусную часть.

При моделировании сложной геометрии могут возникнуть различные ошибки в построении полигональной сетки LP, приводящие к искажению полигонов. Один из популярных способов избежания подобных ошибок — триангулирование (деление полигонов на треугольники).

В примере выше “кривой” полигон был триангулирован по разному, путем соединения ребром разных точек и в результате получились две разные формы. Любая полигональная графика изначально строится на основе треугольников, так или иначе среда разработки поделит полигоны, но не всегда как нужно. Кроме того, триангулирование дает дополнительные возможности в работе с нормалями, а в некоторых случаях помогает избавиться от артефактов, вызванных жесткими группами сглаживания. Правильно строя сетку можно значительно оптимизировать модели и улучшить их визуальное качество.

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

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

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

Теперь деталь полностью готова к экспорту в игровой движок. Но такие квадратные формы явно не подходят под определения “современного игрового окружения”, по прежнему хочется сгладить все углы. Для этого мы возвращаемся к нашему 3D скетчу и сделаем из него высоко полигональную модель HP (high poly).

Модель сглажена за счет большого количества полигонов и их нормалей, теперь предстоит задача перенести эти нормали с HP на LP. Перенос осуществляется методом запекания в ранее созданную развертку, на выходе мы имеем карту нормалей, где RGB значение каждого пикселя соответствует XYZ значения вектора.

Возникает вопрос, зачем мы настраивали группы сглаживания на LP, если собираемся использовать карту нормалей? К сожалениею, карта нормалей лишь вспомогательная, для обмана зрения. Во время рендера векторы карты нормалей будут умножены на базовые.

3. Подробнее о картах нормалей.

Для максимального эффекта карты нормалей нужно заранее хорошо сгладить углы и выделить детали в HP модели больше, чем в реальном аналоге (референсе). Базовые нормали LP объекта можно также использовать для подчеркивания формы.

Использования подобных карт — не новинка в игровой графике, но современный пайплайн создания фотореалистичного контента требует совершенно иной уровень качества. Именно поэтому создание почти каждого объекта требует дополнительно HP вариант, что увеличивает временные затраты разработки. Моделирование промежуточного скетча, сетка которого позволяет быстро получить HP и LP, экономит время и, кроме того, габариты двух моделей выходят идентичными. Чем больше идентичность HP и LP — тем меньше выходит проблем с запеканием нормалей.

Во время запекания на основе LP сетки строится клетка “захвата”, форма клетки влияет на угол проекции запекания. И иногда нам приходится добавлять в LP дополнительные ребра, тем самым выровнять клетку и исправить некоторые “косяки”. После временные ребра можно удалить.

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

Для непосредственного запекания может использоваться почти любой современный пакет 3D моделирования, но мы используем Substance Painter 2 (программа для процедурного текстурирования, далее SP2). Помимо нормалей, софт позволяет качественно запекать на основе HP целый ряд различных карт. К примеру, карта базового затемнения (Ambient Occlusion — АО) или карта высот (Height Map). Эти и некоторые более технически сложные карты могут участвовать в генерации необходимых визуальных деталей — грязь, потертости на углах, и т.п.
В качество нюансов можно указать что работаем мы исключительно с OBJ форматом, как показала практика общепризнанный FBX по неизвестным причинам может выдать неприемлемый результат.

4. Иные методы моделирования.

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

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

Часто нас спрашивают, используем ли мы фотограмметрию (способ получения 3D объекта с помощью фотографий), бытует мнение, что данный способ является чуть ли не манной небесной. К сожалению, для качественной фотограмметрии нужен студийный равномерный свет, дополнительная работа с фото, большое время для просчета. На выходе получаем меш с хаотичной высокополигональной сеткой, и для дальнейшей работы требуется проведение ретопологии (изменения топологии сетки), а после — устранения артефактов с помощью скульптинга. Одним из преимуществ фотограмметрии является создание реалистичной текстурной карты, но она тоже требует дополнительные правки и сильно ограничивает в оптимизации развертки.

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

Стандартом для создания тканевых ассетов в игровых пайплайнах давно уже стал Marvelous Design. Продукт позволяет создавать и симулировать ткани из заготовленных пользователем выкроек. Наша команда пока еще только осваивает новый инструментарий, но он уже нашел свое применение и для создания предметов окружения.

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

5. Материалы — базовая теория.

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

С приходом консолей последнего поколения в пайплайн разработчиков внедрился новый технологичный стандарт, пришедший в игры из кинематографа — физически корректный шейдинг (сокращено PBS, в сети можно встретить также под аббревиатурой PBR, IBR). Технология представляет с собой наиболее наиболее подобную реалтайм симуляцию взаимодействия света и материалов.

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

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

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

Остальная информация о материале раскидана по остальным картам, их количество зависит от особых физ свойств объекта, которые требуется просимулировать. В нашей пайплайне для простых объектов, на базе работы с Unreal Engine 4 используется не так много карт. К знакомым нам уже картам нормалей и альбедо добавляется рафнес (roughness — карта шероховатости), металик (metalic карта металличности) и АО (ambient occlusion — карта базового затемнения).

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

6. Создание материалов.

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

Программа предназначена для работы с PBR и по аналогии с Marvelous Designer широко распространена среди игровых разработчиков. В базе SP2 имеется библиотека уже готовых процедурных материалов. При наличии прямых рук и художественного вкуса, можно быстро “разукрасить” большинство простых объектов, не прибегая к использованию сторонних ресурсов.

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

Путем манипуляций с Curvature map (карта кривизны) и наложением стандартных материалов можно получить стальной чайник с эффектами стертой краски по краям.

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

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

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

Фактически чайник уже готов, но его внешний вид не подходит под определение “старый”. Как правило, для эффекта состаривания добавляются грязь, царапины, цветовые вариации и пр. На данном этапе работа по большей части идет на уровне Roughness maps (карты шероховатости). Естественно, карты шероховатости уже содержаться в базовых материалах, но ничто не мешает добавить новые поверх них. Для тела чайника мы добавим карту, имитирующую потертости, а для ручки — еще и следы от пальцев.

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

Каким бы не был крутой софт, он не сможет все грамотно нарисовать за вас путем лишь манипуляций с настройками. Финальная доводка и добавление деталей не обходится без ручного режима рисования. Для подобной работы обязательно нужен графический планшет.
Из дополнительных приемов можно отметить использование старых добрых фото-текстур. Для подобного чайника, как и для другой утвари из советского периода, характерны декоративные изображения цветов. Найдем в гугле подходящую картинку и с помощью фотошопа подготовим для дальнейшей работы. Cамая большая сложность — найти изображение хорошего качества, без засветов, теней, перспективы. Готовую текстуру импортируем в SP2 и проецируем на поверхность чайника.

В качестве экономии времени незначительные детали можно не отмоделивать в HP. SP2 содержит в себе набор заготовок, или же можно найти найти на просторах гугла заготовки в виде карт высот. Например, мы добавим болты-крепежи на ручках.

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

7. Работа с контентом в UE4.

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

Одна из основ оптимизации современной графики — сокращение количества текстурных карт, материалов и упрощение последних. Тем самым мы уменьшаем количество обращений к видеокарте для отрисовки элементов. К сожалению, текстурных карт даже в простом чайнике выходит не мало, и они требуют дополнительной оптимизации. Если внимательно взглянуть на AO, Roughness и Metalic, можно заметить что все три карты черно-белые, а почти любые цифровые изображения стоят из RGB каналов, каждый из которых является градацией серого. Проще говоря, один цветовой канал позволяет хранить одну черно-белую текстуру. В результате мы сливаем все три вышеуказанные карты в одну текстуру.

Различные дополнительные карты, к примеру для светящихся материалов или материалов с прозрачностью, мы дополнительно запаковываем в Alpha канал альбедо текстуры (некоторые форматы изображений имеют помимо RGB дополнительный канал для прозрачностей).

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

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

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

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

Но и тут не без подводных камней. То что в Unreal Engine 4 называется материалом и редактором материалов, является полноценным шейдером и редактором шейдеров. Здорово что шейдер может теперь создавать рядовой художник, пользователи Unity или CryEngine, к примеру, лишены такого удобства в стандартной коробке, но любая работа созданная таким образом генерирует полноценный C++ код и, к сожалению, не самый оптимизированный.

Раньше материал представлял собой экземпляр конкретного шейдера с изменением параметров или текстурных карт, но неизменным кодом. Граница понятий и терминов во многих 3Д редакторах со временем размылась, но возможность создавать традиционные “материалы” в UE4 осталась, и в подобном виде у нас хранятся материалы для большинства объектов.

Послесловие.

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

twitter.com/WN_Team
vk.com/whitenoiseteam
www.youtube.com/c/WhiteNoiseTeam
www.facebook.com/twinsoulgame/