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


Урок по созданию карты нормалей (normal map), карты смещения (displacement map), карты затенения/освещения (ambient occlusion map), самоовещенной карты нормалей и карты отражений/блеска (specular map) из текстуры или карты высот (heightmap) для игровых движков на примере Unity3D. Часть 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На рисунке показана бесшовная текстура кирпичной стены. bricks-459299-512x512На рисунке показана бесшовная текстура кирпичной стены.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

 

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

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

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

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

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

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

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

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

 

 

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

[email protected]

Post Views: 6 297

www.3dbuffer.com

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

В предыдущей части статьи было рассказано про Теорию карт нормалей.

Данная часть статьи посвящена мини-обзорам программ и плагинам для генерации карт, включая карты нормалей, карты смещения, самоосвещенной карты нормалей, карты освещения/затенения и карты отражений из текстуры и карты высот. В данной части статьи, помимо уже упомянутого в одной из предыдущих частей Normalmap Online, обозреваются такие программы и плагины, как Normalmap Online, NVIDIA Texture Tools for Adobe Photoshop (NVIDIA Normal Map Filter), SSBump Generator, xNormal, GIMP normalmap plugin и SmartNormal, CrazyBump и Awesome Bump.

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

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

NVIDIA Texture Tools для Adobe Photoshop

Раз разговор зашел о картах нормалей, не могу не сказать еще об одном удивительном инструменте NVIDIA Texture Tools for Adobe Photoshop, который позволяет:

