Рубрика: Photoshop Уроки | Урок прочитали: 1028
 (голосов: 6)

Винтажный стиль для темы Wordpress

В этом уроке Вы узнаете, как создать винтажный дизайн для шаблона Wordpress в Фотошоп.

Увеличенное изображение можете посмотреть здесь.
Использованные материалы:

  1. Узор
  2. Лупа
  3. Стили слоя 

1. Фон

Создайте новый документ Photoshop 1152px * 700px,  Resolution (Разрешение) 72px/inch.
Заполните фоновый слой  цветом # bdae87.

Дублируйте фоновый слой и примените стиль слоя "background_pattern". Отрегулируйте Fill(Заливка) 0%. Примените параметр наложения Pattern Overlay(Наложение узора).

Создайте прямоугольник в новом слое размером 1152px * 187px. Переместите его в верхнюю часть слоя. Примените параметр наложения Gradient Overlay (Наложение градиента).

Дублируйте эту форму и примените параметр стиль слоя "background_pattern" так же, как  в предыдущем шаге.

Создайте новый слой, Fill(Заливка) 0%. Примените параметр наложения Color Overlay(Наложения цвета):

 Создайте выделение 1016px * 188px (Выберите Rectangular Marquee Tool (Прямоугольная область), Style(Стиль): Fixed size(Заданный размер), установите ширину и высоту). Заполните выделенную область радиальным градиентом  от светлого цвета к прозрачному.

Создайте новый слой и новую форму, используя Rounded Rectangle Tool (Прямоугольник со скругленными углами) Radius(Радиус) 12px.

Примените следующие настройки для созданного слоя.

Введите название блога с помощью шрифта Script MT Bold Regular.

Примените следующие параметры наложения слоя.

Примените шрифт Nueva Std Italic для подзаголовка.

Используйте следующие настройки для подзаголовка.

2. RSS иконка

Создайте новый слой и новую округлую форму 60px * 60px, цвет # beaf88, используя Rounded Rectangle Tool (Прямоугольник со скругленными углами) Radius(Радиус) 10px.

Примените стиль слоя "rss_pattern" к созданной форме. Следующие настройки, используемые в этом стиле:

Загрузите выделение (Ctrl + Enter) для слоя с RSS формой. Перейдите Select->Modify->Contract (Выделение->Модификаия->Сжать) 3px. Создайте новый слой. Заполните выделенную область любым цветом, установите Fill(Заливка) 0%.
Примените режим наложения Soft Light (Мягкий свет) и параметры наложения: Bevel and Emboss (Тиснение) и Stroke (Обводка)

Поместите RSS иконку на форму, примените параметр наложения Inner Shadow (Внутренняя
тень).

3. Верхняя линия

Создайте новый прямоугольник  1152px * 50px, цвет # beaf88.

Примените стиль слоя "top_line_pattern" к созданной форме или используйте следующие параметры наложения.

Создайте тонкую линию в 1px, используя Line Tool (Линия), длина 1152px. Примените стиль слоя "dots_line_style".

Дублируйте линию и переместите копию на самый верх.

Примените шрифт Chaparral Pro для названий страниц.

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

4. Поиск

Создайте область поиска 170px * 25px, используя Rounded Rectangle Tool (Прямоугольник со скругленными углами) Radius(Радиус) 12px. Примените следующие параметры наложения.

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

Чтобы сделать стекло прозрачным, вырежьте  область остекления и поместите на новый слой, примените Auto Contrast (Автоконтраст) и режим наложения Overlay (Перекрытие).

Настройте боковую панель. Поместите аватар, RSS иконку, напишите информацию о вас.

5.  Декоративный элемент для даты

Создайте  форму ремешка с помощью Pen Tool (Перо), ширина - 187px, высота - 42px. Используйте тот же цвет, что и для верхней линии и RSS формы.

Примените параметры наложения. Используйте такие же узоры и настройки, как для верхней линии и RSS формы

Загрузите выделение формы, Select->Modify->Contract(Выделение->Модификация->Сжать) 3px. Заполните его любым цветом в новом слое, установите Fill (Заливка) 0%. Примените параметр наложения Bevel and Emboss (Тиснение)

