- 55+ деревянных фонов и текстур для Фотошопа бесплатно
- Как создать реалистичную деревянную текстуру в Photoshop
- Шаг1
- Шаг2
- Шаг3
- Шаг7
- Шаг8
- Шаг9
- Шаг10
- Шаг11
- Шаг12
- Шаг13
- Шаг14
- Шаг15
- Шаг16
- Создаем две реалистичные текстуры дерева в Фотошоп
- Шаг 1
- Шаг 2
- Шаг 3
- Шаг 4
- Шаг 5
- Шаг 6
- Шаг 7
- Шаг 8
- Шаг 9
- Вторая текстура
- Шаг 1
- Шаг 2
- Шаг 3
- Шаг 4
- Шаг 5
- Шаг 6
- Шаг 7
- Шаг 8
- Шаг 9
- Шаг 10
- Шаг 11
- Шаг 12
- Как сделать бесшовную текстуру в Фотошопе. Уроки Фотошопа. — Видео
- Создаем деревянный декорированный текст в Photoshop
- Финальный результат
- Исходники
- Шаг 1
- Шаг 2
- Шаг 3
- Шаг 4
- Шаг 5
- Шаг 5
- Шаг 6
- Шаг 7
- Шаг 8
- Шаг 9
- Шаг 10
- Финальный результат
- Текстурирование. Первые шаги в Adobe Photoshop
- Часть I
- Textures & Patterns in Web Design – Photoshop CS6
- Written Tutorial Starts:
- 1. Find Amazing Textures
- 2. Create Your Own Texture!
- 3. Starting With Texture
- 4. Starting Playing With Textures
- 5. Add Noise
- 6. Pixelate>Mosaic
- 7. Download a Texture Or Pattern:
- 8. Adjust Our New Texture
- 9. Define a Pattern in Photoshop
- 10. Build It Slowly
- 11. Blend Modes & Opacity
- 12. Pepper In The Goodness
- 13. New Layer, New Texture
- 14. Continue Building The Texture/Pattern
55+ деревянных фонов и текстур для Фотошопа бесплатно
В отличии от рассмотренных ранее акварельных текстур узоры и фоны дерева для Фотошопа выглядят куда более детализированными, четкими без абстрактных реализаций и размытий. По стилистике некоторые из них похожи на гранжевые хотя здесь часто используются светлые цвета.
В сети есть специальные уроки по созданию текстур дерева в Photoshop, но если данная графика используется для коллажей, макетов сайтов и при этом не требует больших размеров, то гораздо проще скачать соответствующие готовые материалы. Напоминаем, что для этого нужно кликнуть по изображению любого набора ниже.
Wood Laminate TexturePack 02
6 Seamless Wood Textures
Wood Pattern Background
Free Wood Photo
Brown Planks Texture
Black Stained Planks Texture
Dark Natural Retro Decorative Backdrop Free Photo
Tileable Wood Texture with 3 Colors
Wood Textures ver 1
Wooden 300+ Texture Pack
Curved Raw Wood
Wood&Paint Free Textures
Wooden Planking Vector
HQ Wood
Seamless Wood Textures
4 Wood Images
Free Wooden Textures Pack
Wood Planks Background Texture
Wood Plywood Board Texture
Weathered Wood Free Textures
High Quality Wood Pack
Local Texture: Three by One
Wood Free Textures
6 Fine Wood Textures Vol.1
Wood Texture 5 by Rifificz
6 Free Tileable Wood Patterns
3 Curved Wooden Backdrops Vol.1
6 Vintage Wood Textures Vol.2
Free Wood Textures by Kamarashev
В статье можете найти ссылки на источники с разным количеством объектов: есть полноценные наборы, отдельные фотографии (в том числе и с Flickr). В принципе, при создании несложных иллюстраций вполне сгодятся и фото, и любая другая подходящая графика — деревянные фоны доски, столы, поверхности и т.п.
Stock Set Thirteen
Seamless Wood Patterns for PS
Plank Wall Texture
Wooden Pattern
Wooden Texture by Andrew Taylor
Wood texture by Parée
Plywood Chipboard Pressboard
Wood Pack I
Wood Texture Vector
Floorboards With Wooden Wall Photo
Wood Panels TextureSet by fudgegraphics
High Quality Wood TexturePack
Wooden Texturepack 1 by pharaoxp
Textures — Wood by onecoldcanadian
Wooden Free Photo
Wood Board by borysses
Wood Texture by xSweetSmile
WoodPack II by Architecturendu
25 Seamless Wood Textures
Big Collection of Wood Background
Pastel Wood Planks
Wood Texture Old Panels
Wood Background
Set of Pattern Wood Texture
Wood Textureset
Wood Collection Background
Итого в посте собрано более 55 объектов для дизайнеров, хотя на самом деле текстур и фонов под дерево для Фотошопа гораздо больше.
Пройдя по ссылкам выше на определенные сайты-архивы, можете дополнительно поискать в них похожие материалы, много интересного есть в Deviantart сервисе + обычные фото также подойдут.
Последние несколько линков ведут на премиальные работы, которые тоже нельзя исключать.
Как создать реалистичную деревянную текстуру в Photoshop
Главная » Уроки фотошоп» Практические уроки по Фотошоп
30.03.2014, 19:47
Доброго времени суток уважаемые пользователи программы Adobe Photoshop! Представляю вашему вниманию практический урок по созданию реалистичной деревянной текстуры. И если вас заинтересовала тема создания собственных текстур, то рекомендую ознакомиться здесь с методом создания медной текстуры.Приступим .Открываем программу Photoshop, версия подойдёт любая .
Шаг1
Создаем документ размером 1500х1500 пикс.
Шаг2
Выбираем в палитре цветов цвет # 5a3222 и заливаем документ :
Шаг3
Создадим новый слой и назовём его «Grain»(зерно)- это в версии автора, назвать его можно как угодно конечно же. Прежде чем продолжить, сбросте цвета на значение по умолчанию — черный и белый .Добавим к этому слою фильтр Облака — Фильтр-Рендеринг-Облака (Filter- Render- Clouds).Ваше изображение должно выглядеть следующим образом:Растягиваем слой с облаками , при помощи инструмента Трансформирование (Ctrl+T) по вертикали до 600%.Применяем фильтр Размытие — Фильтр-Размытие-Размытие в движении (Filter- Blur-Motion Blur). Настройте его как на картинке ниже:Ваше изображение должно выглядеть следующим образом
Шаг7
Применим постеризацию к слою «Grain»- Изображение-Коррекция-Постеризация (Image-Adjustments-Posterize). Уровень постеризации как на скрине:
Шаг8
При помощи фильтра Выделение краёв создадим узор древесины — Фильтр- Стилизация-Выделение краёв (Filter-Stylize-Find Edges) .Зайдем в Уровни (Ctrl+L)и добавим контрастности узору.
Шаг9
Далее заходим в Фильтр-Шум-Добавить шум (Filter-Noise-Add Noise) и устанавливаем значение 65% чтобы сделать узор реалистичнее.
Шаг10
Дальше переходим Фильтр-Размытие-Размытие в движении (Filter- Blur- Motion Blur) и дать ему следующие параметры:
Шаг11
Дублируем слой «Grain» и переименуем его в «Specularity» , временно отключаем его. Используем его позднее для придания текстуре объема.
Шаг12
Меняем режим наложения слоя «Grain» на Умножение (Muiliply). И у нас уже должна получиться почти готовая текстура.
Шаг13
Отключаем слой «Grain» и делаем слой «Specularity» видимым.
Шаг14
Инвертируем слой «Specularity» нажатием сочетания Ctrl+I. После этого изменим контрастность (Ctrl+L):
Шаг15
Меняем режим наложения на Осветление (Screen) и установливаем непрозрачность этого слоя 10%. Делаем активным слой «Grain».
Шаг16
Для получения полного эффекта сдвинем слой «Specularity» вниз и вправо на несколько пикселей. Этот шаг кажется незначительным но эффект от него значительный . Любуемся результатом :Можно поменять цвет нижнего слоя и получить текстуры разных сортов дерева.
Создаем две реалистичные текстуры дерева в Фотошоп
В этом уроке я покажу, как создать два вида реалистичных текстур дерева, используя только инструменты Photoshop.
Финальный результат:
Шаг 1
Создайте новый документ размером 1500 х 1500 пикселей и заполните его цветом #c58352.
Шаг 2
Нажмите Ctrl + Shift + N, чтобы создать новый слой. Установите основной цвет на #bb7f4d, а фоновый — #472f0f, затем перейдите в меню Фильтр > Рендеринг > Облака (Filter > Render > Clouds).
Шаг 3
Конвертируйте слой в Смарт-объект (Smart Object) и перейдите в меню Фильтр > Рендеринг > Волокна (Filter > Render > Fiber).
Шаг 4
Добавьте корректирующий слой Уровни (Levels) над текущим и максимально повысьте контраст.
Шаг 5
Создайте новый слой над Уровнями. Выберите слой с волокнами, затем активируйте инструмент Волшебная палочка (Magic Wand Tool). Кликните по документу, выделив красные участки.
Нажмите Ctrl + I, инвертировав выделение, а затем Ctrl + C, чтобы его скопировать. Создайте новый слой и нажмите Ctrl + V для вставки выделенных участков. Скройте или удалите Уровни, так как они нам больше не нужны.
Я выключил еще и слой с волокнами, чтобы вы более ясно видели результат.
Шаг 6
Дважды кликните по этому слою, выберите Тиснение (Bevels & Emboss). Установите цвет Подсветки (Highlight) на #1c180e, а цвет Тени (Shadow) — #64522c.
Включите слой с волокнами и получите такой результат:
Шаг 7
Создайте новый слой и при помощи инструмента Штамп (Clone Tool) удалите похожие детали, сделав текстуру более естественной.
Шаг 8
Добавьте корректирующий слой Цветовой тон/Насыщенность (Hue/Saturation), чтобы немного обесцветить поверхность.
Шаг 9
Используйте корректирующий слой Кривые (Curves), отрегулировав контраст и цвет текстуры.
Выделите все видимые слои, затем нажмите Ctrl + G, объединив их в группу. Назовите ее «Дерево 1», затем скройте.
Вторая текстура
Шаг 1
Создайте новый слой, заполните его цветом #c19356. Конвертируйте его в Смарт-объект (Smart Object).
Шаг 2
Дублируйте этот слой, перейдите в меню Фильтр > Оформление > Меццо-тинто (Filter > Pixelate > Mezzotint) и выберите Длинные штрихи (Long Strokes).
Шаг 3
Перейдите в Фильтр > Размытие > Размытие в движении (Filter > Blur > Motion Blur), после чего установите следующие значения.
Шаг 4
Дублируйте слой и растрируйте его. Перейдите в Редактирование > Трансформирование > Поворот на 90° по часовой (Edit > Transform > Rotate 90 Clockwise).
Шаг 5
Снова конвертируйте его в Смарт-объект. Добавьте Размытие в движении (Motion Blur).
Шаг 6
Создайте корректирующий слой Цветовой тон/Насыщенность (Hue/Saturation), обесцветив полученный слой.
Шаг 7
Нажмите Ctrl + Shift + Alt + E, объединив все видимые слои в один новый. Скройте всё кроме исходного слоя с заливкой и объединенного. Установите режим наложения последнего на Перекрытие (Overlay), а Непрозрачность (Opacity) укажите 100%.
Шаг 8
Средняя часть текстуры выглядит размытой и менее детализированной. Чтобы это исправить, дублируйте слой и создайте для него маску. Используйте мягкую черную кисть, чтобы стереть нижнюю и верхнюю части, сделав их менее видимыми.
Шаг 9
Дважды дублируйте слой, затем перетяните его на середину, сделав ее более детализированной. Используйте маску слоя, чтобы смягчить края и смешать участки с нижним слоем.
Шаг 10
Сгруппируйте все слои с режимом наложения Перекрытие (Overlay). Установите режим группы на Перекрытие (Overlay) со 100% непрозрачности. Используйте корректирующий слой Кривые (Curves), осветлив детали текстуры.
Шаг 11
Вернитесь к группе «Дерево 1». Дублируйте слой из шага 3 первой секции, затем перетяните его, поместив над слоями группы «Дерево 2». Перейдите в меню Выделение > Цветовой диапазон (Select > Color Range) и установите Разброс (Fuzziness) 170.
Шаг 12
Нажмите Ctrl + J, чтобы скопировать выделенные участки на новый слой, после чего скройте исходный. Измените режим наложения на Перекрытие (Overlay) с 50% непрозрачности.
Готово!
Надеюсь, вам понравился урок!
Как сделать бесшовную текстуру в Фотошопе. Уроки Фотошопа. — Видео
10 меc назад
Обработка акварельной иллюстрации для стоков. Создание текстуры без швов в Фотошопе.
8 лет назад
Специально для сайта http://icloneru.wordpress.com/
2 лет назад
Урок, продолжающий серию уроков по созданию бесшовных текстур в Photoshop. Из данного урока Вы узнаете, как можно сделать бесшовную текстуру из фотографии декоративной штукатурки… *материалы к уроку* Исходная фотография штукатурки: http://go.katalproject.ru/l Готовая бесшовная текстура штукатурки: http://go.katalproject.
ru/m *навигация по уроку* 00:00 — вступление 00:58 — создание бесшовной текстуры из фотографии штукатурки *о KatalProject* KatalProject посвящен программным продуктам, используемым в сфере архитектурного проектирования и дизайна. Он поможет Вам освоить современные инструменты, которыми должен владеть проектировщик и дизайнер.
На KatalProject Вы сможете найти уроки по таким программам для работы с графикой, как 3ds Max, AutoCAD, Photoshop, V-Ray… *ссылки* Смотреть другие уроки по созданию бесшовных текстур в Photoshop: https://www.youtube.com/watch?v=VYn0KlN84lM&index=2&list=PLPxazhoNgCVahm7bQLldRFN559eDggCwV Статьи про Photoshop на сайте KatalProject: http://katalproject.
ru/news/stati_photoshop/1-0-3 Уроки по Photoshop на сайте KatalProject: http://katalproject.ru/news/uroki_photoshop/1-0-11
2 лет назад
Если тема растровых паттернов вас заинтересовала — приглашаем пройти специальный курс Александра Серакова «ВСЁ О ПАТТЕРНАХ. ЧАСТЬ II. ADOBE PHOTOSHOP», со скидкой 10% по купону i-love-patterns https://universtudio.ru/vsyo-o-patternax-chast-ii-adobe-photoshop/
4 лет назад
Меганабор мини-курсов от проекта Фотошоп-мастера — https://photoshop-master.ru/r/mini.
php Приветствуем всех любителей Photoshop! В этом уроке вместе с Екатериной Любимовой вы поработаете над созданием текстур, используя замечательный фильтр Тиснение.
Ссылка на подробный урок «Как создать текстуру в Фотошоп» https://photoshop-master.ru/lessons/design/sosdaem-tekstury.html Другие уроки из раздела «Дизайн/Рисование» https://photoshop-master.ru/lessons/design/
3 лет назад
В уроке я покажу как легко создать узор используя смарт-объекты. Вы узнаете как быстро переместить объект на заданное расстояние, и автоматизировать это с помощью «Операций».
3 лет назад
Создаем деревянный декорированный текст в Photoshop
В этом уроке мы создадим типографический эффект в Adobe Photoshop. Мы будем работать с текстурами и паттернами. Также много времени уделим работе со стилям слоев.
Финальный результат
Исходники
1. Текстура дерева
2. Шрифт Janda Manatee
3. Паттерны от Ransie3.
4. Цветочная ткань от sofi01.
5. Diagonal Noise паттерн от Christopher Burton.
6. Градиенты от ilnanny.
Шаг 1
Создайте новый документ размером 1152 x 864 px. Затем дублируйте слой фона.
Кликните дважды по названию слоя в палитре Layers (Слои), чтобы открыт окно Layer Style (Стили слоев). Примените следующие стили с настройками как на картинках ниже.
Gradient Overlay/Наложение Градиента:
Для градиента используйте два цвета: #ffffff и #3f3f3f.
Pattern Overlay/Перекрытие Узора:
Таким образом у нас получится темная текстура дерева.
Шаг 2
Создайте надпись, все заглавными буквами, используя шрифт “Janda Manatee”. Цвет текста — белый, размер — 250 pt, расстояние между буквами (Tracking) установите в 25.
Дважды дублируйте слой с текстом.
Шаг 3
Откройте файл ” VF_r03.jpg” из ” Patterns 21″. Затем в меню выберите Image -> Adjustments -> Levels / Изображение > Коррекция > Уровни, и укажите в параметре Gamma/Гамма значение 0.75.
Это действие немного затемнит паттерн. Вы можете увеличить значение параметра, чтобы сделать текстуру светлее, или уменьшить, чтобы еще сильнее затемнить.
Теперь зайдите в Edit -> Define Pattern / Редактировать > Определить узор, и введите имя для паттерна.
Шаг 4
Кликните дважды по оригинальному слою текста, чтобы указать ему стиль слоя Drop Shadow/ Тень. Укажите Distance/Расстояние в 10, и Spread/Размах в 10, а также Size/Размер в 29.
Так мы добавим обычную тень.
Шаг 5
Кликните дважды по первой копии текста и укажите следующие стили слоев, с параметрами как на картинках ниже:
Bevel and Emboss/Тиснение, стиль:
Contour/Контур:
Stroke/Обводка:
Drop Shadow/Тень:
Должно получиться вот так:
Шаг 5
Кликните дважды по второй копии слоя с текстом и укажите следующие стили слоев:
Bevel and Emboss/Тиснение:
Contour/Контур:
Pattern Overlay/Перекрытие Узора:
Outer Glow/Внешнее Свечение:
Drop Shadow/Тень:
Вот что должно получиться в итоге:
Шаг 6
Удерживая Ctrl/Cmd кликните по слою с текстом, чтобы вызвать выделение по контуру букв.
В меню выберите Select -> Modify -> Contract / Выделение > Модификация > Сжать, и укажите значение 10.
Создайте новый слой поверх всего и назовите его “Pattern”. Залейте выделение белым цветом (Ctrl или Alt + Backspace). Снимите выделение (Ctrl/Cmd + D).
Смените параметр Fill/Заливка для слоя “Pattern” на 0%, затем дублируйте его. Назовите копию “Inner Shadow”.
Шаг 7
Дважды кликните по слою “Pattern”, чтобы применить к нему стиль слоя Pattern Overlay/Перекрытие Узора. Смените режим наложения (Blend Mode) на Multiply/Умножение, выберите паттерн “mary-rore.jpg” из “Floral Fabric Patterns” и смените Scale/Размер на 50%.
Вот что получится:
Кликните дважды по слою “Inner Shadow”, чтобы применить к нему стиль слоя Inner Shadow/Внутренняя тень. Смените цвет на #553c21, а размер на 13.
Результат:
Шаг 8
Смените первый цвет на #707070, возьмите инструмент Rectangle Tool/Прямоугольник, и нарисуйте прямоугольник размером 16 x 21 px в верхней части одной из букв.
Возьмите инструмент Add Anchor Point Tool/ «Перо+» (добавить опорную точку). Кликните по середине левой и правой стороны прямоугольника, добавляя таким образом точки.
Инструментом Direct Selection Tool / Прямое выделение, выделите две новые точки. При помощи стрелок на клавиатуре подвиньте точки на 2 пикселя правее (дважды нажмите по кнопке вправо).
Шаг 9
Кликните дважды по слою с новой фигурой, чтобы применить к нему следующие стили слоя:
Bevel and Emboss/Тиснение:
Texture/Текстура:
Gradient Overlay/Наложение градиента(выберите градиент “Brass 70″ из “RS_Metals.grd”):
Наша фигура стала похожа на металлическую.
Шаг 10
Дублируйте слой с фигурой, затем сделайте невидимым оригинал, нажав на иконку глаза слева от слоя. Теперь сделайте активным слой с копией фигуры и в меню выберите Layer -> Rasterize -> Layer Style/ Слой > Растрировать > Слой стиля. Так вы растрируете и фигуру и стиль слоя.
Примените к слою стиль Drop Shadow/Тень, указав Distance/Расстояние в 1.
Вот что должно получиться:
Дублируйте слой и инструментом Move Tool/Перемещение переместите фигуру на другую букву. Также вы можете ее поворачивать: Edit -> Transform -> Rotate/Редактировать >Трансформировать> Поворот.
Повторите то же и для остальных букв.
Финальный результат
Автор урока Rose
Перевод — Дежурка
Смотрите также:
Текстурирование. Первые шаги в Adobe Photoshop
Здравствуйте, меня зовут Евгений Булатов, я работаю художником в студии Extreme Developers.
Я расскажу вам о том, как просто и качественно делать сходящиеся (т.е. повторяющиеся без швов) текстуры.
Зачастую, необходимо, что бы текстура повторялась, образовывая сплошное покрытие, это удобно к тому же сильно экономит память. Особенно интенсивно такие текстуры используются в геймдеве.
Там где нужно экономить каждый байт, художники должны отлично владеть методами создания красивых но экономичных текстур.
Сходящиеся текстуры еще называют Тайловыми от английского слова Tile – плитка. Создание текстуры начинается с фотографии. Вы можете сфотографировать поверхность сами, или воспользоваться готовыми коллекциями. Есть замечательный банк фототекстур в высоком разрешении по адресу http://cgtextures.com/ До 15 mb в день бесплатно, плюс, он постоянно обновляется.
Интересно так же фотографировать текстуры самому. Вот несколько рекомендаций. Поверхность должна быть равномерно освещена рассеянным светом. Для этого подойдет пасмурная погода, или тень.
Желательно что бы поверхность занимала всю площадь кадра и была под прямым углом к объективу. Переключите баланс белого фотоаппарата на облачно или пасмурно, в зависимости от ваших условий.
Ну и конечно тщательно сортируйте фотографии, иначе спустя год вы ничего не найдете в своей коллекции.
Итак, фотография найдена…
Часть I
Ниже, я покажу один из способов создания сходящейся текстуры. Но сначала, сделайте простую вещь. Запустите Photoshop и нажмите Ctrl+K
В окне настроек на вкладке Performans в поле History States поставьте 100. Photoshop будет запоминать последние 100 операций которые вы сможете отменить в палитре истории. Вот теперь можно работать.
Для примера я выбрал фотографию кирпичной стены. Создадим из нее квадратную текстуру в разрешении 512 x 512.
Открываем снимок в Photoshop. И инструментом Crop (Обрезка {C}) вырезаем нужный участок. При вырезании зажмите Shift что бы наша область была квадратной. Перед отсечением вы можете повернуть рамку, добейтесь того, что бы ряд кирпичей был параллелен одной из сторон рамки. (для поворота переместите курсор за ее границы, он изменится на двойную изогнутую стрелку, теперь можно вращать).
Если вы создаете текстуру с регулярным узором (кирпичи, доски, кафельная плитка), вам понадобится выправить перспективные искажения, иначе текстура не сойдется (с текстурой штукатурки, песка или травы все проще ).
Для этого, дважды щелкните по слою Background и в появившемся окне нажмите ОК (вы разблокировали слой). Затем, с помощью свободной трансформации {Ctrl+T} выровняйте ряды кирпичей. Или более гибким инструментом для точной подгонки Edit –
Transform – Warp (Редактирование – Трансформация – Деформация)
При использовании свободной трансформации нажмите Ctrl так вы будете двигать каждый узелок независимо. Отпустите Ctrl и вы будете перемещать всю сторону.
Вот что у вас должно получиться:
(обратите внимание как ряды кирпичей примыкают к нижней и верхней кромкам)
После того, как вы выровняли картинку, вновь обрежьте ее что бы удалить пиксели зашедшие за края. Иначе, при следующем шаге вы рискуете получить странный результат. (при трансформации пиксели могут попасть за границы документа).
Затем воспользуйтесь фильтром Offset.
Filter – Other – Offset (Фильтр – Другие – Смещение)
Этот фильтр сдвигает изображение по горизонтали и вертикали. Сначала, сдвиньте текстуру по вертикали на половину.
(Если у вас текстура 512, смещайте на +256) Можете сдвигать и приблизительно, на глаз. После применения фильтра, вы сразу увидите, как стыкуются ряды кирпичей. Если что то вам не нравится вернитесь назад и вновь подправьте изображение.
После того как с вертикальной сходимостью закончено, сдвиньте текстуру влево (фильтром Offset). Здесь придется поработать штампом (инструмент Clone Stamp {S}). В зависимости от текстуры, я выбираю штамп или лечащую кисть (Healing Brush).
Штамп, как и лечащая кисть, копирует участки изображения с одного места на другое. Что бы указать редактору откуда брать фрагмент нажмите Alt и кликните мышкой.
Затем рисуйте штампом там, где вы хотите убрать шов. (отличие лечащей кисти заключается в том что она подбирает яркость на исправленном участке. Пользуйтесь тем или иным инструментом в зависимости от ситуации).
Кирпич за кирпичом аккуратно «заклонируйте» шов.
После того как швы убраны, осталось только подогнать текстуру под нужный размер. Примените команду Image – Image Size и поставьте нужное значение высоты и ширины в пикселях (в этом примере 512 х 512). Текстура готова!
Часть II
Но зачастую, после наложения такой текстуры заметно, что она повторяется. Небольшие перепады яркости, какие-то пятна, и мы сразу улавливаем ритм.
Можно проверить, как повторяется текстура, не выходя из редактора. В меню Edit, выберете Define Pattern. Появится окно для добавления текстуры в коллекцию пресетов. Нажмите ОК. Затем создайте новый документ в несколько раз больший чем ваша текстура, например в 5 раз. И нажмите Shist+F5, что равносильно команде заливка
(Edit – Fill).
Выберете тип заливки — текстура (паттерн). Выберете ваш паттерн, он будет последним. Нажмите ОК, и вы увидите как ваша текстура повторяясь заполнила изображение.
Если повторения слишком заметны, текстуру можно доработать. Убрать какие-то неоднородные детали, или перепады по яркости. Долгое время я исправлял текстуры вручную, пока не догадался, что перепад по яркости можно выровнять автоматически.
Рядом с фильтром Offset, в Photoshop, есть фильтр High Pass (высокий проход).
Если углубиться в теорию то выясниться, что это фильтр низкой частоты. Что это значит на практике? На практике это означает, что он сглаживает большие по площади колебания яркости, оставляя не тронутыми колебания которые имеют мелкую фактуру.
Поясню с другой стороны. Всем известный фильтр Gaussian Blur (Размытие по Гауссу), можно рассматривать как фильтр высокой частоты. Он сглаживает высокочастотные колебания, оставляя нетронутыми плавные изменения яркости.
Таким образом, можно например, избавить фотографию от мелкого, случайного, цифрового шума. Конечно, при этом фотография потеряет в четкости, но большинство контуров останется. Фильтр High Pass действует противоположным образом, оставляя мелкую фактуру, он убирает общие пятна.
А это именно то, что нужно для выравнивания текстур!
Вот небольшая иллюстрация действия этих фильтров на изображение:
Посмотрите, как меняется текстура в первом и втором случае. Радиус действия фильтров одинаков, и все становиться очевидно!
После применения фильтра High Pass фактура кирпичей, швы, трещины остались, а большие темные пятна внизу исчезли.
После фильтра Gaussian Blur, исчезли все мелкие детали, и проявились те пятна которые убрал High Pass! Примечательно что если объединить эти два слоя в в режиме Overlay, мы получим исходное изображение.
Из за того, что High Pass действует сразу во всех каналах, цвета искажаются. Но это не страшно. Этим фильтром очень удобно выравнивать яркостную составляющую текстуры, и в большинстве случаев это работает, делая повторения текстуры не такими заметным.
На этом с теорией закончим, на практике все очень просто:
1. Скопируйте слой с текстурой {Ctrl+J}
2. Обесцветьте его {Ctrl+Shift+U}
3. Смените режим смешивания этого слоя на Luminosity (Яркость)
4. Примените фильтр Hight Pass (Высокий проход) с подходящим радиусом.
Готово!
Для текстуры из урока подойдет радиус в пределах 15-30 пкс.
Если текстура кажется вам слишком плоской, увеличьте радиус в настройках фильтра, так же можно уменьшить степень непрозрачности слоя.
Когда, результат вам понравится, можете откинутся на спинку кресла и насладится плодами своих трудов. Вы сделали качественную текстуру. А главное узнали способ создавать их в неограниченном количестве. Для этого, вам всего лишь, потребуется побродить с фотоаппаратом)
Готовая текстура:
Когда вы освоите Photoshop и запомните горячие клавиши, создание такой текстуры будет занимать у вас минут пятнадцать. И главным вопросом будет где найти или как сфотографировать ту текстуру, которая нужна в вашей работе. Особенно если на дворе лето, а вам нужен снег!
В заключении хочу поблагодарить Яшу известного как Snork, Елену aka Porcelana и Евгения ksi2 за помощь в создании урока. Конечно, это были самые начала в создании текстур. Надеюсь, с вашей помощью, я продолжу этот рассказ.
Textures & Patterns in Web Design – Photoshop CS6
Written Tutorial Starts:
1. Find Amazing Textures
The web is loaded with amazing design resources and textures, you will be bombarded with loads of content if you run a google search, but here are a few of my favorite places to find amazing textures.
Subtle Patterns: http://subtlepatterns.com/
Lost & Taken: http://lostandtaken.com/
Brusheezy Patterns: http://www.brusheezy.com/patterns
2. Create Your Own Texture!
Just remember that any photo can be a texture! Don’t let the term ‘texture’ define how you use or don’t use a graphic/picture if you see cool details, brightness,etc… don’t hesitate if you think it will apply to your project nicely.
Do you use any amazing pattern/texture resources? If so, share in the comments section!
3. Starting With Texture
Typically I do not create textures. I usually start with a texture and play with it by adding additional textures with Photoshop and additional textures that I love.
Creating textures from scratch can be as easy as photographing an amazing pattern that you stumble across or you can take the time to build rows of pixels and create amazing,beautiful patterns with straight lines.
There are literally hundreds of ways to create millions of patterns.
4. Starting Playing With Textures
I’m going to go with the route that I typically use and play with and customize existing existing patterns, essentially we’re going to layer and build a complex pattern that we think looks cool. In Photoshop we’re going to create a new document with the specific size of 500px by 400px.
5. Add Noise
With the “Background” layer selected, we’re going to go Filter>Noise>Add Noise and add 100% noise set to Gaussian and Monochromatic checked on.
6. Pixelate>Mosaic
Next go Filter>Pixelate>Mosaic and set the cell size to 20 square.
7. Download a Texture Or Pattern:
Go grab the “SubtleNet” texture from the good people over on SubtlePatterns.com. Link: http://subtlepatterns.com/subtlenet/ Unzip it and open the “[email protected]” file in Photoshop.
8. Adjust Our New Texture
With this pattern open, go Image>Adjustments>Levels and drag the upper black handle to the right until you set it’s input box says “160”. Go ahead and hit “OK” to commit those changes. Let’s move on.
9. Define a Pattern in Photoshop
Now we want to define this small image as a pattern. I love using these little patterns to build on because they already have seamless edges built in; It’s just one less thing to worry about. To define this a a pattern, go Edit>Define Pattern and give it a name.
10. Build It Slowly
Jump back over to our “build-a-texture” document and add a new layer. Grab the Paint Bucket Tool (G) located ‘under’ the Gradient Tool and look to the control bar for this tool and set it to fill with “Pattern”. Choose our pattern from the drop down box.
11. Blend Modes & Opacity
Click anywhere on this new layer to fill it with our pattern and then set the layer to the blend mode “Multiply”. This is going to knock out all the white and preserve the mesh look over our mosaics. Reduce the layer opacity to 20% and move on to the next step.
12. Pepper In The Goodness
Let’s add another texture to this. I am going to repeat step five,except I’m going to download the “Vintage Speckles” texture and open it in Photoshop and convert it to a pattern. (I used the “[email protected]” pattern.)
13. New Layer, New Texture
Create a new layer in our new texture document and use that same Paint Bucket and “pour” in our new pattern and set this layer to “Multiply” as well.