Как сделать развертку в фотошопе

Обновлено: 07.07.2024

Привет! Мы продолжаем цикл статей по пайплайну разработки стилизованных персонажей. Сегодня расскажем, что такое этап запечки, и как перенести детализацию с высокополигональной модели (high poly) на низкополигональную (low poly).

Запечка (Bake) — четвёртый этап ААА-пайплайна. На прошлом мы сделали развёртку, а сейчас будем её использовать для создания Normal Map, AO и Color ID.

Примечание: нам часто говорят, что правильнее писать «запекание», а не «запечка». Мы пишем «запечка», потому что это устоявшийся термин в индустрии.

Гугл на слово запечка показывает то, что нам нужно, а на слово запекание предлагает запечь курочку

Что такое запечка

Взглянем на low poly модель, которую сделал наш студент Leon.

Низкополигональная модель, созданная на этапе ретопологии

В ней минимум полигонов и чистая сетка. Эта модель будет загружаться в игровой движок.

Есть ещё high poly модель с высокой детализацией и скульпт.

Хайполи модели под сабдив и скульпт

Технология запечки позволяет нам перенести все детали с high poly и скульпта на low poly-модель.

В итоге, в игровом движке будет low poly модель с минимальным количеством полигонов, но выглядеть она будет так, как будто на ней есть все эти детали:

Для внимательных: ID Map никак не влияет на вид модели, в отличие от нормала и АО, но она пригодится при текстурировании, поэтому эту карту тоже будем печь.

Как это работает?

Мы берём low poly модель и добавляем на неё запечённые карты Нормала и АО. А эти карты обманывают поведение игрового света. Модель начинает бликовать так, как будто на ней есть все эти фаски, вырезы и прочие детали.

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

1) Normal map — карту неровностей
2) Ambient Occlusion (AO) — карту затенения
3) Color ID — цветные маски

В Marmoset можно запечь гораздо больше карт, про это будет дальше.

Мы добавим эти карты на нашу low poly модель, на ней появится вся детализация с high poly и скульпта, а благодаря карте Color ID модель будет легче разбить по материалам и текстурировать.

Все карты создаются на основе развёртки, которую мы сделали на прошлом этапе пайплайна. Без развёртки карты не запекутся. Если есть ошибки на развёртке или low poly модели, то мы столкнёмся с кучей проблем.

Ссылки на теорию

Вот несколько наших статей, прочитав которые ты точно поймёшь, как работает «магический» трюк с обманом вертекс нормалей.

Какие карты будем печь

Нет смысла запекать карты, если не знаешь, что они делают и как работают.

1. Normal Map

Normal Map переводится как «карта нормалей»
Она изменяет направление блика на геометрии.

Карта создаёт виртуальные вертекс нормали в каждой точке low poly модели и искажает поведение света. Если наложить запечённый нормал на модель, то она будет выглядеть почти как high poly.

Вот хороший пример: low poly модель с включенным Нормалом и без него.

Модель с включенным нормалом и без него

Новые полигоны не создаются, это лишь иллюзия формы:

Приглядись, видишь low poly сетку? Все детали и затенения, которые ты видишь — иллюзия.

Чтобы создать нормал, нужно взять развёртку, которую мы делали ранее, взять high poly и скульпт, загрузить в программу для запечки и нажать кнопку «bake».

Там много нюансов, но мы обо всём расскажем.

Из чего печётся Normal map

Что нужно знать о Нормале

Небольшие чёрные полосы на нормале — это нормально.
Никто не будет разглядывать нашу модель под микроскопом.

Чёрные полоски на нормале

Почему не стоит сильно волноваться о чёрных полосах?
Игрок почти всегда видит модель в игре на расстоянии. Поэтому не нужно тратить несколько часов, чтобы убрать чёрные полоски на нормале:

Та же модель, но на расстоянии. Чёрные полосы не режут глаза, — значит, всё окей.

Из чего состоит карта нормалей

Normal map создает иллюзию объёма благодаря трем картам в каналах текстуры: красный, зелёный, синий.

