{ "author_name": "Глеб Диденко", "author_type": "self", "tags": ["\u0430\u0440\u0442","\u043e\u043f\u044b\u0442"], "comments": 4, "likes": 39, "favorites": 9, "is_advertisement": false, "section_name": "gamedev", "id": "5029", "is_wide": "" }
Глеб Диденко
4 486
Gamedev

Шведский городок: окружение в стиле Overwatch на Unreal Engine 4

Моделирование светлой и уютной локации.

Поделиться

В избранное

В избранном

В ноябре 2016 года портал 80.lv опубликовал интервью стажёра King, 3D-художника Генриха Монтелиуса (Henric Montelius), создавшего сцену на основе своего любимого шведского города Висбю, стилизованную под мультиплеерный шутер от Blizzard.

DTF публикует перевод статьи.

Меня зовут Генрих Монтелиус, я из Стокгольма, изучаю 3D-графику во Future Games. Визуальная стилизация была интересна мне ещё до занятий 3D-артом, особенно то, как этот приём используется в играх Blizzard.

Visby Environment

«Visby environment» — один из моих главных проектов для Future Games. Висбю — город на самом крупном в Швеции острове Готланд. Я выбрал его, потому что проводил там каждое лето и мне нравятся его пейзажи. В нём уютно, приятно прогуливаться вдоль полуразрушенной стены средневекового города, соседствующей с милыми домами.

Так что этот проект вдохновлён личными чувствами и воспоминаниями. Работая для себя, я всегда выбираю что-то, близкое сердцу. Это помогает сохранить мотивацию и ясно видеть конечный результат.

Мне хотелось, чтобы люди, видевшие сцену, говорили бы: «Эй, да я ходил по этим улицам!». Я провёл немало времени в поисках референсов к конкретным участкам локации на Google Maps.

Рекомендую использовать референсы, как основу для пропорций, материалов и модульности. Моя привязанность к городу, впрочем, несколько замедлила процесс: я был чрезмерно аккуратен и точен во время моделирования базовых каркасов моделей (block out).

Желая стилизовать сцену под Overwatch, я совместил референсы из Google Maps со скриншотами из игры в «таблице настроения» (mood board).

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

Моделирование

Я довольно прямолинейно подошёл к созданию моделей, поскольку стилизацию должны были обеспечить материалы и освещение. Для базовых моделей использовались реалистичные референсы; я внимательно изучал, как создатели Overwatch работают с преувеличенными пропорциями. Оказалось, что у большей части пропов (props) реалистичные пропорции, а маленькие объекты, например, листва, преувеличены, чтобы не вносить в сцену хаос.

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

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

Во время такого моделирования я собираю ассеты в Maya: некоторые части отправляются в ZBrush для высокополигональной «лепки» (high poly sculpting), а у остальных ассетов есть высокополигональные меши (high poly mesh) на скрытом слое. Перед импортом в Quixel меши совмещаются (combine) и переводятся в треугольники (triangulate).

Художники Blizzard прекрасно используют «запекание» деталей (baked details), я долго изучал ассеты в Overwatch. В этом визуальном стиле критически важен правильный баланс между количеством полигонов и «запеканием». Я немало экспериментировал, моделируя низкополигональные ассеты, пока не достиг желаемого результата.

В мешах бордюров меньше полигонов, чем в камнях стены, они не так важны. В мешах некоторых камней кладки полигонов больше: так они не выделяются среди высокополигональных моделей. Также это улучшило качество освещения с более точными картами теней (shadow maps).

Материалы

Я с удовольствием создавал материалы для этой сцены, поскольку люблю заниматься «плиточной» структурой (tiles) в ZBrush. Материал стены пережил бесчисленное количество итераций, пока я не остался доволен результатом. Я постоянно сравнивал картинку с Overwatch, чтобы сохранять мотивацию.

Глядя на то, как Blizzard используют «плиточные» текстуры (tiling textures) в Overwatch, я осознал, что должен найти способ применить их подход.

Я решил создать три очень «гибких» главных материала (master materials). Они постоянно находятся в поле зрения, и должны быть проработаны досконально.

Создание сложного материала (например, для большой стены) лучше начинать с настройки функциональности. Я сделал материал, соответствующий окружению (со свойством «world aligned»), — он позволяет хорошо использовать раскрашивание вершин (vertex painting), чтобы не было заметно, как дублируется текстура (visible tiling). Чтобы добавить глубины, я сделал возможным раскрашивание вершин текстур, основанное на картах высот.

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

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

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

Ещё больше вариаций дало перемещение камней по оси Z. Я несколько преувеличил этот эффект, чтобы во время «запекания» лучше получилась карта высот.

Для экономии времени на «запекание», я обычно применяю NormalRGBMat в Zbrush, сохраняю как текстуру и пробую её в движке. Если она получилась удачной, карты «запекаются» в xNormal.

Обычно я «запекаю» карты затенения (occlusion), кривизны (curvature) и нормалей (normals) для текстурирования в Quixel или Photoshop, но порой добавляю и карту нормалей с самозатенением (bent normal map). Её зелёный канал даёт дополнительную информацию о свете для глубины, что особенно хорошо для «плиточных» текстур. Впрочем, всё зависит от типа ассета и того, как он будет расположен в окружении.

Я решил «запечь» карту высот (height map), чтобы скрыть линейную интерполяцию (lerping) текстур в Unreal Engine 4. Я внёс некоторые правки вручную: изменил контраст, нарисовал трещины и выбоины.

С этими картами я работал на протяжении всего текстурирования в Quixel. Разработчики Overwatch используют карты нормалей и шероховатостей (roughness and normals) для многих деталей на текстурах. Мне это нравится: с расстояния альбедо (albedo) выглядит чисто, а мелкие детали видны вблизи. Так что я старался как можно подробнее проработать карту шероховатостей в Quixel. После я корректировал оттенки текстуры, пока она не начала хорошо смотреться в движке.

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

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

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

Освещение

На ранних этапах проекта я собирался использовать динамическое освещение, не задумывался о картах (light maps) и старался обойтись постобработкой. Результат даже близко не был похож на Overwatch.

Мне повезло — во время курсов по созданию окружения я спросил совета у Тильмана Милде (Tilmann Milde) — технического художника по освещению и шейдерам из DICE. Он объяснил важность «запекания» света при помощи световой массы (lightmass).

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

Главный источник света я сделал направленным, а чтобы компенсировать его мягким освещением, добавил свет от неба (one sky light). Они оба были привязаны к доработанной небесной сфере из Unreal Engine. Получилась очень гибкая система, которую можно скорректировать, если это потребуется.

Вот использованные настройки освещения и постобработки:

Для захвата отражений на всей локации использовалась одна большая сфера (sphere reflection capture). После я добавил несколько маленьких сфер в тёмных областях, где собирался добавить непрямое освещение (indirect lighting). Свет в кафе улучшили «порталы» световой массы (lightmass portals) на двери и окнах.

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

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

#арт #опыт

Популярные материалы
Показать еще
{ "is_needs_advanced_access": false }

Комментарии Комм.

Популярные

По порядку

0

Прямой эфир

Узнавайте первым важные новости

Подписаться
[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "clmf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fjog" } } }, { "id": 10, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "create", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "clmf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-250597-0", "render_to": "inpage_VI-250597-0-549065259", "adfox_url": "//ads.adfox.ru/228129/getCode?p1=bxeub&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid21=&puid22=&puid31=&puid32=&fmt=1&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudo", "p2": "ftjf" } } } ]