Фотошоп для фотографа 2013

Рисуем макет сайта студии дизайна используя Фотошоп

| Категория: Уроки по созданию дизайна в Фотошопе | Сложность урока: Средняя

В данном уроке Фотошопа мы рассмотрим процесс создания макета сайта студии дизайна.


Финальный результат

Рисуем макет сайта студии дизайна используя Фотошоп

Приступаем к уроку Фотошопа


Шаг 1.


Создайте новый документ размером 760x770 px (File > New (Файл > Новый / Сочетание клавиш "Ctrl+N")). Откройте новое изображение «стены» для вашего фона. ↓


Рисуем макет сайта студии дизайна используя Фотошоп

Шаг 2.


Создайте новый слой (New Layer (Новый слой / Сочетание клавиш "Ctrl+Shift+N")). Используйте Rectangle Tool Инструмент - Прямоугольник (Инструмент "Прямоугольник" / Клавиша "U" ) и сделайте форму точно как на рисунке, используя цвет #423e37.


Рисуем макет сайта студии дизайна используя Фотошоп

Рисуем макет сайта студии дизайна используя Фотошоп

Выберите получившуюся форму и идите Edit > Transform > Warp (Правка > Трансформация > Деформация), и выберите там Arc Lower (Параметр в верхнем меню: Дугой снизу) и премините значения как на изображениях ниже. ↓


Рисуем макет сайта студии дизайна используя Фотошоп

Рисуем макет сайта студии дизайна используя Фотошоп

Рисуем макет сайта студии дизайна используя Фотошоп

Шаг 3.


Теперь для получившейся формы применим Blending Options (Параметры наложения) для слоя, такие как на рисунках ниже: ↓


Рисуем макет сайта студии дизайна используя Фотошоп

Drop Shadow (Тень): ↓

Рисуем макет сайта студии дизайна используя Фотошоп

Satin (Глянец): ↓

Рисуем макет сайта студии дизайна используя Фотошоп

Gradient Overlay (Наложение градиента): ↓

Рисуем макет сайта студии дизайна используя Фотошоп

Шаг 4.


Выбираем Rectangle Tool Инструмент - Прямоугольник (Инструмент "Прямоугольник" / Клавиша "U" ) и создаем точно такую же форму как на рисунке ниже: ↓


Рисуем макет сайта студии дизайна используя Фотошоп

Шаг 5.


Идем в Blending Options (Параметры наложения) и устанавливаем следующие стили слоя: ↓


Drop Shadow (Тень): ↓

Рисуем макет сайта студии дизайна используя Фотошоп

Satin (Глянец): ↓

Рисуем макет сайта студии дизайна используя Фотошоп

Color Overlay (Наложение цвета): ↓

Рисуем макет сайта студии дизайна используя Фотошоп

Шаг 6.


Выбираем Line Tool Инструмент - Линия (Инструмент Линия / Клавиша "U") и рисуем несколько линий как на рисунке: ↓


Рисуем макет сайта студии дизайна используя Фотошоп

Шаг 7.


Создаем новый слой (New Layer (Новый слой / Сочетание клавиш "Ctrl+Shift+N")), затем открываем несколько изображений и переносим их на наш созданный слой. Далее изменим их размеры (например используя Free Transform (Свободное трансформирование / Сочетание клавиш "Ctrl + T" / Вызов через меню: "Edit > Free Transform" (Редактирование > Свободная трансформация))). ↓


Текущий результат: ↓


Рисуем макет сайта студии дизайна используя Фотошоп

Шаг 8.


Создайте новый слой (New Layer (Новый слой / Сочетание клавиш "Ctrl+Shift+N")). Найдите несколько кистей для Фотошопа в Интернете и загрузите их в Фотошоп. В моем результате я использовал кисти растений и облаков (инструмент Brush Tool Инструмент - Кисть (Инструмент Кисть / Клавиша "B")). ↓


Текущий результат: ↓


Рисуем макет сайта студии дизайна используя Фотошоп

Шаг 9.


Создайте новый слой. Разместите немного текста используя инструмент → Horizontal Type Tool Инструмент - Горизонтальный текст (Инструмент "Горизонтальный текст" / Клавиша "T").


Вот и все.


Финальный результат

Рисуем макет сайта студии дизайна используя Фотошоп

Урок подготовлен для Вас командой сайта PhotoshopPro.ru