— работать с сжатыми текстурами (в частности открывать .dds файлы Direct Draw Surface и сохранять их в формате RGB в сжатом и несжатом видах;

— генерировать карт нормалей из карт высот и, как было сказано выше, походящих текстур, посредством NVIDIA Normal Map Filter, входящим в состав данного набора утилит;

— создавать мип-мапы (мип-карты, Mip maps), т.е. копии текстуры с разной детализацией разного размера, позволяющие при текстурировании выбирать изображение с наиболее подходящим размером;

— создавать кубические карты/кубические текстуры Cubemaps (пришедшие на смену Sphere maps), в частности, использующиеся для создания окружения/неба, и состоящие из шести квадратных текстур, являющимися гранями куба, окружающего игровой объект.

Более подробно с возможностями данного набора инструментов вы можете ознакомиться на сайте Nvidia, либо в pdf-файлах NVJavaScript.pdf, PhotoshopDDSPlugin.pdf и PhotoshopNormalMapFilter.pdf, которые будут доступны вам в папке “\\Program Files\NVIDIA Corporation\“ или в “\\Program Files (x86)\NVIDIA Corporation\“после установки пакета.

Для того чтобы запустить плагин, выберите слой, на котором хотите применить фильтр, затем  вкладку Filter в главном меню, в котором выберите вкладку NVIDIA Tools, а в ней – NormalMapFilter.

Карты нормалей, создаваемые в NVIDIA Texture Tools for Adobe Photoshop в режиме по умолчанию, как и 3ds Max, имеют инвертированный зеленый канал, следовательно, для того чтобы они правильно работали в Unity3D, необходимо инвертировать ось Y (Invert Y) при создании карты нормалей из текстуры или карты высот.

На рисунке показаны созданные карты нормалей из текстуры. nvidia-filter-normal-mapsНа рисунке показаны созданные карты нормалей из текстуры. nvidia-filter-normal-mapsНа рисунке показаны созданные карты нормалей из текстуры.

Как видно из рисунка, NVIDIA Normal Map Filter не просто позволяет создавать карты нормалей из изображений (в центре), используя большое количество настроек (окна настроек показанынад созданными картами нормалей), но и инвертированные карты нормалей (справа), как если бы цвета текстуры предварительно были бы инвертированы.

Также в данном плагине существует возможность предпросмотра карты нормалей на 3D модели (плоскости), что присутствует и в плагине для Фотошопа xNormal, который является частью standalone версии xNormal.

16-битный фильтр для плагина от nVidia доступен по ссылке NormalMapFilter16.zip, который позволяет работать с 16bit изображениями в градациях серого, в которые экспортирует изображения ZBrush.

SSBump Generator

Еще одним представителем семейства генераторов карт нормалей и карт высот является SSbump Generator 5.3 w/ CUDA, который позиционируется, как должно быть понятно из названия, как генератор ssbump карт нормалей (Self-Shadowed Bump Maps). Карты нормалей ssbump являются частью системы самозатенения (хранения карты затенений вместе с картой нормалей), реализованной в движке Source от Valve Corporation. На данном движке был реализован известный Half-Life 2, а также переиздана первая часть данной игры, получившая название Half-Life: Source, которая была издана в 2004 году, и включающая ряд графических нововведений и дополненная изменениями в игровом процессе.

На рисунке показан интерфейс программы SSbump Generator 5.3 w/ CUDA, а также пример создания самозатененной карты нормалей (Self-Shadowed Bump Maps) для движка Source, разработанного компанией Valve. ssbump-generatorНа рисунке показан интерфейс программы SSbump Generator 5.3 w/ CUDA, а также пример создания самозатененной карты нормалей (Self-Shadowed Bump Maps) для движка Source, разработанного компанией Valve. ssbump-generatorНа рисунке показан интерфейс программы SSbump Generator 5.3 w/ CUDA, а также пример создания самозатененной карты нормалей (Self-Shadowed Bump Maps) для движка Source, разработанного компанией Valve.

Помимо ssbump текстур (самозатененных и не самозатененных) SSbump Generator способен генерировать простые карты нормалей, карты высот, а также добавлять карту затенения (ambient occlusion) к изображению. Интерфейс не совсем интуитивно понятный.

Кстати карты нормалей ssbump также можно запечь и в xNormal.

xNormal

xNormal представляет собой приложение для запекания различных карт с высокополигональной 3D модели на низкополигональную, включая закпекание карт нормалей, карт высот, диффузных текстур (Albedo), карт затенения/освещения (Ambient occlusion), bent normalmap (карты нормалей с самозатенением), PRTpn, Convexity map, Thickness map, Proximity map, Cavity map, Wireframe and ray fails, Direction map (Vector Displacement Map), Radiosity normal map (карта нормалей с запеченным освещением), vertex colors хайполи модели, curvature map, карты прозрачности (translucency map), derivative map (карты нормалей в пространстве объекта).

На рисунке показано меню настроек запекания в xNormal. xnormal-maps-to-renderНа рисунке показано меню настроек запекания в xNormal. xnormal-maps-to-renderНа рисунке показано меню настроек запекания в xNormal.

Имеется предпросмотр модели в 3D пространстве в выбранном разрашении, причем как ее highpoly версии, так и lowpoly с возможностью наложения карты нормалей, текстуры, карты затенений, карты отражений (Reflect texture), текстуры блеска/глянцевости (Gloss texture), карты свечения (emissive texture), карты отражений (Reflect texture) и карты глобального освещения (DiffuseGI texture).

Кстати, xNormal поддерживает контроллер Xbox360 для навигации по сцене в окне предпросмотра, достаточно лишь включить его в окне настроек предпросмотра.

На рисунке показано окно настроек предпросмотра 3D модели в приложении xNormal. xnormal-preview-settingsНа рисунке показано окно настроек предпросмотра 3D модели в приложении xNormal. xnormal-preview-settingsНа рисунке показано окно настроек предпросмотра 3D модели в приложении xNormal.

Хватает и настроек в самом окне просмотра.

На рисунке показано окно визуализации загруженной в xNormal 3D модели и варианты ее отображения в окне 3D просмотра: с отображением направления нормалей, карты нормалей, сетки и т.д. xnormal-preview-headНа рисунке показано окно визуализации загруженной в xNormal 3D модели и варианты ее отображения в окне 3D просмотра: с отображением направления нормалей, карты нормалей, сетки и т.д. xnormal-preview-headНа рисунке показано окно визуализации загруженной в xNormal 3D модели и варианты ее отображения в окне 3D просмотра: с отображением направления нормалей, карты нормалей, сетки и т.д.

В программе также доступна опция вращения 3D модели и источника света.

На рисунке показана 3D модель из игры Diablo3, созданная Samuel Arshlevon для Blizzard 2006 contest. x-normal-diablo-3dbufferНа рисунке показана 3D модель из игры Diablo3, созданная Samuel Arshlevon для Blizzard 2006 contest. x-normal-diablo-3dbufferНа рисунке показана 3D модель из игры Diablo3, созданная Samuel Arshlevon для Blizzard 2006 contest.

Помимо работы с 3D моделями приложение xNormal включает в себя набор утилит для работы с изображениями/текстурами. Набор утилит (вкладка Tools в меню справа), входящий в состав xNormal позволяет превратить карту высот в карту нормалей (чтобы загрузить карту высот, перетащите в левое окно карту высот и щелкните Правой Кнопкой Мыши на окне справа, после чего в выпадающем меню выберите вкладку “Generate”), карту нормалей в cavity map, фото — в карту нормалей, карты высот — в occlusion maps, карту высот — в cone map, сгенерировать карту затенений/освещений, включая ambient cube map, а также включает конвертер 3D моделей из одного формата в другой, включая mesh. xNormal также включает в себя Object tangent space converter (нужна лоуполи модель для преобразования тангенциальных карт нормалей в карты нормалей в пространстве объекта и обратно, для чего вам понадобится 3D модель), а также включает Ray distance calculator.

На рисунке показан набор инструментов/ утилит xNormal. xnormal_toolsНа рисунке показан набор инструментов/ утилит xNormal. xnormal_toolsНа рисунке показан набор инструментов/ утилит xNormal.

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

Некоторые утилиты xNormal доступны в плагине для Фотошопа, например, создание карт затенений и карт нормалей из карты высот. Плагин позволяет нормализовывать карты нормалей и создавать Cavitymaps (могут использоваться для имитации грязи в углублениях) из карты нормалей.

На рисунке показано меню создания карты нормалей из изображения (текстуры, карты высот) плагина xNormal для Фотошопа, а также диффузная карта и результирующая карта нормалей. xnormal_normalmap-pluginНа рисунке показано меню создания карты нормалей из изображения (текстуры, карты высот) плагина xNormal для Фотошопа, а также диффузная карта и результирующая карта нормалей. xnormal_normalmap-pluginНа рисунке показано меню создания карты нормалей из изображения (текстуры, карты высот) плагина xNormal для Фотошопа, а также диффузная карта и результирующая карта нормалей.

Есть и фильтр для расширения краев изображений/текстур “Dilation” (Filter->xNormal->Dilation), по сути являющийся аналогом параметра Margin в Blender’е (выставляется в параметрах запекания карт “Bake”).

Помните Dilate Many из набора AlphaUtility.atn.zip для создания альфа канала для листьев, работа с которым описана в статье “How do I Import Alpha Textures?” руководства пользователя?

На рисунке показан результат работы фильтра Dilation из набора xNormal для Photoshop. dilation-margin-black-texture-invertedНа рисунке показан результат работы фильтра Dilation из набора xNormal для Photoshop. dilation-margin-black-texture-invertedНа рисунке показан результат работы фильтра Dilation из набора xNormal для Photoshop.

 

Плагин normalmap для GIMP

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

Плагин normalmap после загрузки с репозитория Google доступен в GIMP в вкладке главного меню Filters->Map->NormalMap (Фильтры->Карта->NormalMap).

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

На рисунке показан плагин normapmap для GIMP. gimp-normalmap-pluginНа рисунке показан плагин normapmap для GIMP. gimp-normalmap-pluginНа рисунке показан плагин normapmap для GIMP.

Как и описанный выше плагин NVIDIA Texture Tools, данный плагин по умолчанию создает карту нормалей с инвертированным зеленым каналом, а, следовательно, его необходимо инвертировать для импорта в Unity3D.

Данный плагин также предлагает пристойный предпросмотр создаваемой карты нормалей в 3D пространстве на одной из пяти 3D моделей-примитивов: плоскости, кубе, сфере, торе и знаменитом “максовском” чайнике Юта/Ньюэлла (хотя, если честно, я ожидал увидеть здесь Blender’овскую Сюзанну).

На рисунке показан затекстурированный чайник Юта/Ньюэлла в окне 3D предпросмотра созданной карты. gimp-3dviewНа рисунке показан затекстурированный чайник Юта/Ньюэлла в окне 3D предпросмотра созданной карты. gimp-3dviewНа рисунке показан затекстурированный чайник Юта/Ньюэлла в окне 3D предпросмотра созданной карты.

 

Smartnormal

Заканчивая обзор бесплатных утилит, плагинов и приложений для создания карт нормалей (и не только), хотелось бы рассказать еще об одном онлайн приложении. Smartnormal представлен в двух версиях – более поздней Smartnormal 2.0 и Smartnormal 1.0.

Основным отличием Smart Normal 1.0  от второй версии является возможность выбора фильтра, который будет использован для создания карты нормалей: упомянутый выше Собель и Condensed. Судя по заверениям разработчиков от февраля 2009 года, данный генератор карт нормалей был (или и сейчас) доступен в виде плагина для After Effects и Photoshop, но требует предустановленного Pixel Bender Plugin.

На рисунке показана текстура и карта нормалей, сгенерированная для нее в онлайн генераторе карт нормалей Smart Normal (Smart Normap). smartnormal-1На рисунке показана текстура и карта нормалей, сгенерированная для нее в онлайн генераторе карт нормалей Smart Normal (Smart Normap). smartnormal-1На рисунке показана текстура и карта нормалей, сгенерированная для нее в онлайн генераторе карт нормалей Smart Normal (Smart Normap).

В данной версии приложения карты нормалей по умолчанию создаются с инвертированым Красным (R) каналом (как в Normalmap Online, описанном выше), так что не забудьте его “обратить” в веру Unity3D. Количество настроек – минимально: Сила (Bias), Размытие (Blur), возможность инвертирования исходного изображения (Invert source) и возможность инвертирования Зеленого (G) и/или Красного (R) каналов.

В SmartNormal версии 2.0 инвертировать каналы уже не нужно, но можно, если очень хочется, например, если вы хотите использовать созданную карту нормалей в 3dsMax. Отличительной особенностью данной версии является поддержка изображений размером 8192*8192 пикселей, сохранение результата без компрессии изображения (в несжатом виде). Реализация на WebGL с поддержкой вычислений на GPU.

На рисунке показано окно онлайн приложения SmartNormal версии 2.0 для создания карты нормалей из карты высот/текстур. smartnormal-20На рисунке показано окно онлайн приложения SmartNormal версии 2.0 для создания карты нормалей из карты высот/текстур. smartnormal-20На рисунке показано окно онлайн приложения SmartNormal версии 2.0 для создания карты нормалей из карты высот/текстур.

 CrazyBump

Приложение CrazyBump отличается возможностью создавать карты нормалей, карты отражения, карты затенения, карты смещения с расширенными настройками для каждой из карт. Данное приложение относится к user-friendly приложениям, поскольку обладает простым и мощным интерфейсом, а также позволяет сохранить/экспортировать все созданные карты одним кликом мыши (конечно существует возможность сохранить каждую карту по отдельности). По умолчанию CrazyBump создает карту нормалей с инвертированной осью Y (в приложении – “Y-axis Down”), однако в меню настроек вы легко сможете это исправить, изменив параметр “Normal map y-axis” со значения “Down” на значения “Up”. Приложение также умеет работать с альфа каналом, сохраняя смещение в альфа-канале карты нормалей. И, что очень важно, особенно для создания ландшафтов (которым будет посвящена ///отдельная серия статей) CrazyBump умеет сохранять карту смещения с 16-битной точностью. Но карта высот с 16-битной точностью может быть сохранена лишь в формате TIFF, в то время как с отключением точности в 16bit вам становится доступно более 30 форматов, которые помимо JPEG и PNG, включают формат Фотошопа PSD, RAW, TIFF64 и даже GIF и ICO. А еще CrazyBump умеет сохранять изображения в градациях серого, выбирать качество и глубину цвета (битность) сохраняемого изображения, и много чего еще.

На рисунке показан основной интерфейс программы CrazyBump с созданными картами для исходной текстуры, а также показаны меню настроек, окно 3D-просмотра и меню настроек параметров сохранения изображения. crazybumpНа рисунке показан основной интерфейс программы CrazyBump с созданными картами для исходной текстуры, а также показаны меню настроек, окно 3D-просмотра и меню настроек параметров сохранения изображения. crazybumpНа рисунке показан основной интерфейс программы CrazyBump с созданными картами для исходной текстуры, а также показаны меню настроек, окно 3D-просмотра и меню настроек параметров сохранения изображения.

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

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

Данное приложение – платное, но ценовая политика – крайне гибкая, поскольку для студентов и индии-разработчиков автор идет навстречу и по личной договоренности может разрешить использовать приложение по лицензии “CrazyBump for Students”, купленную за $49 USD, в коммерческих целях. Если же вы хотите заполучить себе копию CrazyBump на одно лицо (один компьютер), а ваш годовой доход  или годовой доход вашей компании не превышает 200.000 долларов, то вам останется лишь выложить за этот “аппарат” 99 долларов. Если вы давно зарабатываете более 200 тысяч долларов в год или доход вашей компании хотя бы на доллар превысил данную планку, то вам остается лишь выложить 299 долларов за одну копию данного приложения.

Crazy Bump также позволяет инвертировать загруженное изображение, а также смешивать карты нормалей. Об инвертировании изображения я уже сказал выше, а вот смешиванию карт нормалей будет посвящена отдельная статья.

Awesome Bump

Следующей программой в списке генератором карт, является AwesomeBump. Для того чтобы создать карту нормалей в данном приложении из изображения, например, Albedo (диффузной) текстуры или карты высот, его необходимо загрузить. Переходим в окно работы с диффузной картой, открыв соответствующую вкладку “Diffuse”, затем ставим флаг напротив опции Enable preview, загружаем текстуру, нажав на иконку дискетки и выбрав вашу диффузную карту или карту высот. Теперь осталось лишь нажать на кнопку “Convert to N H”, чтобы создать карту нормалей (а также карту отражений, карту высот и карту освещения/затенения) из вашего изображения. В окне предпросмотра 3D примитиву автоматически была назначена созданная карта нормалей. Чтобы снять отображение карты нормалей, снимите флаг напротив опции “ Enable preview”.

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

На рисунке показан интерфейс программы Awesome Bump создания карты нормалей из текстуры. awesomebump_3dbufferНа рисунке показан интерфейс программы Awesome Bump создания карты нормалей из текстуры. awesomebump_3dbufferНа рисунке показан интерфейс программы Awesome Bump создания карты нормалей из текстуры.

Можно подвигать источник света в окне 3D предпросмотра (удерживая Среднюю Клавишу Мыши перемещайте мышь в окне с 3D примитивом).

Если вы хотите посмотреть, как будет выглядеть текстура на вашей 3D модели, то вам достаточно лишь нажать кнопку “3D settings” на окном 3D предпросмотра модели, после чего нажать кнопку “Load OBJ Mesh” и выбрать свою 3D модель в формате OBJ. Awesome Bump не понимает 3D модели без UV развертки!

При некотором умении данный инструмент станет вам незаменимым помощником в создании и доработке 3D контента для игр.

 

В следующей части статьи будет рассказано про Создание карты высот из текстуры и рисование карты высот для текстуры

 

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

[email protected]

Post Views: 18 840

www.3dbuffer.com

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

Данная статья посвящена вопросам улучшения внешнего вида 3D модели, в частности, посредством использования карт высот, карт нормалей, карт отражения, карт затенения, карт смещения, а также их создания нативными средствами Unity3D и сторонними приложениями, утилитами программами, включая Normalmap Online, NVIDIA Texture Tools for Adobe Photoshop (NVIDIA Normal Map Filter), SSBump Generator, xNormal, GIMP normalmap plugin и SmartNormal, CrazyBump и Awesome Bump. Теория карт нормалей и карт высот. Как подготовить текстуру, превратив ее в карту высот, для создания различных карт.

 

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

Оглавление

  1. Создание карты нормалей в Unity3D
  2. Теория карт высот
  3. Обзор Normalmap Online
  4. Теория карт нормалей
  5. Обзор приложений для создания различных карт (карт нормалей, карт отражений, карт высот, карт смещения, ssbump и т.д.)
    • Обзор NVIDIA Texture Tools для Adobe Photoshop
    • Обзор SSBump Generator
    • Обзор xNormal
    • Обзор плагина normalmap для GIMP
    • Обзор Smartnormal (онлайн)
    • Обзор CrazyBump
    • Обзор Awesome Bump
  6. Создание карты высот из текстуры и рисование карты высот для текстуры

 

Многие начинающие игроделы задумываются, догадываются или уже знают, как заставить выглядеть свои 3D модели (игровые объекты) на AAA уровне, не повышая при этом количество используемых полигонов, а, по сути, треугольников (трисов). Одним из таких способов является использование качественных текстур для визуализации 3D моделей и дополнительных карт: нормалей, смещения, затенения, высот, отражения. Откуда их взять, если у разработчика есть лишь текстура, без всех остальных карт?

Часть таких карт можно создать в Unity3D, предоставленными нативными средствами либо реализуемыми посредством скриптов, размещаемых в папке Editor Unity3D.

Карта нормалей нативными средствами Unity3D

Говоря о нативных средствах предоставляемых Unity3D, стоит сказать о возможности в Unity3D преобразовать обычную текстуру в карту нормалей через Установки/Настройки Импорта в окне Инспектора Unity 3D.

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

На рисунке показана бесшовная текстура тротуарной плитки. tileable-texture-512На рисунке показана бесшовная текстура тротуарной плитки. tileable-texture-512На рисунке показана бесшовная текстура тротуарной плитки.

 

Выберите импортированную текстуру Левой Кнопкой Мыши в окне ассетов, нажмите сочетание клавиш Ctrl+D, чтобы создать копию выбранного объекта, в данном случае – карты текстур, которую мы и превратив в карту нормалей. Выберите Левой Кнопкой Мыши созданную копию текстуры и посмотрите в меню Инспектора, в котором выберите в выпадающем списке типа текстуры (Texture Type). Теперь вместо “Alpha from GrayScale” появился CheckBox “Create fromGrayscale”. Выберите его, чтобы создать карту нормалей через промежуточное преобразование изображения в монохромное, из которого и будет создана карта нормалей. Промежуточный процесс преобразования в монохромное изображение, которое не показано пользователю, схоже с преображением изображения в карту высот.

Вы также можете выбрать параметр “Smooth” режима фильтрации “Filtering”, который позволяет убрать шум на создаваемой карте нормалей, тем самым сгладив ее.

Параметр “Bumpiness” определяет резкость результирующей карты нормалей. Данный параметр связан с коэффициентом воздействия (“выпуклости”) карты нормалей в меню настройки параметров материалов, о котором будет сказано чуть ниже.

Осталось лишь применить настройки для новой карты нормалей, нажав кнопку “Apply”.

На рисунке показаны настройки преобразования текстуры в карту нормалей (подойдет и для преобразования в карту нормалей и карты высот, и даже карты нормалей :)). normal-map-from-textureНа рисунке показаны настройки преобразования текстуры в карту нормалей (подойдет и для преобразования в карту нормалей и карты высот, и даже карты нормалей :)). normal-map-from-textureНа рисунке показаны настройки преобразования текстуры в карту нормалей (подойдет и для преобразования в карту нормалей и карты высот, и даже карты нормалей :)).

