LadyDesire администратор

621994101
Salverin администратор

612497118
Sirena администратор

649537552
Новые сообщения · Участники · Правила форума · Поиск ·
  • Страница 1 из 1
  • 1
Форум » Мастерские и Туториалы » ❖ Туториалы » ❖ Туториалы | Tutorials THE SIMS 3 » Создание бесшовной многоканальной текстуры
Создание бесшовной многоканальной текстуры
Дата: Суббота, 14.07.2012, 11:19 | Сообщение # 1


◊The Happy Girl◊
Группа: Проверенные
Сообщений: 221



За 50 постов За 100 постов

Автор урока: Ellle
Источник: ЗДЕСЬ




Содержание урока:

1. создание узора для ткани
2. создание RGB-маски
3. конвертация файла в Pattern Tool


Если возникают вопросы, вы можете задать их на источнике автору!


Для работы нам понадобится:

1. Графический редактор, которым вы пользуетесь (Фотошоп и т.д.) Я буду использовать Фотошоп CS5.
2. dds-плагин для Фотошопа ( до начала работы его нужно установить в папку Plugins). Заметьте, что не все графические редакторы требуют этот плагин. Если ваш редактор не поддерживает его, вы будете сохранять свой файл в формате *.png.
3. TSR Workshop

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


Сообщение отредактировал Laverin - Суббота, 14.07.2012, 11:22
 
Дата: Суббота, 14.07.2012, 11:20 | Сообщение # 2


◊The Happy Girl◊
Группа: Проверенные
Сообщений: 221



За 50 постов За 100 постов

Часть 1. Создание узора

1. Для начала нам нужно определиться с тем, как будет выглядеть наша ткань. Первый вариант – найти готовый образец ткани. Для этого достаточно просмотреть любые текстильные сайты и выбрать ткань с уже готовым узором. В этом случае надо обратить внимание на несколько важных моментов:
• Изображение должно быть высокого качества
• Ткань на нем не должна быть мятой или растянутой. В противном случае мы не сможем сделать бесшовную текстуру.
• Узор на этой ткани должен быть повторяющимся.

Это обязательные условия для создания бесшовной текстуры!

Второй вариант – самим создать узор при помощи любого графического редактора. Вы можете нарисовать его пером, если хотите или использовать кисти из библиотеки вашего графического редактора.
Нужно отметить, что в библиотеке ФШ есть некоторое количество стандартных форм. Можно использовать их или загрузить что-то другое.



2. Для своей текстуры я загрузила несколько кистей с различными узорами. Затем создала новый документ размером 256х256 пикселей и разрешением 72dpi. А далее при помощи имеющих кистей собрала вот такой образец:



Внимание! Когда вы создаете узор, лучше всего каждую его деталь размещать на отдельном слое, чтобы потом в случае необходимости можно было легко её удалить или переместить в нужное место.

3. После того, как узор собран, необходимо слить все его слои. Таким образом, в вашем файле будет 2 слоя – фоновый и слой с узором.

4. Делаем слой с узором невидимым при помощи значка с изображением глаза.



Кликаем на фоновый слой, а затем в меню Image выбираем Canvas Size и выставляем там размер 200% по вертикали и горизонтали. Размещение изображения при этом остается строго по центру. Затем переходим на слой с узором и делаем его видимым. Таким образом, у нас получилось изображение размером 512х512 пикселей.

5. Теперь мы включаем сетку (Сtrl+ ‘) и смотрим, чтобы наше изображение было выравнено по центру окна. Нужно добиться такого результата, чтобы наш узор был поделен строго на 4 равные части. Для этого центрируем сетку. Заходим в меню Edit/Preferences/Guides, grid and slices . На рисунке ниже показано нужное окно и настройки, которые необходимо установить. Gridline every – направляющая каждые ____пикселей, Subdivisions – кол-во подразделов.



Вот, как в итоге будет выглядеть наше изображение.



6. Теперь нам создать образец с повторяющимся узором. Для этого на вертикальной панели в левой части окна выбираем Инструмент для прямоугольного выделения (Rectangular Margee Tool)



А далее при нажатой клавише Shift аккуратно выделяем четверть нашего узора. Затем выбираем Слой через копирование (Layer/New/Layer via Copy) и получаем еще один новый слой с выделенным фрагментом.



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



7. Теперь нужно слить все части узора вместе. После этого выделите слой с узором (удерживая CTRL, кликните на слое с узором) и выполните обрезку изображения Image/Crop.
Теперь наш образец готов.




Laverin вернулся.... ^^
 
Дата: Суббота, 14.07.2012, 11:20 | Сообщение # 3


◊The Happy Girl◊
Группа: Проверенные
Сообщений: 221



За 50 постов За 100 постов

Часть 2. Создание RGB-маски

Прежде всего, давайте разберемся с тем, что такое каналы перекраски, где их можно найти и как это выглядит в игре.
Цветовая модель изображения, которое используется для создания текстуры – RGB (8bit), где каждая буква обозначает отдельный канал: R – Red (красный), G – Green (зеленый), B – Blue (синий). При наложении их друг на друга получается наше изображение. Есть еще четвертый канал – альфа.

Внимание! Обозначения каналов не имеют никакого отношения к одноименным цветам.