Чтобы переключаться между каналами, откроем файл с нормалом в Photoshop и зайдём во вкладку Channels.

Красный канал показывает искажение вертекс нормалей по горизонтали. Чем светлее пятно на красном канале — тем сильнее виртуальная поверхность наклонена вправо, а чем темнее — тем больше «поверхность» бликует влево.

Красный канал нормала

Зелёный канал — работает так же, но искажает шейдинг по вертикали.
Светлый-блик поворачивается наверх, а тёмный — вниз.

Зелёный канал Нормала

Чтобы лучше понять разницу между этими двумя каналами, посмотрим на эту часть модели:

У бочки на high poly есть фактура дерева.
Затемнение идёт только по одной из осей.

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

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

Зелёный и красный канал нормала на примере бочки

Красный и зелёный каналы — основные для нас (как моделлеров).
Но у Нормала есть ещё синий канал.

Синий канал имитирует углубления в объекте.
В играх он практически не используется.

За счет изменения синего цвета на нормале создаются искажения на плоской поверхности.

Если на синем канале есть артефакты, можно просто выключить этот канал, т.е. отключить синий цвет у нормал мапа в фотошопе. Или просто их замазать артефакты кисточкой.

Синий канал нормал

Больше про три канала Нормала — в этой статье.

Нейтральный цвет Нормала

128х128х255 — нейтральный цвет нормала.

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

В каком формате лучше хранить нормал

После запечки, скорее всего, придётся вносить изменения в нормал, используя фотошоп.

Поэтому файл лучше сохранять в форматах Targa или TIF.
При сохранении есть выбор, сохранять в 24 или 32 bit.
Если есть Альфа-канал — сохраняем с 32 bit.
Если Альфа-канала нет — в 24 bit.

2. Карта АО

Так выглядит запечённая карта АО

Карта Ambient occlusion (AO) — это карта затенения.
Она показывает самые глубокие тени, которые есть в объекте.
В основном это тени в углублениях и на пересечениях. Эту карта используют игровые движки для корректного освещения. Она также очень полезна в текстурировании.

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

Если добавить на low poly модель карту АО, на модели появятся самые глубокие тени

Также как и нормал, карта АО печётся на развёртку модели из high poly и скульпта.

Карта AO создаётся из highpoly и скульпта

При запекании по-умолчанию эта карта чёрно-белая, но на этапе текстурирования её можно покрасить.

С картой АО разобрались, последняя карта, которая нам нужна — Color ID

3. Карта Color ID

У наша модель состоит из разных материалов: металла, камня, дерева и ткани.

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

Чтобы это можно было сделать в один клик внутри Substance Painter, нам нужно запечь карту Color ID. Она позволяет быстро выделять большие куски. А в программе для текстурирования эту группу объектов можно легко затекстурить.

Вот так, с помощью этой карты мы в считанные секунды красим модель в разные цвета:

Быстро красим модель в Substance Painter, используя карту Color ID

Для того, чтобы создать карту Color ID, нам нужно покрасить high poly-модель в разные цвета. Один цвет — это одна группа объектов, как правило разбитая по материалам. Например, всё дерево на Color ID оранжевое, вся кожа —розовая, ржавый металл — синий, шерсть — голубая, а новый и чистый метал —зелёный.

Это не цвета будущей модели — здесь они могут быть любыми. Главное, чтобы они были контрастными.

Дополнительные карты

В мармосете куча карт, которые можно запечь.

Их в разных пайплайнах используют разные художники для текстурирования:

Position map с помощью градиентов помогает накладывать текстуры в разных плоскостях модели.

Сurvature выделяет все края на модели и упрощает создание затёртостей и повреждений. Очень полезная карта на ряду с АО.

Thickness запекает толщину, что необходимо для имитации подповерхностного рассеивания.

Часто для hand paint текстур пекут свет прямо на текстуру. Иногда необходимо запечь альфу — карту прозрачности.

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

