Gamedev Дмитрий Мучкин
5 768

Создание реалистичного окружения на Unreal Engine 4

Как создавать материалы, растительность и настраивать освещение.

В закладки

Автор ресурса 80.lvl взял интервью у Андрея Александрова, художника по окружению в Bluehole. Андрей рассказал, как проходил процесс создания сцены «Весна в горах». DTF c разрешения главного редактора 80.lv Кирилла Токарева публикует перевод материала.

Создание «Весны в горах»

Обычно я работаю над предметами окружения, интерьерами и внешним видом помещений, но в этот раз я хотел научиться создавать огромные ландшафты как в «Ведьмаке 3» с помощью World Machine и Unreal Engine 4. Я опирался на виды природы Шотландии.

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

{ "items": [{"title":"\u0421\u0445\u0435\u043c\u0430 World Machine","image":{"type":"image","data":{"uuid":"9244587e-9e8c-4ae8-f469-ce38e1ca2ff9","width":1523,"height":865,"size":228536,"type":"jpg","color":"","external_service":[]}}},{"title":"\u0422\u0440\u0451\u0445\u043c\u0435\u0440\u043d\u043e\u0435 \u043f\u0440\u0435\u0432\u044c\u044e","image":{"type":"image","data":{"uuid":"ede2988c-d2df-6af7-4001-2b48671dfcfe","width":1107,"height":790,"size":155981,"type":"jpg","color":"","external_service":[]}}},{"title":"\u041f\u0440\u0435\u0432\u044c\u044e \u043c\u0430\u0441\u043e\u043a","image":{"type":"image","data":{"uuid":"d8f4759f-1ef5-e03b-29bd-fecb69a9e950","width":1286,"height":786,"size":201610,"type":"jpg","color":"","external_service":[]}}}] }

После этого я загрузил карту высот в Landscape Editor в Unreal Engine 4 и создал материал ландшафта. Он довольно простой — всего три разных материала, соединённых с помощью масок. Кое-где я вручную добавил снег.

{ "items": [{"title":"\u041c\u0430\u0442\u0435\u0440\u0438\u0430\u043b \u043b\u0430\u043d\u0434\u0448\u0430\u0444\u0442\u0430","image":{"type":"image","data":{"uuid":"be28c357-59e9-e1b6-5346-f522f303f364","width":1484,"height":996,"size":367999,"type":"jpg","color":"","external_service":[]}}},{"title":"","image":{"type":"image","data":{"uuid":"e85989aa-bd9a-7c87-f238-e4a6d6d06d03","width":1621,"height":750,"size":236720,"type":"jpg","color":"","external_service":[]}}}] }

После того, как я закончил ландшафт, я подумал, что стоит добавить ещё что-нибудь. Например, небольшой домик в низине. Работа над такой сценой всегда начинается с поиска референсов и создания заготовки.

Вот референс для дома

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

Я выбрал плотность текселей в 1024 на 100 сантиметров, чтобы текстуры вблизи выглядели хорошо. После этого я использовал плагин TexTools для 3ds Max. Он быстрый, качественный и бесплатный. И в нём есть много классных фич вроде копирования коэффициента текселей с других объектов, автоматической установки групп сглаживания с UV-оболочек и так далее.

Материал для крыши я сделал в Substance Designer, затем добавил на неё рёбра. Я создал четыре разных деформированных участка, импортировал их в UE4 и распределил по крыше для лучшей производительности.

Детали

Одной из моих задач было обойтись без запечённых текстур. В этой сцене запечены только текстуры стекла и двери. Для всех объектов я создал три простых основных материала: один для обычных предметов, второй для вертексной краски, третий для растений.

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

Растения

В этой сцене было важно создать реалистичную растительность. Для этого я воспользовался Quixel Megascans.

Вот процесс создания травы.

Создайте плоскость и поместите на неё непрозрачную текстуру травы. Я использовал плоскость 200×200 сантиметров с сегментами 10×10.

Затем отделите каждую часть атласа.

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

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

Вот основной материал для растений.

