Брусчатка различных цветов от компании Мегаполис Про.

GIMP — The GNU Image Manipulation Program
Гимп — бесплатный графический редактор

   


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

Главная Уроки Создание бесшовной текстуры брусчатки

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

Несколько советов помогут снять хороший оригинал:

  1. Используйте качественный фотоаппарат высокого разрешения. Разрешение дешевых мыльниц можно смело делить на три, и при редактировании неизбежно теряется качество, поэтому должен оставаться запас прочности. Не экономьте и снимайте с максимально возможным качеством.
  2. Старайтесь снимать объект под прямым углом, желательно со штатива, на котором есть уровень. Так вы получите ровную текстуру, которую не придется потом корректировать.
  3. Не используйте вспышку. Она даст лишние блики, эффект виньетки и множество других неприятностей. Лучше установить выдержку побольше и поставить фотоаппарат на штатив.
  4. Не снимайте объект слишком близко или слишком далеко. Оптимально, если снимать кирпичную стену, на фотографии должно умещаться 8 — 16 кирпичей.
  5. Снимайте объект не вплотную, а с расстояния 5 — 10 метров. Это позволить избежать неприятных эффектов искажения оптики и расфокусировки по краям. Исключите попадания в кадр мусора и посторонних предметов.

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

Исходная фотография: http://fc03.deviantart.net/fs70/f/2010/355/2/2/brick_floor_05_by_camarogirl666_stock-d35bnyh.jpg

В этом уроке будет создаваться бесшовная текстура, смысл которой заключается в том, что при укладке данной текстуры «черепицей» не будет заметно никаких изъянов. Такие текстуры широко используются в играх; также из игр пошла традиция делать такие текстуры не прямоугольными, а квадратными. Не менее полезен урок будет 3D-художникам, которым часто приходится подыскивать текстуры высокого разрешения для сценок.

Откройте вашу фотографию в редакторе. Выберите пункт меню «Слой — Преобразования — Сместить» или нажмите сочетание клавиш Ctrl+Shift+O. В появившемся окне нажмите кнопку «Сместить на (х/2), (у/2)» и примените изменения, нажав кнопку «Смещение».

Посмотрим на результат:

Сразу стали видны недостатки фотографии: при смещении заметны стыки, а фотография имеет неравномерное распределение яркости, что сильно бросается в глаза.

Отмените смещение, нажав сочетание Ctrl+Z, или повторите смещение слоя.

Сначала займемся коррекцией яркости. Правило хорошего тона для текстуры — монотонность яркости, так как свет и тень художник добавляет сам.

Создайте копию слоя:

Выделите копию слоя, и примените фильтр Гаусса (Фильтры — Размывание — Гауссово размывание) радиусом не менее 1/5 от изображения. Исходное изображение имеет разрешение 4000 пикселей, поэтому я поставлю радиус размывания 500:

Полученный размытый слой нужно обесцветить (Цвет — Обесцвечивание), в открывшемся окне выберите «Светимость»:

И инвертируйте слой (Цвет — Инвертировать):

Измените режим этого слоя на «Объединение зерна»:

В результате получится текстура с равномерной яркостью:

Объедините слои:

Если снова выполнить смещение (Слой — Преобразования — Сместить; Сместить на (х/2), (у/2)):

то уже будет заметно серьезное улучшение:

Отмените смещение (Ctrl+Z).

Основная часть работы ещё впереди: стыки текстуры достаточно заметны, и нужно сделать так, чтобы их не было.

Второй этап — подготовка видимой части текстуры. Наметим на картинке опорные точки, покрывающие наиболее удачный участок фотографии и больше всего напоминающие квадрат. Я выбрал эти:

Это просто демонстрация, на текстуре ничего рисовать не нужно.

Теперь при помощи инструмента «Кадрирование» создайте такой кадр, чтобы:

а) все выбранные опорные точки попали в него;
б) кадр должен быть квадратным (можно ввести размер прямоугольника вручную в меню инструмента, чтобы не целиться мышкой);
в) опорные точки будут стыками на текстуре, соответственно нужно следить, чтобы они совпали при стыковке, вот как это выглядит у меня:

Завершите кадрирование, щелкнув внутри прямоугольника.

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

На самом изображении я установил уголки инструмента перспективы в точности на опорных точках, в данном случае — углы кирпичей:

После завершения нажмите «Преобразовать».

Приведите слой к размеру изображения.

Снова выполните смещение слоя, и убедитесь, что коррекция перспективы имела положительный эффект:

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

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