Дублируйте  созданный слой и примените стиль слоя "dots_pattern_style" к нему. Вы можете добавить небольшой эффект тени для «швов».

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

Нарисуйте маленькие круги, цвет # e9dbb6.

Примените параметры наложения Inner Shadow(Внутрення тень) и Stroke(Обводка).

Нарисуйте золотую застежку с помощью Pen Tool (Перо). Примените тиль слоя "gold_style" к ней.

Сделайте  небольшой закругленный прямоугольник для язычка и примените тот же золотой эффект.

Нарисуйте следующую форму для вмятины, цвет # e9dbb6.

Загрузите выделение вмятины и добавьте светлое пятно в выделенной области с помощью мягкой круглой кисти.

Нарисуйте темное размытое пятно ниже созданной формы, но выше элементов ремешка.

Продублируйте его и поместите копию слоя  чуть ниже.

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

Создайте небольшой значок пера, используя много небольших прямоугольников и Reflected Gradient (Зеркальный градиент)

В конце добавьте боковую панель и разделяющую линию.

           

Похожие файлы и публикации:

Винтажный стиль для темы Wordpress
В этом уроке Вы узнаете, как создать элегантный дизайн шаблона для блога на WordPress.
Винтажный стиль для темы Wordpress
Шаг 2. Создайте новый слой и назовите его “camera2”. Выделите содержимое слоя “camera1” (CTRL + клик по миниатюре слоя). Выполните команду “Select > Modify > Contract” (Выделение > Модификация > Сжать). Установите сжатие в 7 пикселей. Залейте выделение цветом.
Винтажный стиль для темы Wordpress
В этом уроке будем учиться создавать креативный дизайн для блога.
Винтажный стиль для темы Wordpress
Если вы хотите знать, как сделать выразительные обои, тогда почитайте этот Photoshop урок.
Винтажный стиль для темы Wordpress
Изображение - существенный элемент в наборе любого дизайнера. Независимо от того - простой Ваш проект или что-то эксклюзивное, хорошее изображение будет всегда кстати. В этом уроке продемонстрированы способы того, чтобы помочь Вам создать своё собственное глянцевое изображение.
Винтажный стиль для темы Wordpress
Этот урок по Фотошопу покажет вам, как сделать дизайн сайта или портфолио.
Винтажный стиль для темы Wordpress
В этом уроке я покажу Вам, как создать дизайн для приложения записной книжки.
Винтажный стиль для темы Wordpress
Этот урок покажет вам как создать красивый медиа плеер используя средства Adobe Photoshop CS3. Для ясности мы все вам покажем.
Винтажный стиль для темы Wordpress
Программа Photoshop – фантастическая программа, с помощью которой можно обрабатывать не только фотографии, но и создать реальные объекты. В сегодняшнем уроке, мы продемонстрируем, как создать изображение реалистичного ножа похожего на фотографию в программе Photoshop, используя векторные инструменты для рисования, стили слоя, текстуры, и эффекты.
Винтажный стиль для темы Wordpress
Что может быть лучше подарка, сделанного своими руками?!
Винтажный стиль для темы Wordpress
Финальный результат
Винтажный стиль для темы Wordpress
Этот урок посвящён тому, как с помощью Adobe Photoshop CS3 создать шаблон портфолио.
Винтажный стиль для темы Wordpress
Сегодня мы создадим симпатичную кнопку-переключатель, которую вы сможете использовать в своих работах. Для начала взглянем на финальное изображение.
Винтажный стиль для темы Wordpress
Используемые изображения: - Сердце - Капли - Капля - Брызги воды 1 - Брызги воды 2 - Боке
Винтажный стиль для темы Wordpress
Шаг 1. Создайте новый документ 102*50 пикселей. Фон залейте цветом  #838383. Выберите инструмент Rounded tool (Прямоугольник со скругленными краями). Установите следующие настройки:
Винтажный стиль для темы Wordpress
Сегодня мы поработаем над созданием интересного эффекта – лицо, распадающееся на кусочки.
Винтажный стиль для темы Wordpress
В этом уроке я покажу, как создать макет для бизнес-сайта.
Винтажный стиль для темы Wordpress
Сегодня мы будем учиться создавать одежду из воды.