Создание фотореалистичной текстуры травы

При разработке дизайна компьютерных игр, подготовке оформления Web-публикаций, а также в некоторых других случаях (например, обои для рабочего стола Windows) используются специальные виды изображений, называемых текстурами.

Трава	Кровь под микроскопом
Древесная кора	Солома

Так что же такое текстура? Текстура – это повторяющийся узор или рисунок, который имеет свойство непрерывно покрывать заданные области изображения (формировать поверхности или фон) без каких-бы-то-ни-было заметных стыков. Такие изображения (текстуры) часто именуют Tile (тайл) – что как раз и подразумевает свойство непрерывности, в ограниченном размерами изображении.

За счет чего достигается такая непрерывность? Вот в этом мы сейчас и попробуем разобраться на практическом примере.

Попробуем создать изображение текстуры травы в Photoshop 7.

1.                            Создайте новый файл размером 256х256 пикселей (точек экрана) -

для этого выберите команду File > New и в открывшемся диалоговом окне задайте требуемый размер:

Обратите внимание!

Resolution – это соотношение пиксель/дюйм, учитываемое при распечатке на принтере. На размеры картинки не влияет.

Mode – RGB Color соответствует цветному изображению.

Contents – определяет цвет наполнения (холст, фон) – Transparent – прозрачный фон – наиболее универсальный и нужный в данном случае нам!

2. Изобразите, используя инструмент Pencil , черным цветом контур куста травы с видом сверху:

3. Обратите внимание на то, чтобы все контуры были замкнутыми. Это обстоятельство является важным, в противном случае Вы не сможете использовать выделение или заливку листьев куста!
4. Т.к. фон у нас прозрачный (здесь на рисунке показан белый фон), то мы можем залить куст травы следующим образом: создайте новый слой – Layer > New > Layer или нажмите соответствующую кнопку на палитре слоев (см. урок 1)
5. Измените цвет пера (foreground color) с черного на зеленый и выполните заливку созданного нового слоя.
6. Ах! У Вас всё пропало. Но это еще не всё. Теперь в палитре слоев перетащите слой, залитый зеленым так, чтобы он располагался не над слоем с контурами травы, а под ним.

Что мы имеем: слой с контуром травы, а под ним слой с заливкой зеленым.

Почему мы не стали заливать сразу отдельные листочки?

Потому что при этом нужно было бы повторять операцию заливки несколько раз (для каждого листочка – замкнутого контура отдельно). В нашем случае мы сделали это за 1 шаг.

Однако возникает вопрос: Ведь в этом случае залиты не только листочки, но и задний план, т.е. фон вокруг куста.

Исправить это легко: нужно выделить волшебной палочкой пиксели вокруг куста и удалить выделенную область с нижележащего слоя. Но мы пока не будем этого делать. Сделаем это позднее (см. шаг 8).

5. Чтобы контуры куста не были так резко выражены, попробуйте перейти на слой с контуром и сделать его слегка полупрозрачным, например около 20-35%.

В результате Вы увидите, что контуры станут больше сливаться с основным тоном – зеленым.

6. Теперь можно попробовать удалить окружающий куст травы зеленый цвет – сделать фон вокруг куста прозрачным: для этого находясь на слое с контуром травы выберите инструмент Magic Wand и установите на панели свойств следующие параметры:

Это означает, что Обратная чувствительность (Tolerance) – будет использовать при выделении только 1 цвет, выделяться будет замкнутый контур.

7. Щелкните волшебной палочкой (Magic Wand) фон рядом с кустом. В результате область вокруг куста станет выделенной.
8. Опуститесь на нижний слой содержащий сплошную заливку зеленым и удалите выделенную область – клавишей [DELETE].

Вот что у вас должно получиться в результате.

9. Попробуем придать кусту более живой вид. Для этого воспользуйтесь инструментами Осветление и Затемнение

Dodge Tool – затемнение; Burn Tool – выжигание; Sponge Tool – губка.

В панели свойств каждого из этих инструментов Вы найдете следующие свойства:

Brush – размер и форма пера (кисти), используемого для выполнения операции осветления/затемнения/губки;

Range – диапазон воздействия – определяет оттенок получаемый при применении эффекта – теневой/средний тон/бликовый;

Exposure – сила воздействия.

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

Слишком большая достоверность игры теней и бликов не требуется, т.к. мы сейчас отмасштабируем размер куста, уменьшив его в 8 раз, т.е. до размеров 32х32. Замечание – если Вы заметили, что Ваши усилия не дают результатов – не появляется ни бликов ни теней – обратите внимание на каком слое Вы работаете. Работать надо на слое содержащем закрашенные зеленым листья. Если Вы работали на слое, содержащем контур, то это и не давало эффекта, т.к. кроме контуров все остальное на данном слое – «пустой» прозрачный цвет.

10. Image > Image size и задайте размер 32х32.
11. Мы получим небольшой, достаточно компактный кустик. Теперь, используя его и инструмент Клон-Штамп

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

Что нужно сделать, более детально:

Создать новый файл – 256х256 с прозрачным фоном.

Переключиться на файл с изображением маленького куста.

Выбрать инструмент Клон-Штамп и с клавишей [Alt] щелкнуть левой кнопкой мыши – запомнить изображение куста. Размер пера, если куст не попадает в него целиком, нужно увеличить.

Переключиться на изображение 256х256 и щелкая левой кнопкой рассаживать кусты. Если кусты не рассаживаются уберите флажок: Aligned – чтобы отключить привязку в первой поставленной копии.

В результате может получиться что-то наподобие этого:

Обратите внимание, что фон уже непрозрачный, т.к. прозрачный фон это атрибут только PSD файлов – рабочих файлов Photoshop, любой другой формат требует задания в качестве фона какого-то конкретного цвета. На рисунке как раз и показан такой случай – с JPG файлом.

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

После сохранения файла (File>Save As и указать имя файла, а также место для сохранения – см. урок 1)

Можно попробовать задать изображение в качестве шаблона (Pattern) и попробовать им что-нибудь залить, например тестовое изображение размеров 1024х768 (одно из стандартных разрешений экрана).

Для задания шаблона: изображение с травой должно быть текущим, выберите команду Edit > Define Pattern.

Затем ОК.

После этого можно закрыть файл с изображением и попробовать текстурную заливку:

Создайте новый файл – 1024x768.

Выберите инструмент Ведро (Paint Bucket) и в панели свойств задайте режим Pattern (Шаблон).

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

Выполните текстурную заливку.

Вы заметите, что Ваша текстура имеет резко выраженные швы.

Как сделать текстуру бесшовной (Tile)?