Создавая текстуру, нам нужно заполнить каждый канал. Фактически мы выделяем и копируем части узора и вставляем их в отдельные каналы (не слои!) Таким образом, мы получим однослойное изображение, где каждый канал будет содержать свои элементы.
Чтобы понять, где эти каналы отображаются в игре, забежим немножко вперед и посмотрим на изображение, которое у нас в итоге получится в игре. Для этого заглянем в меню Create-A Style (Создание стиля). Каждый перекрашиваемый слой соответствует определенному каналу (см. рисунок ниже).



В нашем случае только 2 канала – красный и зеленый. Если же текстура имеет 4 канала (красный, зеленый, синий и альфа-канал), то в меню будет 4 перекрашиваемых слоя. С каналами разобрались и возвращаемся к нашему изображению.

Для этого:
1. Открываем новый файл, параметры которого указаны на рисунке ниже.



2. Открываем наше изображение. Сделаем его копию размером 256х256 пикселей. Её мы и будем использовать далее.
3. В новом файле переходим во вкладки Channels (Каналы) и начинаем их заполнять СТРОГО в следующем порядке: красный, зеленый, синий и альфа.



4. В нашем случае красный канал – это фон, зеленый – собственно узор. Поэтому заполняем следующим образом: красный канал заливаем белым цветом, зеленый канал – белый узор на черном фоне, синий канал заливаем черным цветом, альфа-канал заливаем белым цветом. Кстати, альфа-канал зачастую используется для придания образцу определенной текстуры. Но мы оставим его белым.



5. После создания изображения склеиваем его, выбрав в меню Layer пункт Flatten Image и сохраняем файл в формате *.dds. Всё, наша RGB-маска готова!




Laverin вернулся.... ^^
 
Дата: Суббота, 14.07.2012, 11:21 | Сообщение # 4


◊The Happy Girl◊
Группа: Проверенные
Сообщений: 221



За 50 постов За 100 постов

Часть 3. Конвертация файла в Pattern Tool

1. Открываем TSR Workshop и выбираем во вкладке Tools инструмент Pattern Tools. На рисунке ниже показано, как будет выглядеть наше окно.



2. Заполняем все поля следующим образом:

• Title – название файла;
• Description – описание файла;
• Category – категория, в которой будет размещена наша ткань (Абстрактный, Ткань, Тема, и т.д.);
• Surface type – тип поверхности (ткань, металл и т.д.)
• В окошко RGB mask загружаем нашу маску;
• Начинаем постепенно отмечать нужные каналы и заполнять их цветом.

Внимание! Поскольку у нас только 2 перекрашиваемых канала, отмечаем только 2 окошка – Red и Green. Остальное не трогаем!


На рисунке ниже показан результат, как должно выглядеть наше окно после заполнения.



3. Еще один немаловажный момент – проверить, как наш узор будет выглядеть в умноженном состоянии. Это нужно для того, чтобы увидеть, нет ли где-то швов. Для этого поставим галочку на окошке Show as tiled. Что получается, смотрите на рисунке ниже.



4. Мы видим, что на нашей ткани нет не прокрашенных швов.

5. Теперь мы можем нажать кнопку Export и сохранить наш файл в sims3pack.

6. Теперь помещаем его в папку Download и устанавливаем в игру, чтобы проверить, как наша ткань выглядит в ней.

Вот так наша текстура выглядит в игре:



На мебели:

Максимальное приближение:

Перекраска:


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

Спасибо большое за урок Ellle!




Laverin вернулся.... ^^
 
Дата: Суббота, 28.07.2012, 19:02 | Сообщение # 5


Группа: Друзья
Сообщений: 39





Отличный урок. Радует, что все пошагово расписано, как раз для "чайников" вроде меня. Непременно воспользуюсь!
 
Дата: Воскресенье, 29.07.2012, 02:42 | Сообщение # 6


Elven Maid
Группа: Администраторы
Сообщений: 107115


Куратор
За 50 постов За 100 постов За 500 постов За 1000 постов

Quote (Mursilka)
как раз для "чайников"

Оль, какой чайник biggrin Твои восточные текстуры были прелестны, которые ты не так давно делала wink
 
Дата: Воскресенье, 29.07.2012, 17:31 | Сообщение # 7


Группа: Друзья
Сообщений: 39





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

23.10 ну вот, как я и предполагала - застряла на каналах... Ладненько, займусь чем-нибудь другим.


Сообщение отредактировал Mursilka - Воскресенье, 29.07.2012, 23:10
 
Дата: Среда, 01.08.2012, 19:49 | Сообщение # 8


Saga aka Ведьма
Группа: Проверенные
Сообщений: 180



За 50 постов За 100 постов

Отличный урок, всё расписано..спасибо)

Не разбивайте никому сердце, у всех оно только одно. Ломайте кости - их 206.
 
Дата: Среда, 20.03.2013, 12:31 | Сообщение # 9


Группа: Проверенные
Сообщений: 43





Цитата (Mursilka)
23.10 ну вот, как я и предполагала - застряла на каналах... Ладненько, займусь чем-нибудь другим.

Прямо как и я! Еще вчера видела этот урок на арт-галереи, решила занятся. вот, до сих пор сижу


 
Форум » Мастерские и Туториалы » ❖ Туториалы » ❖ Туториалы | Tutorials THE SIMS 3 » Создание бесшовной многоканальной текстуры
  • Страница 1 из 1
  • 1
Поиск:

Яндекс.Метрика