Так что не забывайте разрабатывать уровни детализации. Для травы я сделал два уровня детализации, уменьшил их в Simplygon на 15%. Для распределения травы я пользовался инструментом Foliage. Он довольно простой.

Материалы

Материалы я сделал в Substance Designer. Люблю эту программу.

Вот схема материала скалы.

На землю я нанёс цельную текстуру мёртвой травы от Megascans.

Карта высот штукатурки была сделана в ZBrush. Потом я смешал карты высот в Substance Designer и получил разные текстуры для использования в UE4.

Освещение

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

В этой сцене я использовал полностью динамический свет и тени, и он работает в Full HD при 60 кадрах в секунду на моей GTX 970.

Свет из окон — точечный. Для естественного света я использовал Exponential height fog и карту HDRi. Это позволило создать желаемую атмосферу. Вот как это влияет на сцену.

{ "items": [{"title":"\u0411\u0435\u0437 \u0442\u0443\u043c\u0430\u043d\u0430","image":{"type":"image","data":{"uuid":"52fc07a7-942a-af78-c929-7d697db6b5a4","width":1540,"height":732,"size":206226,"type":"jpg","color":"","external_service":[]}}},{"title":"\u0421 \u0442\u0443\u043c\u0430\u043d\u043e\u043c","image":{"type":"image","data":{"uuid":"2dd47986-b64c-22c5-3b1f-6e6ba8b6cc53","width":1547,"height":722,"size":181951,"type":"jpg","color":"","external_service":[]}}}] }

Также я прицепил направленный свет к небесной сфере с помощью Blueprint. Так получился солнечный свет.

Вот несколько полезных настроек света.

И не стоит забывать о постобработке.

Вот как она влияет на сцену.

{ "items": [{"title":"\u041f\u043e\u0441\u0442\u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0432\u044b\u043a\u043b\u044e\u0447\u0435\u043d\u0430","image":{"type":"image","data":{"uuid":"0cce6480-e449-441f-d4b9-9a4efbc49d97","width":1093,"height":708,"size":193076,"type":"jpg","color":"","external_service":[]}}},{"title":"\u041f\u043e\u0441\u0442\u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0432\u043a\u043b\u044e\u0447\u0435\u043d\u0430","image":{"type":"image","data":{"uuid":"f89d6166-60d2-ff44-91e2-9236b5c563bd","width":1090,"height":704,"size":143850,"type":"jpg","color":"","external_service":[]}}}] }

Камера

Я делаю скриншоты в UE4 с помощью CineCamera, потому что у неё есть много настроек вроде фокусного расстояния, глубины резкости и апертуры — прямо как у настоящей камеры.

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

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

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

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

#опыт #unreal

{ "author_name": "Дмитрий Мучкин", "author_type": "editor", "tags": ["unreal","\u043e\u043f\u044b\u0442"], "comments": 5, "likes": 84, "favorites": 74, "is_advertisement": false, "subsite_label": "gamedev", "id": 14793, "is_wide": true }
{ "id": 14793, "author_id": 6322, "diff_limit": 1000, "urls": {"diff":"\/comments\/14793\/get","add":"\/comments\/14793\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/14793"}, "attach_limit": 2, "max_comment_text_length": 5000 }

5 комментариев 5 комм.

Популярные

По порядку

Антон Антонов

5

Also I attached the Direct light to the sky sphere via Blueprint.

Также я добавил направленный свет на небесную сферу с помощью Blueprint.

Attached в смысле прицепил. Прицепил свет к небесной сфере, чтобы он направление света менялось вместе с ней.

Ответить

Дмитрий Мучкин

Антон
0

А, вон оно что. Спасибо!

Ответить

Maxim Gorban

1

Дёшево, но со вкусом, так сказать )

Ответить

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

Dorubut 2k30

0

Как же это все сложно.

Ответить

Roman Morriarte

0

Спасибо, интересно и полезно, жду чего-нибудь еще по UE4)

Ответить
0

Прямой эфир

Подписаться на push-уведомления
[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "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" ], "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": "createAdaptive", "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-1134314964", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=clmf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudo", "p2": "ftjf" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fzvc" } } } ]