Содержание
Текстура дерева с применением фильтров фотошопа
19 августа 2014, 19:19
|
Татьяна
|
Уроки Photoshop
|
В этом уроке я распишу 2 способа создания деревянной оригинальной текстуры:
первый по принципу урока Текстура металла с применением фильтров фотошопа, второй с применением других фильтров, но так же простой.
1 способ создания текстуры дерева:
1. Создаем новый документ с белой заливкой. Добавляем шум примерно такого плана:
2. Идем в галерею фильтров, выбираем «Штрихи» — «Наклонные штрихи» (Brush Strokes-Angled Strokes) с настройками:
3. Добавляем новый слой, заливаем его коричневым цветом (у меня это цвет #4b2511), меняем режим наложения на «Умножение» (Multiply), получили текстуру дерева. Меняя цвет заливки, можно корректировать цвет создаваемой текстуры.
Дальше дорабатываем текстуру на свой вкус, я добавлю затемнения по краям, световых и текстовых эффектов.
2 способ создания текстуры дерева:
1. Создаем новый документ с белой заливкой. Применяем фильтр «Рендеринг» — «Волокна».
2. Аналогично п.3 из предыдущего способа: новый слой, заливаем его коричневым цветом (у меня это цвет #4b2511), меняем режим наложения на «Умножение» (Multiply), получили текстуру необработанного дерева. Меняя цвет заливки, можно корректировать цвет создаваемой текстуры.
Дальше дорабатываем текстуру на свой вкус; я добавлю затемнения по краям, световых и текстовых эффектов.
Если слой, полученный после применения фильтра «Волокна» размыть в движении (Motion Blur) строго вертикально, получится текстура спиленной доски:
В общем, различных вариантов масса, можно, конечно, найти и в интернете текстуру, но рисовать свои-интереснее и оригинальнее.
картинки, текстура дерева, фотошоп
Понравилась статья? Поделись с друзьями:
Читайте также
Текстура металла с применением фильтров фотошопа
В этом небольшом уроке я расскажу об одном из самых быстрых способов создания металлической оригинальной текстуры…
Качественные скругления в фотошопе
Очень часто при разработке дизайна сайта или иконок нужны скругленные углы. Если фигура простая, инструмент «Прямоугольник со скругленными углами» (Rounded rectangle vector tool) вам в помощь. Но что делать, если углов много?..
Бесшовная текстура вагонки
В интернете можно найти массу различных текстур любого качества и размера. Но для некоторых проектов по ряду причин приходится делать свои текстуры. В этом уроке вы научитесь рисовать свою текстуру без использования стилей только с применением векторных форм в Фотошопе (для фотошопа CS6)
Текстурирование. Первые шаги в 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 за помощь в создании урока. Конечно, это были самые начала в создании текстур. Надеюсь, с вашей помощью, я продолжу этот рассказ.
586
0
850
58
25
2007-10-06
Неплохой урок!
2007-10-06
Иделальный урок для начинающего текстурщика — проверено! 😉
2007-10-06
на скоко я помню, в шопе начиная с 7 вроде, есть команда настройки тональности что ли, вобщем того же что было сделано с помощью 2-х слоёв, только удобней:) и быстрее
2007-10-07
для чево нужен алъфа канал? толъко для того чтобы увидетъ где светлые а где темные участки техтуры или его можно какнибутъ исползоватъ?
2007-10-07
Альфа канал нужен, чтобы точно указать программе, какие именно участки и насколько Вы хотели бы осветлить. Проще всего и точнее всего получить эту информацию прямо из обрабатываемого изображения. Для бесшовной текстуры, рассчитанной на тайлинг это очень важно. Такие текстуры нужно уметь делать быстро, аккуратно и в большом количестве 🙂
2007-10-07
[b]kinyz[/b][quote]на скоко я помню, в шопе начиная с 7 вроде, есть команда настройки тональности что ли, вобщем того же что было сделано с помощью 2-х слоёв, только удобней:) и быстрее[/quote]
Ты прав, сам недавно узнал об этом способе. В Photoshop, оказывается, уже давно все есть ). Фильтр High Pass позволяет «выравнивать» такие текстуры.
Подробности смотрите здесь: [url]http://www.compuart.ru/article.aspx?id=8656&iid=355[/url]
Таким образом выравнивание текстуры сводится к следующему.
1 Копируем слой
2 К копии применяем фильтр High Pass и подбираем радиус воздействия (для этого примера подойдет 18пкс)
3 Ставим режим наложения Luminositi
2007-10-08
Спасибо. Урок кстати.
2007-10-09
Продолжайте. ..хочу больше.
2007-10-09
Супер! Жека — ты мне очень помог данным уроком. Это моя первая текстура, сделанная таким образом. Мне вот ещё интересно как с другими типами материалов работать?
2007-10-11
Хороший урок! Особенно лично мне было интересно узнать, как делается цветокорректировка. То что в самом уроке описан один из методов, а в комментах еще, то урок очень полезен. Респект и спасибо!
2007-10-11
Всем спасибо за отзывы! Первый урок, чертовски прятно )
[b]ksi2[/b]
[quote]Мне вот ещё интересно как с другими типами материалов работать?[/quote]
Если текстура сходящаяся, то все так же… Не важно, доски это, песок или может быть трава.
[b]TAURUS_x[/b]
[quote]Особенно лично мне было интересно узнать, как делается цветокорректировка.[/quote]Да, если первая часть совсем про простые вещи, то вторая надеюсь, будет полезна и более опытным. Про фильтр High Pass, вообще мало где говорится. Впрочем, как и про Offset. Ведь традиционно про Photoshop пишут, как обрабатывать фотографии, делать коллажи, и арт, ну может еще как сайты рисовать )).
2007-10-15
Я бы еще рекомендовал автору статьи обратить внимание на пятнышки краски на кирпичах, они также подчеркивают регулярность и цветокоррекцией их не выправить моя оценка 5 с минусом 🙂
2007-10-15
Ну вот, а я уж расстроился, что уроку ставят низкую оценку не объясняя за что… Но нашелся таки честный человек и высказал все как есть. Спасибо за конструктивную критику! Пятнышки краски это да… пятнышки краски это я недоглядел…
2007-10-21
Автор молодец, очень полезный и качественный урок, я как начинающий (пройдено немного больше половины первой (базовой) части курса 3ds Max в Sela University, Israel) почерпнул много полезного из второй части урока. Я на данный момент как раз занимаюсь проектом средневекового замка (надеюсь в итоге сделать 2-ух минутную анимацию, но до этого еще далеко), и там естественно использовал много текстур типа той что в твоем уроке, швы я убрал без особых проблем, а вот с неоднородными яркостью и цветами пришлось повозиться, частично решить проблему удалось, но результат не радует. Теперь понимаю на сколько неправильно я решал эту проблему, буде исправляти\переделывать. Про Хай-Пасс фильтр тоже обязательно почитаю в книгах\мануалах. Как закончу с исправлениями, сделаю тестовый рендер с мягким однородным освещением и попрошу тебя и помошников в составлении урока критически оценить текстуру стен и башен замка, если не сложно. Еще раз спасибо за урок.
2007-10-23
2я часть — очень облегчит жизнь. Спасибо.
2007-10-24
Спасибо за отзывы.
Вот значит как, вторая часть урока оказалась более интересной! А я то хотел написать урок для начинающих… ))
Может, тогда подскажите тему для следующего урока, только, чур, что бы касалась текстурирования и Photoshop`a …
2007-11-01
Отличнй урок! Спасибо он мне пригодился
2007-11-14
Урок супер, как для начинающего все очень доступно изложено!
2007-11-30
Уххх… спасибо. В кассу!!! спасибо. вторая часть рулит! то что доктор прописал.
2008-06-21
Очень полезно)). …Спасибки автору)
2008-09-07
урок отличный. но можно сделать чуть быстрее. изображение переводим в лаб и применяем хай-пасс к каналу яркости.
2008-11-22
[quote=Shurshun]
Отличнй урок! Спасибо он мне пригодился
[/quote]
[quote=Shurro4ka]
Урок супер, как для начинающего все очень доступно изложено!
[/quote]
[quote=KATEHOKA]
Очень полезно))….Спасибки автору)
[/quote]
Спасибо за положительные отзывы! Урок был значительно переработан во второй части, редакция рендер.ру внесла мои правки. На данный момент, я думаю, это самый простой и эффективный способ создания тайлящихся текстур.
[quote=loover]
урок отличный. но можно сделать чуть быстрее. изображение переводим в лаб и применяем хай-пасс к каналу яркости.
[/quote]
Вы правы! Так получается еще проще! Я к сожалению так и не научился пользоваться цветовым пространством LAB на практике, хотя Маргулиса и читал )). Единственное, что отмечу в защиту моего метода — Корректировочный слой, всегда позволяет вернутся к исходнику, а так же в любой момент изменить силу воздействия — просто уменьшая Opacity этого слоя.
Но ваше замечание очень интересное. Предлагаю всем читателям попробовать это метод. LAB это сила )
2009-05-06
спасибо, очень помог.
2009-08-23
гуд лессон… простой и полезный
2010-04-29
Просто и ясно, огромное спасибо!!!!
БЕСПЛАТНО 21+ дизайн текстуры меловой доски в PSD
Текстуры меловой доски пользуются большим спросом среди дизайнеров, поскольку они помогают им добавить интересный элемент в свой шедевр. Эти текстуры Photoshop имеют простые в редактировании функции и множество других интересных функций, что делает их очень предпочтительными текстурами, поскольку их можно изменять в соответствии со спецификациями проекта. Взгляните на эту элитную коллекцию удивительных текстур меловой доски, которые могут вам очень помочь в процессе разработки ваших новых проектов! Вы также можете увидеть Текстуры шума .
Текстура декоративной рамки для классной доски
Вот простая и простая текстура рамки для меловой доски, которую можно использовать для стильной демонстрации информативного контента аудитории. На нем изображена чистая и аккуратная классная доска с декоративной рамкой. Загрузите эти интригующие узоры прямо сейчас, просто нажав на ссылку, указанную ниже! Вы также можете проверить Текстуры ручной работы .
Загрузить
Причудливый дизайн текстуры классной доски
Вам надоело использовать одну и ту же старую текстуру классной доски? Что ж, тогда эта причудливая текстура школьной доски — все, что вам нужно. Эта привлекательная текстура ручной работы сделает вашу работу более привлекательной и интересной. Он имеет элегантную компоновку и цветовой оттенок, который может повысить ценность вашего дизайна. Вы также можете увидеть Бесшовные текстуры .
Скачать
Качественная текстура меловой доски
Это качественная текстура меловой доски, подходящая как для личного, так и для коммерческого использования. Он демонстрирует каждую деталь классной доски, которая имеет пыльный внешний вид. Он также идеально подходит для придания макету винтажного эффекта. Загрузите его сегодня, используя ссылку, указанную ниже!
Загрузить
Рождественская текстура меловой доски
Это набор рождественских текстур меловой доски, который поможет вам создать удивительные праздничные украшения. Все текстуры имеют приятный и яркий вид. Он содержит шесть текстур, которые вы также можете использовать в качестве узоров и фона. Это высококачественные текстуры, которые подчеркнут красоту ваших работ.
7 Векторные текстуры меловой доски
Это потрясающий набор векторных текстур меловой доски, которые также можно использовать для фона. Он содержит текстуры, которые масштабируются без потери качества. Он поставляется в 3 распространенных цветах классной доски, и вы можете использовать любой в зависимости от ваших требований. Немедленно загрузите его, используя ссылку ниже!
Набор текстур для черной классной доски
Это творчески разработанный набор текстур для черной классной доски с гладкой и гладкой доской. Он идеально подходит для проектов, требующих более темного фона. Используйте эту пустую черную доску, чтобы интересно объявить о специальном предложении и других рекламных материалах. Перейдите по ссылке, размещенной ниже, чтобы загрузить эту текстуру с высоким разрешением!
36 Текстура классной доски Photoshop
Вот захватывающий новый набор из 36 текстур классной доски Photoshop, которые очень подходят для фона, приглашений, поздравительных открыток, оберточной бумаги, узоров и т. д. Каждая текстура имеет высокое разрешение, чтобы дать зрителю лучший обзор поверхности классной доски. Он поставляется в 3 оттенках, которые вы можете использовать по своему выбору.
Бесшовная текстура меловой доски
Вот интригующий набор из 18 бесшовных текстур меловой доски, выполненных в стандартных цветах школьной доски, таких как черный, серый и зеленый. Это идеальный выбор для шаблонов и фонов, инфографики, веб-сайтов и других произведений искусства. Перейдите по ссылке ниже, чтобы загрузить мозаичную текстуру для вашего следующего проекта!
Фоновая текстура пыльной доски
Это креативно разработанная фоновая текстура пыльной классной доски, которая может быть полезна для создания необычных макетов. Это текстура с высоким разрешением, которая также подходит для анимации. Он состоит из векторных элементов дизайна, что делает его гибким в использовании. Он демонстрирует квадратную доску с отпечатанной на ней пыльной текстурой.
Черная текстура бумаги для меловой печати
Это профессионально разработанная черная текстура бумаги для меловой печати, которая при правильном использовании может дать потрясающие конечные результаты. Это набор из 3 текстур школьной доски, которые можно использовать в качестве фона и узоров. На ней четко видна доска с остатками мела. Загрузите его сегодня, просто перейдя по ссылке, указанной ниже!
Текстура цифровой бумаги для классной доски
Пакет текстур для пустой классной доски
Текстура векторного мела
Текстура меловой доски высокого разрешения 0006 Классная классная доска Зеленая текстура
Скачать
Разноцветный Меловая пастельная текстура
Скачать
Текстура меловой доски с флажками для рисования
Скачать
Царапанная грубая текстура меловой доски
Скачать
Грязная текстура мела бесплатно
Скачать
Текстура мела на классной доске
Что ж, если вас впечатлили эти привлекательные текстуры меловой доски, убедитесь, что вы храните их в своей графической библиотеке. Благодаря этим качественным текстурам дизайнеры могут легко добавлять в свои проекты гранжевый эффект. В большинстве этих текстур классной доски достаточно места для отображения информативного контента в презентабельном виде!
Создание фона для меловой доски в Photoshop (6 простых шагов)
Дайте угадаю, вы, наверное, уже давно ищете, но все еще не можете найти идеальный фон для меловой доски, потому что бесплатные фоны имеют низкое разрешение или освещение просто неподходящее?
Да, это было моей проблемой, когда я впервые начал заниматься графическим дизайном много лет назад. Поиск бесплатных стоковых изображений, пожалуй, один из самых трудоемких процессов в моей работе, поэтому я начал самостоятельно создавать все, что лучше всего вписывалось бы в мой дизайн.
В этом уроке вы узнаете, как создать реалистичный фон для меловой доски с нуля за 6 простых шагов.
Погружаемся!
6 простых шагов для создания фона меловой доски в Photoshop
Примечание. Скриншоты взяты из версии Adobe Photoshop CC для Mac. Windows или другие версии могут выглядеть немного иначе.
Шаг 1: Создайте новый документ в Photoshop. Я рекомендую установить размер в пикселях, например, я собираюсь установить размер холста 600 x 800 пикселей.
Шаг 2: Выберите средне-серый цвет в качестве цвета переднего плана и черный в качестве цвета фона.
Мой передний план #7a7a7a и фон #000000.
Шаг 3: Перейти в верхнее меню Фильтр > Рендеринг > Облака .
Создает пеструю основу для меловой доски.
Шаг 4: Снова перейдите в верхнее меню, чтобы добавить шум: Фильтр > Шум > Добавить шум . Установите шум Сумма на 20%, Распределение проверка Униформа и отметьте Монохроматический внизу.
Шаг 5: Перейти в верхнее меню Фильтр > Размытие > Размытие по Гауссу .
Установите Радиус примерно на 9 пикселей. Установите флажок Preview , чтобы увидеть, как это выглядит.
Шаг 6: Используйте инструмент Burn Tool , чтобы сделать фон более естественным и реалистичным. Этот шаг может потребовать от вас некоторого времени и терпения, но вы делаете свой дизайн уникальным.
Советы. Используйте большую мягкую кисть и установите кисть на более низкую экспозицию, чтобы вносить изменения постепенно.
Если вы хотите больше светлых областей, переключитесь на Dodge Tool и прокрасьте области, которые вы хотите осветлить.
Я очень доволен этим результатом, что вы думаете?
Теперь вы научились создавать фон для меловой доски. Теперь пришло время добавить текст, чтобы посмотреть, как это выглядит!
Не знаете, какие шрифты для классной доски использовать? Может быть, у меня есть для вас идеи.