Теперь, для борьбы с этими небольшими недостатками нужно взять инструмент «Штамп» с мягкой кисточкой. Зажав Ctrl, выберите похожий участок изображения без дефекта и закрасьте все швы, которые образуют форму креста:

Без «Штампа» здесь как без рук. Я также с помощью «Штампа» удалил наиболее резкие пятна с текстуры.

Сместите слой снова по оси х на половину ширины изображения. В центре, скорее всего, окажется дефект. Удалив его штампом, снова сместите слой, но уже на х/2, у/2. В центре снова будет дефект, который нужно удалить. Теперь текстура полностью готова.

Осталось посмотреть, как будет выглядеть текстура при укладке черепицей. Выберите в меню «Фильтры — Карта — Маленькая черепица». Нажмите ОК. В этом режиме будет видно, как хорошо (или плохо) стыкуется текстура сама с собой, а также станут заметны некоторые недостатки: шум, пятна, резкие перепады цвета и т. д.

После просмотра отмените этот фильтр (Ctrl+Z). Далее по вкусу можно изменить резкость, контраст, цвет:

Теперь эта текстура прекрасно впишется в любой трехмерный ландшафт или станет частью коллажа. Как видно из урока, оригинальная фотография 4000×3000 превратилась в текстуру 2500×2500, которую для увеличения четкости пришлось ещё уменьшить в два раза. Таким образом, из изображения 4000×3000 можно получить лишь текстуру 1024×1024 высокой четкости.


3

В избранном у 3 человек:

Метки: , , , .

Результаты урока

Добавить

Уроки: предыдущий следующий

8 комментариев

0

Пользователь #4Андрей Сидоров11 января 2012 в 19:12Личное сообщение

Отличное объяснение, я считаю. Давненько пытался объяснить создание бесшовных текстур как для самых маленьких, но из комментариев понял, что не получилось =) тут ясней вроде.

0

Пользователь #5542Павел RPG11 января 2012 в 20:00Личное сообщение

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

0

Пользователь #4304Владимир Отага12 января 2012 в 01:10Личное сообщение

Урок таки появился во время, пригодится для моего проекта.Большое спасибо)
Р.S ...что за тема для ХР

4

Пользователь #5542Павел RPG12 января 2012 в 09:03Личное сообщение

> Р.S ...что за тема для ХР

Тема называется "Удалил ХР и поставил Убунту"

0

Пользователь #4304Владимир Отага13 января 2012 в 01:08Личное сообщение

Пардоньте, всю жизнь на "окнах" , про "Убунту" только слышал

0

Пользователь #7149Евгений Козлов13 января 2012 в 22:24Личное сообщение

Спасибо! Хороший и полезный урок!
По поводу Ubuntu - это XP без глюков бесплатно! Как говорится: must have.
Особенно радует, что в стандартной установке GIMP есть куча плагинов, которые для винды еще поискать и поставить надо. Правда, спасибо авторам этого сайта - они кое что выкладывают у себя.

0

Пользователь #7149Евгений Козлов13 января 2012 в 22:28Личное сообщение

Для тех, кто в окнах: рекомендую скачать десктопный диск Ubuntu Studio - творческий дистрибутив на базе Ubuntu, официально признанный, кстати, в Canonical - под свое железо, загрузиться с него и заценить всю силу Open Source!!!

1

Пользователь #5542Павел RPG18 января 2012 в 01:02Личное сообщение

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

P.S. Как же бесит работающий Ctrl+<- в окне набора комментария!

Чтобы участвовать в обсуждении вы должны войти или зарегистрироваться.

  • >

Информация по уроку

Другие уроки автора

Открытка к Дню святого Валентина
В этом уроке будем рисовать сердце с «водным» эффектом.

Закругление объектов
Как сделать любую фигуру более округлой: текст, прямоугольник или сложную фигуру.

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

Кисти

AnimalPrints_1 AnimalPrints_2 AnimalPrints_4 AnimalPrints_5 AnimalPrints_6 AnimalPrints_7 AnimalPrints_8 AnimalPrints_9 AnimalPrints_10 AnimalPrints_11 AnimalPrints_13 AnimalPrints_16 AnimalPrints_18 Мишень real oil 3 GIMP Brush Pipe GIMP Brush Pipe Rock1 Sc_Scratch Tank1 Hole1 Hole2 Hole3 Hole4 h_texture мазай кисть
Воспользуйтесь нашим сортировщиком кистей для подбора нужной кисти.

Оценка урока

«Создание бесшовной текстуры брусчатки» получил оценку 5.00 на основе 6 голосов.

13876+0
Комментариев

вверх