19 октября 2018 19.10.18 11 16K

Плоский объём. Как в играх делают фейковые интерьеры

+110
Лучший блог недели
1000 ₽

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

Только в окнах, в этой крохотной части почти любой привычной для нас игровой локации, иногда скрывается гигантский пласт технического гения. К сожалению, мой котелок моментально задымился в попытках самостоятельно познать тонкости реализации окон и фейковых интерьеров. Пришлось даже обратиться за помощью к админу телеграмм-канала «Геймдев, который мы заслужили» (спасибо ему), который направил мой гуманитарный мозг на путь истинный, и теперь я постараюсь максимально кратко и доступно пересказать то…

Как делается магия

Итак. Если 3D художник той или иной игры, руководствуясь собственным чувством прекрасного, либо из под палки арт директора, решил не ставить на окна и витрины игровых локаций пустые текстурные заглушки, то перед ним открывается множество возможностей просрать несколько дней свой жизни и придать глубину внутриигровой архитектуре. Конечно, всегда можно по-честно построить за окнами настоящие 3D интерьеры, но что если таких окон будет несколько десятков? А если несколько тысяч? Тут-то и наступает время для технологических фокусов.

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

Parallax Mapping

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

Saints Row 3

То же самое реализовали и в Assassins Creed 3, но немного замылили окна, чтобы косяки не так явно бросались в глаза. Получилось дешево и сердито.

Assassins Creed 3

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

Bioshock Infinite

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

Amplify Shader Editor значительно упрощает работу с многослойными фейковыми интерьерами

Parallax Mapping выглядит здорово и интересно, но максимально просто и эффективно можно реализовать плоские интерьеры с помощью CubeMap (кубической текстуры). Трёхмерный интерьер разворачивают на 5 плоскостей – (пол, потолок и три стены) и с помощью вектора, направленного из камеры вглубь интерьера, определяют, что именно увидит игрок с данного конкретного ракурса. Имея в памяти развертку интерьера, система на лету рисует плоскую текстуру, которая максимально точно симулирует трёхмерную комнату.

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

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

Фейковые интерьеры, построенные с использованием кубмаппинга, могут выглядеть очень круто и сколько угодно масштабироваться, но и тут есть свои подводные камни. Так как текстуры стен готовятся заранее, иногда можно увидеть дверь или глухую стену там, где должно было быть окно. Разработчики нового Spider-Man могли обойти это узкое место, отрисовав отдельные интерьеры для угловых комнат, но решили не запариваться.

Spider-Man

Впрочем, накосячить с фейковыми интерьерами можно не только из-за несовершенства технологий, но и просто по собственной невнимательности. Что уж говорить, когда даже Blizzard, известные своим маниакальным перфекционизмом, оставляют на одной из карт Overwatch витрину в «потустороннее измерение».

 

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

Unity-InteriorMapping

P.S.
Это пост из моего блога на Яндекс Дзене. Велком туда, если юзаете этот сервис.


BioShock Infinite

Платформы
PC | Mac | Linux | PS3 | PS4 | PS5 | X360 | XONE | XBOXSX | NSW
Жанр
Дата выхода
26 марта 2013
5.6K
4.5
5 055 оценок
Моя оценка

Saints Row: The Third

Платформы
PC | Linux | PS3 | X360 | NSW | Stadia | OnLive
Жанры
Дата выхода
15 ноября 2011
3.3K
4.3
2 577 оценок
Моя оценка

Assassin's Creed III

Платформы
PC | PS3 | PS4 | PS5 | X360 | XONE | XBOXSX | Wii U | NSW | Android | J2ME | Stadia
Жанр
Дата выхода
30 октября 2012
3.8K
3.9
3 243 оценки
Моя оценка

Overwatch

Платформы
PC | PS4 | PS5 | XONE | XBOXSX | NSW
Жанр
Дата выхода
24 мая 2016
1.1K
4.0
1 173 оценки
Моя оценка

Marvel's Spider-Man

Платформы
PC | PS4 | PS5
Жанр
Дата выхода
7 сентября 2018
3.4K
4.3
2 469 оценок
Моя оценка

Лучшие комментарии

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

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

Но за блог — спасибо.
А не все нормально, снизу ваше имя. Прошу прощения за невнимательности.
На Хабре была статья исключительно про Паука, на другом ресурсе было несколько примеров использования параллакса. Всё остальное – продукт собственных ковыряний в вопросе и общения с человеком, практикующим эти штуки (или очень хорошо разбирающимся).
Подобное я проходил в универе, изучая комп. графику — и это вам не какие-нибудь рисования в фотошопе, а дикие вычисления позиционирования 3Д-объектов в 2Д-плоскости. Только математика, только хардкор!
взял статью с хабра или сам перевел обзор?
спасибо за доп примеры, не знал про такую магию в байошок
То-то мне гифки знакомыми показались (https://simonschreibt.de/gat/windows-ac-row-ininite/).
Статья хоть и на забугорном но вдруг кто хочет больше тех-деталей
Спасибо, очень познавательно!
Интересно, но мало и больше какие-то заметки, чем полноценная статья для блога. Но главное, зачем столько гифок с резкой анимацией? Очень тяжело читать между ними, отвлекает взгляд постоянно.
Очень интересная стаття, спасибо за информацию
Ваше работа в паблике. Вы выкладывали или они без спроса у вас взяли?
vk.com/@science_technology-ploskii-obem-kak-v-igrah-delaut-feikovye-interery
Читай также