Ты мог заметить, что при использовании текстур они не всегда накладываются так, как тебе хочется: что-то растягивается, что-то обрезается. Ситуация обостряется, если нам нужно наложить разные картинки на один объект, например сделать кубик с цифрами.

Чтобы изображение накладывалось правильно на модель, были придуманы развёртки (UV Map).

Развёртка — это соотношение между координатами на поверхности трехмерного объекта (X, Y, Z) и координатами на текстуре (U, V).

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

Пример того, как развертка накладывается на трехмерных объект

Алгоритм настройки текстуры с помощью развертки следующий:

Задать вручную ребра, по которым будет проходить разрез модели (Ctrl+E -> Mark Seam). Если этот пункт пропустить, то программа разрежет модель по всем ребрам.
Выделить полигоны, которые должны быть в развертке.
Создать развертку (U -> Unwrap).
*Если ты хочешь сам создать текстуру (например, нарисовать или сделать в фотошопе), то сохранить шаблон развертки.
Наложить текстуру.
Задать наложение текстуры по развертки.
Подкорректировать положение текстуры.

Пошаговое наложение текстуры при помощи развертки

На примере кубика с цифрами разберем наложение текстуры с помощью развертки по шагам.

1. Создай куб и перейди в Edit Mode. Выдели ребра, как на рисунке (по ним будут проходить разрезы развертки).Чтобы перейти в режим прозрачности объекта нажми Z.
1. 1. Пометь ребра для разреза: Ctrl+E -> Mark Seam.
  1. 1. Ребра приобрели красный цвет, то есть по ним будет проходить разрез нашей развертки
    1. 1. Выйди из режима прозрачности объекта (клавиша Z). Выдели все полигоны и создай развертку: U -> Unwrap.
      1. Раздели экран на две части и перейди в одной из областей на вкладку UV/Image Editor.
        
        Включи синхронизацию выделения объектов на развертке и 3D модели (значок снизу). Теперь, выделяя элемент на одной из частей экрана, этот же элемент выделяется на другой части.
        
        Экспортируем развертку в изображение, чтобы мы могли нанести на ней свой рисунок: UVs -> Export UV Layouts. Напиши название файла, выбери папку и сохрани картинку.
        
        Открой сохраненный шаблон развертки в графическом редакторе и оформи грани кубика. Определять положение цифр можно с помощью пункта 6. Сохрани изображение, когда закончишь оформлять развертку.
        
        В окне 3D вида перейди в Object Mode. Для куба создай материал. Назначь ему Image Texture и выбери нужную картинку-текстуру.
        
        В пункте Normal выбери пункт UV (чтобы текстура накладывалась по UV развертке).
        
        В окне UV/Image Editor ты можешь перемещать и масштабировать полигоны с помощью клавиш G и S. Таким образом легко подогнать развертку под текстуру.
        Особенности разворачивания примитивов и сложных моделей
        
        Сфера, шов проходит через экватор Второй вариант развертки сферы. Часто такую развертку используют при изображении карт мира. В отличие от первого варианта, здесь вся поверхность была развернута в единое полотно
        
        Посоветуйте пожалуйста статьювидеокнигу и тд на русском языке объясняющую как нарисовать развёртку в фотошопе.
        
        Как составить развёртку в максе я знаю , как налепить на неё всяких кусочков котоыре должныф после стать текстурой знаю. Но этого мало, хочется сделать текстуру без косяков, что бы стыков видно не было, а дял этого надо не по отдельным частям развертку собирать, а растянуть в единое целое (должно быть видели текстуры персонажей). А так же хотелось бы узнать как сделат ьвсякие мелочи максимально реалистичными - потёртости, следы окисления, выбоины и тд и тп (разымеется всё это на текстуре).
        
        осталось совместить знание с целью. Посмотрите сторонние плагины и программы для создания развёртки, если стандартным unwrap не получается, т.к. делается это все таки в максе и после этого по ней рисуются текстуры, ну или собираются из фоток
        
        при помощи карт reflect, specular, bump в дополнении к diffuse, можно попробовать снять с фоток при помощи pixplant, crazybump и т.п
        
        хм.. и для максимальной реалистичности стоило лепить данный объект в браше или мадбоксе, и снимать карту нормалей, чтобы потом положить её на лоуполи модель
        Willfray : Сделать развертку в плане карты для последующего наложения текстуры я могу. Мне бы в фотошопе по этой "развертке" текстуру нарисовать , причем нарисовать толково. Делается это именно в фотошопе.
        И максимальная реалистичность путём наращивания полигонов мне не подойдёт. Мне бы всё это на текстуре нарисовать.
        Канарис
        ты это, давай на каком-нибудь примере. Покажи картинку, которую хочешь воспроизвести, а уж мы насоветуем способы как это сделать.
        Фотошоп фотошопом, но тут, мне кажется, больше работы в максе - как уже упоминал Willfray - наложение карт бампа, рефлекта, диффуза и прочего.
        
        Ту же карту бампа можно наложить. ммм. навскидку могу привести три разных способа(которые вспомнил). Разные типы материалов - мультисуб, простой виреевский мат, композитный или там вирейбленд.
        Кстати, в чём ты рендеришь-то? А то вдруг я с виреем не в кассу.
        
        Про плагины. Посмотри плагин для развёртки Unwrella. Он разрезает шкуру более грамотно, чем встроенный Unwrap.
        Если я правильно поняла, человека интересует фотошоп. В фотошопе все ручками рисую. Доклеела, клонировала, отмаштабировала.Не быстро конечно. Сначала битмал, а из нее другие карты. Может быть есть автоматизированный способ, но не знаю такого. Если это фото, то нужно найти максимально выгодный ракус, и трансфотмацией (деформация) тянуть, а дальше клоном дорисовывать. Другие части кисточкой, вобщем чем угодно. Углубляться в фотошоп.
        Вообще, если хотите избавится от швов. и качественно разрисовать свою модельку, тогда нужны сторонние програмки. Хоть и есть в (новых) максе возможность рисовать по модели.
        
        Мне лично нравится работать в связке
        
        Но если нужно что-то по интереснее, то рыть в сторону . В плане разукрашвания модельки у этой програмки все приемущества
        
        Nel_Nel : да , да, да! Вот и нужден материал по теме как рисовать "ручками" выразительные текстуры =)))
        
        voverrr : речь идёт о игровых моделях, что уже накладывает определённые ограничения (типа никаких мультисубов, никакой излишней мудрости с настройками материала - которые поймёт только макс, и тд). Если для рендеринга - так можно просто детализировать всё в геометрии и создать кучу материалов - для этого инструкций хватает ибо кого колышит что оно будет визуализироваться пол часа-час? В игре же визуализация непрерывная, причем 100500 объектов сразу и не всегда это происходит на компьютерах с i7 и 32гб оперативки на борту.
        
        Рендерю я штатным рендером с настройками по умолчанию и только с целью посмотреть что получается.
        
        в примерах: Берём текстуры нарисованные художниками Рокстар:
        
        Сравниваем с текстурой нарисованной мною:
        
        И сразу же понимаем - кто гордится своей работой набирая в google " обсуждение GTA 4", а кто задаёт на форуме глупые вопросы
        
        Ок, то что использовать место с умом у меня не получилось это я понял, но смотрим дальше:
        Не однородные текстуры метла и дерева, реалистичные потёртости , сколы, царапины, блики, прорисовка элементов оружия на текстуре , надписи аналогичные реальной штамповке и тд и тп. Чувствуется ОБЪЁМ ТЕКСТУРЫ, ОНА "ЖИВАЯ"
        Вот об этом я говорю, О графических файлах текстур, так что делаются они именно в графических редакторах, предположительно в растровых, самый известных из которых - фотошоп.
        
        Такой, в котором есть волшебная кнопка "Сделать красиво"?
        
        Боюсь, подобного не существует.
        
        Человек Фотошоп не смог освоить, а вы ему Сабстенс подсовываете. Не стыдно?
        
        Стыдно когда видно)
        
        а Сабстенс тот же Фотошоп, только в 3д ;-)
        
        Стыдно когда видно)
        
        а Сабстенс тот же Фотошоп, только в 3д ;-)
        
        Там принцип абсолютно другой, как фотошоп это скорее 3dcoat.
        egor98, если планируете и дальше заниматься 3d, вам в любом случае нужно будет изучить какой-нибудь 2d-редактор хотя бы базово - тот же фотошоп. С трудом представляю себе текстурирование без 2d-инструментов.
        Чтобы рисовать текстуры нужно как минимум уметь рисовать..
        
        Потому лучше начать с художки.
        
        От софта мало что зависит.
        egor98, если планируете и дальше заниматься 3d, вам в любом случае нужно будет изучить какой-нибудь 2d-редактор хотя бы базово - тот же фотошоп. С трудом представляю себе текстурирование без 2d-инструментов.
        Вот я и столкнулся с этой проблемой.Фотошоп изучал только как коректирование рендера,а рисовать там текстуру максимум 2 раза пробовал.
        
        Чтобы рисовать текстуры нужно как минимум уметь рисовать..
        
        Потому лучше начать с художки.
        
        От софта мало что зависит.
        
        С этим проблемы,никогда не умел рисовать,буду учится.
        
        С этим проблемы,никогда не умел рисовать,буду учится.
        
        Не разбрасывайтесь. Решайте задачи в том софте в котором собираетесь работать. У вас там может задача какая то тривиальная в данный момент, а вам тут сейчас в Репинку посоветуют поступать)). От того что вы научитесь рисовать (если научитесь), ни photoshop ни Substance вам ближе не станут.
        
        Не разбрасывайтесь. Решайте задачи в том софте в котором собираетесь работать. У вас там может задача какая то тривиальная в данный момент, а вам тут сейчас в Репинку посоветуют поступать)). От того что вы научитесь рисовать (если научитесь), ни photoshop ни Substance вам ближе не станут.
        
        я про рисование в своем направлении.Времени у меня и нету на изучение всего.
        
        Ещё можно было родиться с талантом, чтобы в роду были художники и т.д.
        
        Не совсем понял зачем создавать текстуры растений. Они имеются в большом количестве в сети. (листья, лепестки, стебли). Если чего нет так это надо брать фотоаппарат и искать в живую, фоткать. Потом в фотошопе подгоняем по развёртке и всё, далее в софте(макс,майя и т.д.) настраиваем сами материалы. А чтобы с нуля взять и по развёртке нарисовать такую штуку нужно быть не просто художником, а цифровым художником. Например таким как Anthony Jones.
        
        Не совсем понял зачем создавать текстуры растений. Они имеются в большом количестве в сети. (листья, лепестки, стебли). Если чего нет так это надо брать фотоаппарат и искать в живую, фоткать. Потом в фотошопе подгоняем по развёртке и всё, далее в софте(макс,майя и т.д.) настраиваем сами материалы. А чтобы с нуля взять и по развёртке нарисовать такую штуку нужно быть не просто художником, а цифровым художником. Например таким как Anthony Jones.
        
        мне для бутона цветка.нормальной развертки я не нашел.
        
        Не совсем понял зачем создавать текстуры растений. Они имеются в большом количестве в сети. (листья, лепестки, стебли). Если чего нет так это надо брать фотоаппарат и искать в живую, фоткать. Потом в фотошопе подгоняем по развёртке и всё, далее в софте(макс,майя и т.д.) настраиваем сами материалы. А чтобы с нуля взять и по развёртке нарисовать такую штуку нужно быть не просто художником, а цифровым художником. Например таким как Anthony Jones.
        
        Читайте также:
        
        
        Как в ворде скопировать текст с исправлениями
        
        Как включить подсказки в браузере
        
        Как сделать объемную текстуру в фотошопе
        
        Не получается принять посылку в программе программа выдает сообщение ошибка приемки
        
        Keep setup values after bios update что это