Одним из настраиваемых параметров карты нормалей является параметр “выпуклости” карты нормалей (справа от стола для изображения карты нормалей).

 На рисунке показан процесс назначения созданного изображения карты нормалей в соответствующий слот в меню настройки параметров материала. Также выделен коэффициент воздействия карты нормалей. normal-map-from-texture-assign На рисунке показан процесс назначения созданного изображения карты нормалей в соответствующий слот в меню настройки параметров материала. Также выделен коэффициент воздействия карты нормалей. normal-map-from-texture-assignНа рисунке показан процесс назначения созданного изображения карты нормалей в соответствующий слот в меню настройки параметров материала. Также выделен коэффициент воздействия карты нормалей.

Слева на рисунке показана созданная плоскость с назначенной ей только диффузной текстурой без карты нормалей.  Справа — материалу объекта назначена диффузная карта и созданная из этой же текстуры карта нормалей.

Кстати, если вы захотите сохранить на диске созданную описанным образом карту нормалей путем перетаскивания его из окна ассета проекта Unity3D в папку проводника Windows, то у вас ничего не получится, поскольку в Проводнике вы увидите всю ту же свою карту высот. В папке проекта она также хранится в виде карты высот. Для чего это сделано? Полагаю, одной из причин является возможность всегда вернуться к оригинальной текстуре.

