Из чего состоит графика?

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

Статья будет разделена на несколько отдельных частей:

1. Текстуры.

Стоит начать с текстур. Возможно многие не знают, но в играх уже давно модель персонажа или любого другого объекта состоит не из одной текстуры. В Call Of Duty: Black Ops 3 для лиц героев используется 6 текстурных карт, которые сейчас детально разберём.

Текстуры для лица.
Текстуры для лица.

Color map задаёт изображение, которое будет наложено на модель. Это может быть картинка кирпичной стены, досок или любого другого изображения.

Normal Mapping – это технология, используемая для имитации неровностей поверхности на объекте. Она применяется, чтобы сделать вашу финальную модель более похожей на ее высокополигональную версию. С ее помощью можно добавить различные детали, которые нельзя передать через геометрию из-за ограничений полигонажа на вашем проекте, и заставить вашу модель выглядеть более скругленной для лучшей передачи освещенности и большей реалистичности.

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

Карты нормалей – это RGB изображения, где каждый из каналов (красный, зелёный, синий) интерпретируется в X, Y и Z координаты нормалей поверхности соответственно. Красный канал пространства касательных карты нормалей отвечает за ось X (нормали направленны влево или вправо), зелёный канал за ось Y (нормали направлены вверх или вниз) и синий канал за ось Z (нормали направлены прямо от поверхности.

Карта нормалей.
Карта нормалей.

Gloss — эта карта контролирует резкость отражений. При самом высоком показателе материал становится зеркальным, а при нулевом значении — матовым.

Warframe.
Warframe.

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

Карта трансмиссии.
Карта трансмиссии.

Fuzz map используется для создания различной растительности. Например, борода, брови, мох на дереве.

Лица выглядят более естественно.
Лица выглядят более естественно.

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

Пример использования occlusion map в игровом движке Unity.
Пример использования occlusion map в игровом движке Unity.

2. Тени.

Тени считаются реалистичными, когда их основание выглядит четко, а дальше тень рассеивается. За такой эффект отвечают soft shadows.

Grand Theft Auto V.
Grand Theft Auto V.

Ambient occlusion используется для затенения объеĸтов, создания теней на стыĸах стен.

Сравнение ambient occlusion.
Сравнение ambient occlusion.

3. Освещение.

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

Screen space god rays это более «дешёвый» способ отображения солнечных лучей. Самый главный минус этого метода в том, что лучи находятся в пространстве экрана, если смотреть на источник освещения. Отводя камеру от источника света, лучей будет не видно и эффект объема пропадёт.

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

Global illumination — это название ряда алгоритмов, используемых в трёхмерной графике для более реалистичной имитации света.

Глобальное освещение рассчитывает не только прямое освещение, но и отражения света, цветовые отскоки.

Глобальное освещение в Call Of Duty: Black Ops 3.
Глобальное освещение в Call Of Duty: Black Ops 3.

4. Отражения.

Cube map — методика для моделирования отражений на поверхности объекта. Кубические карты не показывают динамику, а это значит, что декали и персонажи не будут отображены при таком методе отражения.

Пример использования кубической карты.
Пример использования кубической карты.

Screen space reflections — отражения, построенные по принципу трассировки лучей в пространстве экрана. Главные минусы таких отражений, это артефакты по краям экрана и исчезновение отражения при повороте камеры вниз или вверх.

Destiny 2.

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

Grand Theft Auto V.
Grand Theft Auto V.

5. Дополнительно.

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

Например, объёмные облака, которые взаимодействуют с источником света и самозатеняются.

Horizon: zero dawn.
Horizon: zero dawn.

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

Вот просвечиваемое ухо у главного героя Uncharted 4.
Вот просвечиваемое ухо у главного героя Uncharted 4.
Также подповерхностное рассеивание хорошо подходит для растительности: травы, листвы.
Также подповерхностное рассеивание хорошо подходит для растительности: травы, листвы.

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

174174
46 комментариев

Нормальная статья 

50
Ответить
13
Ответить

Извини меня, но тут капец как поверхностно и пользы не принесёт вообще тому, кто это читает. Читателю же по-любому интересно, как работают технологии. Собственно половины настроек, встречающихся в играх, тут нет. Написал бы хоть влияние на производительность. Ну и отдельно стоит упомянуть текстурирование black ops 3. Почему именно эту игру? Тут даже не все карты используются, а также часть названий искажены под их движок. Roughness - это почти тот же glossness, только первое название встречается почти во всех движках. Про карту трансмиссии вообще впервые слышу, но звучит как z-buiffer, так что какой в ней смысл?
Касательно статьи о трассировке, может просто своруешь у IXBT огроменную статью? Смысла писать про неё нет, т.к. коротеньких статей по ней куча, а если напишешь также, то она шибко не разъяснит, как лучи работают.
Для тех, кому реально интересно, как работает графон, держите ссылочки на статьи поподробнее. Сначала лучше начать с сайта stopgame, там и весело, и понятно. Статья о PBR освещении: https://stopgame.ru/blogs/topic/66047 Линия статей по основам нового графона + как влияет на производительность.
Часть 1: https://stopgame.ru/blogs/topic/55415
Часть 2: https://stopgame.ru/blogs/topic/55667
Часть про сглаживание: https://stopgame.ru/blogs/topic/55929
Часть 3: https://stopgame.ru/blogs/topic/55951
Как работает трассировка лучей во всех подробностях: https://www.ixbt.com/3dv/directx-raytracing.html Но предупреждаю, она тут на 2 часа чтения, что весьма много, ещё и лучше читать всё целиком за раз.
Лучшая статья о том, как работает затенение, вокселями и просто SSAO/HBAO: https://nvpixels.wordpress.com/2017/10/13/%D1%87%D1%82%D0%BE-%D1%82%D0%B0%D0%BA%D0%BE%D0%B5-ambient-occlusion-%D0%B8-%D0%B7%D0%B0%D1%87%D0%B5%D0%BC-%D0%BE%D0%BD-%D0%BD%D1%83%D0%B6%D0%B5%D0%BD/
Как работают мягкие тени PCSS. HFTS от Nvidia: https://nvpixels.wordpress.com/2017/12/08/%D0%BA%D0%B0%D0%BA-pcss-%D0%B8-hfts-%D1%82%D0%B5%D0%BD%D0%B8-%D1%83%D0%BB%D1%83%D1%87%D1%88%D0%B0%D1%8E%D1%82-%D0%BA%D0%B0%D1%87%D0%B5%D1%81%D1%82%D0%B2%D0%BE-%D0%B3%D1%80%D0%B0%D1%84%D0%B8%D0%BA/
Статья про DLSS: https://dtf.ru/hard/108592-4k-i-120-fps-na-maksimalkah-kak-tehnologiya-dlss-2-0-izmenit-nashe-otnoshenie-k-proizvoditelnosti-v-igrah
Как работает VXGI/SVOGI: https://habr.com/ru/company/mailru/blog/353740/
Хорошая статья XYZ по нормалям: https://dtf.ru/gamedev/96898-vse-pro-bake-zapechku-kak-etap-aaa-payplayna
И развёртке: https://dtf.ru/gamedev/83063-uv-razvertka-aaa-payplayn-4-7-samyy-polnyy-gayd
Ну и это в основном всё, что понадобится для настройки графики + знание, как оно работает и почему столько ест. Чтобы узнать, почему настройки съедают много, то лучше пользоваться nvidia guidence(https://www.geforce.com/whats-new/guides) даже через переводчик, т.к. подробно разъясняется сколько отдельная настройка ест в кадрах и как влияет на видяху, процессор.

44
Ответить

Эта статья была нужна уже хотя бы для того, чтобы ты ссылок накидал.

15
Ответить

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

8
Ответить

Лучшая статья о том, как работает затенение, вокселями и просто SSAO/HBAOно тут капец как поверхностноЛучше по конкретным примерам изучать что бы то ни было, т.е. код рендера и шейдеры. А это всё теория, понимать и самостоятельно имплементировать(!) которую можно только уже хорошо, практически разбираясь в этом. Так что это разные уровни поверхностного мема "Рисуем сову" :)
Но опять же какова цель, разбираться теоретически в принципах и писать код (либо разбирать чужой) разные вещи, шишек не мало на этом набито :)

2
Ответить

cохранил тупую статью, что бы сохранить умный комент 

Ответить