![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/ramka912.jpg)
Из этого урока дизайна вы узнаете, как создать интересный красочный макет для сайта.
Навыки для "прокачки":
- создание кисти- создание форм- работа со стилями слоя- работа с кистямиСоздадим новый документ размером: 270X270 пикселей и создадим простую форму с помощью инструмента
Элипс (Ellipse Tool)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/148.jpg)
Теперь добавим следующие
Cтили слоя (Add a layer style)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/224.jpg)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/315.jpg)
Вот что получилось.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/413.jpg)
Теперь перейдем
Редактирование-> Определить кисть (Edit-> Define Brush Preset)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/513.jpg)
Теперь введите имя для вашей кисти, и нажмите кнопку
ОК.
Далее активируем
Кисть (Brush) , и создадим несколько пятен, на макете.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/613.jpg)
Изменим
Режим смешивания слоя (Blend Mode) на
Жесткий свет (Hard Light), и снизим
Непрозрачность (Opacity) этого слоя до
65%![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/713.jpg)
Теперь перейдем
Окно-> Кисть (Windows-> Brushes) и настроим кисть как показано ниже.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/812.jpg)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/911.jpg)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/1011.jpg)
Затем создадим новый слой поверх всех слоев, и кистью, которую мы только что создали, будем рисовать на шапке сайта. Обратите внимание, что вам нужно, установить размер кисти 40-50.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/1115.jpg)
Теперь рисуем.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/1211.jpg)
Далее перейдем
Фильтр-> Размытие-> Размытие по Гауссу (Filter-> Blur-> Gaussian Blur) и поставим следующее значение.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/1310.jpg)
Теперь изменим
Режим смешивания слоя (Blend Mode) на
Мягкий свет (Soft Light), и установим
Непрозрачность (Opacity) на
50%![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/149.jpg)
Создадим новый слой (нажмите
CTRL + SHIFT + ALT + N), и измените,
Режим смешивания слоя (Blend Mode) на
Перекрытие (Overlay), и значение
Непрозрачность (Opacity) до 50%, а затем
Кистью (Brush Tool) нарисуем такие же круги.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/158.jpg)
Наша шапка готова. Теперь создадим несколько форм инструментом
Прямоугольник со скругленными углами (Rounded Rectangle Tool)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/168.jpg)
Для верхней панели навигации добавим следующие
Cтили слоя (Add a layer style)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/176.jpg)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/186.jpg)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/195.jpg)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/202.jpg)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/2110.jpg)
Вот как она должна выглядеть.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/225.jpg)
Для нижней формы снизим
Непрозрачность (Opacity) до
20%.
Теперь добавим текст на наш макет, инструментом
Горизонтальный текст (Horizontal Type Tool)
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/231.jpg)
Создадим новый слой, и инструментом
Карандаш (Pencil Tool) добавим некоторые элементы на панели навигации.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/241.jpg)
Теперь добавим несколько изображений на наш макет. Это наш окончательный результат.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/251.jpg)
Вот так выглядел бы макет, если бы мы сделали кисть треугольники.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/261.jpg)
Или так.
![Создаем удивительный красочный макет для сайта - уроки фотошоп Создаем удивительный красочный макет для сайта - уроки фотошоп](/uploads/2011/10/271.jpg)
На этом наш урок дизайна окончен. Всего вам доброго и творческих успехов!