Рисунок демонстрирует факт того, что Unity3D не изменяет текстуру в настройках импорта, а лишь применяет к ней свои фильтры. normal-map-unity3d-explorerРисунок демонстрирует факт того, что Unity3D не изменяет текстуру в настройках импорта, а лишь применяет к ней свои фильтры. normal-map-unity3d-explorerРисунок демонстрирует факт того, что Unity3D не изменяет текстуру в настройках импорта, а лишь применяет к ней свои фильтры.

Говоря о скриптах: вы можете попробовать решения, предлагаемые здесь: bumpmap (grayscale) to normalmap (rgb). Они позволяют в игре или Редакторе Unity3D превратить диффузную текстуру или карту высот в карту нормалей.

Если вы хотите получить более гибкие настройки для создания карты нормалей из текстуры и карты высот, а также иметь возможность создать карту смещения (displacement map), карту затенения (ambient occlusion map) и карту отражений (specular map), то вам стоит обратить внимание на онлайн инструмент Normalmap Online, который позволяет изменять параметры создаваемых карт, а также выбирать метод создания карты нормалей:  с использованием дифференциального оператора Собеля (Sobel) или оператора Щарра (Scharr). Последний, в честь которого и назван оператор/фильтр, улучшил полную вращательную симметрию, которую не учитывал Собель. Более подробно про них вы можете узнать в посвященной этому статье ”Оператор Собеля” в Википедии.

