Создание карты нормалей (normal map), карты смещения (displacement map), карты затенения/освещения (ambient occlusion map), самоовещенной карты нормалей и карты отражений/блеска (specular map) из текстуры или карты высот (heightmap) для игровых движков на примере Unity3D. Часть 6. Создание карты высот из текстуры и рисование карты высот для текстуры.

Часть 6. Создание карты высот из текстуры и рисование карты высот для текстуры.

В предыдущей части статьи был представлен Обзор приложений для создания различных карт (карт нормалей, карт отражений, карт высот, карт смещения, ssbump и т.д.), включая NVIDIA Texture Tools для Adobe Photoshop, SSBump Generator, xNormal, плагин normalmap для GIMP, Smartnormal (онлайн), CrazyBump и Обзор Awesome Bump.

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

 

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

Получая пожертвования автор сайта уделяет меньше времени на сон и больше — на написание уроков и статей :). Спасибо! 

Как создать карту высот ИЗ текстуры

Как было сказано ранее, описанные выше способы преобразования текстуры в карту высот, нормалей и т.д. крайне желательно (если вы хотите получить в финале качественную 3D модель) использовать только в том случае, если светлые пиксели на текстуре совпадают с предполагаемыми возвышениями/выпуклостями, а темные пиксели – с углублениями/впадинами.

Давайте рассмотрим текстуру, которая не подходит для создания из нее карты нормалей. Для этих целей я скачал текстуру кирпичной стены с pixabay.com и создал из нее бесшовную текстуру размером 512×512.

На рисунке показана бесшовная текстура кирпичной стены. bricks-459299-512x512
На рисунке показана бесшовная текстура кирпичной стены.

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

На рисунке показана загруженная текстура кирпичной стены в Normalmap Online и получившаяся карта нормалей. normal-map-online-wrong-normals
На рисунке показана загруженная текстура кирпичной стены в Normalmap Online и получившаяся карта нормалей.

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

Так что же делать? Одним из возможных вариантов является продемонстрированная выше возможность в графических редакторах инвертировать изображение. Загрузите текстуру в GIMP, выберите вкладку “Цвет” в главном меню и затем выберите “Инвертировать” в выпадающем подменю. Чтобы обесцветить изображение, в этом же подменю выберите вкладку “Обесцвечивание…” и выберите одну из Основ оттенка серого: “Освещенность”, “Светимость” или “Среднее”.

На рисунке показан процесс инвертирования и обесцвечивания текстуры в GIMP и получившийся результат. normal-map-online-image-inverting-gimp
На рисунке показан процесс инвертирования и обесцвечивания текстуры в GIMP и получившийся результат.

Посмотрим на результат в Normalmap Online.

На рисунке показана созданная карта нормалей из обесчвеченной и инвертированной текстуры кирпичной кладки. normal-map-online-wrong-normals-inverted-bw
На рисунке показана созданная карта нормалей из обесчвеченной и инвертированной текстуры кирпичной кладки.

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

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

На рисунке показан процесс осветления темных областей карты высот в GIMP. В частности, показан процесс частичного удаления получившихся слишком светлыми участков текстуры при помощи инструмента ластик. Слева от текстуры показана используемая для ластика кисть. В меню слева вы можете видеть настройки прозрачности для ластика. normal-map-online-image-inverted-lighten-gimp
На рисунке показан процесс осветления темных областей карты высот в GIMP. В частности, показан процесс частичного удаления получившихся слишком светлыми участков текстуры при помощи инструмента ластик. Слева от текстуры показана используемая для ластика кисть. В меню слева вы можете видеть настройки прозрачности для ластика.

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

На рисунке показана карта нормалей, получившаяся из подкорректированной карты высот. normal-map-online-wrong-normals-inverted-converted-bw
На рисунке показана карта нормалей, получившаяся из подкорректированной карты высот.

Посмотрим в сравнении, что было и что стало.

Рисунок демонстрирует в приложении Normalmap Online сравнение получившихся карт нормалей в зависимости от исходной карты высот. normal-map-online-comparison
Рисунок демонстрирует в приложении Normalmap Online сравнение получившихся карт нормалей в зависимости от исходной карты высот.

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

 

Рисуем карту высот ДЛЯ текстуры

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

На рисунке показана карта высот (слева), созданная для текстуры (справа). height-map_painting-gimp
На рисунке показана карта высот (слева), созданная для текстуры (справа).

Загрузим карту высот и диффузную карту в Normalmap Online.

На рисунке показана созданная карта нормалей средствами Normalmap Online и результат ее применения (вместе с диффузной картой) на 3D примитиве в окне предпросмотра. normalmap-online-poster
На рисунке показана созданная карта нормалей средствами Normalmap Online и результат ее применения (вместе с диффузной картой) на 3D примитиве в окне предпросмотра.

Конечный результат

Теперь посмотрим, как это будет выглядеть в Unity3D.

На рисунке показан результат создания карты высот, ее преобразования в карту нормалей и использование ее вместе с диффузной картой (текстурой) в Unity3D. western-texture-unity3d
На рисунке показан результат создания карты высот, ее преобразования в карту нормалей и использование ее вместе с диффузной картой (текстурой) в Unity3D.

 

 

Автор: Максим Голдобин

goldmaxval@gmail.com

Добавить комментарий