Линейный дизайн - Уроки Photoshop

Уроки Photoshop на Тальнівському Інформаційному Порталі

Очень легкий и красочный элемент оформления фоновой графики веб-страниц и стилистического оформления изображений (обычно используется для создания эффекта растровых строк). При его помощи можно достичь превосходных результатов. Сегодня мы воплотим несколько вариантов линий при помощи Photoshop.

Итак, приступим:

1. Для простоты дальнейшего использования сделаем заготовки наших будущих линий и преобразуем их в паттерны: создаем новое изображение (Ctrl+N). Размер изображения - 1х2 пикселя, 300 dpi. Режим цвета - RGB Color. Цвет фона – прозрачный.

2. Для удобства сделайте максимальное увеличение (1600%), иначе фиг чего увидите :)

3. Сбрасываем цвет в дефолт (D). Выбираем инструмент Pencil Tool (B) и ставим его размеры 1px, а Hardness - 100%:

4. Закрашиваем нижний квадратик размером 1х1px черным цветом, а верхний оставляем без изменений, т.е. прозрачным:

5. Теперь из этого изображения сделаем паттерн, выбрав из меню Edit - Define Pattern. Назовем его – web_lines. Наш паттерн с горизонтальной линией готов.

6. Аналогично делаем паттерн и с диагональной линией. Различие только в размере изображения (6x6px) и в расположении точек:

Итак, у нас уже есть два типа паттернов. Что можно с ними сделать? Очень многое:

7. Открываем изображение, к которому вы хотите применить только что созданный эффект. Создаем новый слой (Ctrl+Shift+N) и выбираем из меню Edit – Fill с параметрами Use: Pattern, где в качестве паттерна будет наш web_lines. Жмем Ok:

Что-то не очень, правда? Но стоит только уменьшить прозрачность слоя с линиями до 25%, а еще лучше изменить Blend Mode на Overlay, как ситуация резко улучшается!

А еще можно ластиком стереть некоторые участки слоя с линиями и немного пофантазировать - Web-design by Taurus, однако :)

Наслаждаемся проделанной работой. До новых встреч!

Автор: Leonid Khlivnyuk
21.04.2007 - http://talne-info.com

Редагував та розмістив – Хлівнюк Леонід © talne-info.com | 16.06.2008