Карта высот – это, конечно, хорошо, но что делать, если ее нет? Создать ее из имеющегося изображения, либо использовать это изображения. Какие нюансы стоит учитывать при использовании изображения вместо карты высот, можно узнать, если знать, что такое, эта самая карта высот, и для чего она нужна. Карта высот представляет собой растровое монохромное изображение, в котором хранятся значения высоты в виде светлых и темных областей, где, чем светлей точка, тем выше она находится относительно нулевого уровня:

— для бамп маппинга (bump mapping), по сути, представляющего собой рельефное текстурирование, карта высот используется при вычислении падения и отражения света (например, используется в модели освещения/отражения Фонга) для визуализации теней с целью сделать 3D модель более реалистичной за счет имитации выпуклостей, впадин, царапин на поверхности модели без изменения геометрии меша этого самого 3D объекта. Кстати, карта нормалей является одним из наиболее распространенных видов bump mapping’а;

— для displacement mapping’а, в основе которого лежат карты смещения, при использовании которых меш модифицируется согласно светлым и темным областям текстуры/изображения путем изменения позиции вершин 3D модели (в частности, плоскости).

Одним из самых потрясающих применений карты высот для дисплейсмент маппинга я видел здесь: Sculpting with UVs and displacements.

На рисунке показан пример использования карты смещений. displacementНа рисунке показан пример использования карты смещений. displacementНа рисунке показан пример использования карты смещений.

Однако наибольшее распространение карта высот получила для создания 3D моделей ландшафтов и океанов путем преобразования карты высот в 3D меш за счет выстраивания вершин 3D ландшафта в зависимости от цвета соответствующих областей на карте высот по одной из осей. В Unity3D такой осью является ось Y, в Blender — ось Z.

На рисунке показан пример генерирования/генерации ландшафта из карты высот с применением карты нормалей в Unity3D. heightmap-to-landscapeНа рисунке показан пример генерирования/генерации ландшафта из карты высот с применением карты нормалей в Unity3D. heightmap-to-landscapeНа рисунке показан пример генерирования/генерации ландшафта, в данном случае — поверхности океана, из карты высот с применением карты нормалей в Unity3D.

На изображенном рисунке показан ландшафт (террейне, от англ. Terrain – ландшафт, рельеф местности), представляющий собой меш, сгенерированный из карты высот, созданной еще в одном он-лайн генераторе, но на этот раз – генераторе текстур Texture Generator Online, который, кстати, создан тем же разработчиком, что и Normalmap Online.

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

На рисунке* показан материал, к которому применена  карта высот и созданные из нее текстура и карта нормалей. texture-generator-online-oceanНа рисунке* показан материал, к которому применена  карта высот и созданные из нее текстура и карта нормалей. texture-generator-online-oceanНа рисунке* показан материал, к которому применена  карта высот и созданные из нее текстура и карта нормалей.

Обратите внимание на зеленоватые и красноваты области на карте нормалей, мы к ним еще вернемся, когда будем говорить о теории карт нормалей.

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

На рисунке показано онлайн приложение для генерирования текстур. В данном конкретном случае была сгенерирована карта/текстура ландшафта. texture-generator-onlineНа рисунке показано онлайн приложение для генерирования текстур. В данном конкретном случае была сгенерирована карта/текстура ландшафта. texture-generator-onlineНа рисунке показано онлайн приложение для генерирования текстур Texture Generator Online. В данном конкретном случае была сгенерирована карта/текстура ландшафта.

 

В следующей части статьи будет рассказано про Теорию карт высот

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

[email protected]

Post Views: 7 416

www.3dbuffer.com


Смотрите также