Уроки по Photoshop, Illustrator, Flash и 3ds max. Статьи по дизайну и фотографии.

Шаблон для сайта в деловом стиле (Часть 2).

Шаг 24. Теперь выбираем подпункт Drop Shadow (Тень) и задаем:

Шаг 25. И наконец, добавлем обводку для акцентирования внимания. Для этого выбираем стиль Stroke (Обводка), используя параметры, как внизу.

Шаг 26. Сейчас выбираем инструмент Move Tool (Перемещение) на Панели инструментов. Щелкаем на этом инструменте и, удерживая Alt+Shift, передвигаем кнопку вправо. Как видим кнопка скопировалась на новый слой.

Шаг 27. Теперь, удерживая Alt+Shift, распределяем наши клавиши как на рисунке внизу.

Шаг 28. Выбираем Инструмент (Rectangular Marquee tool) Прямоугольное Выделение и выбираем для него тип Фиксированный (см. как на картинке). Это мы делаем доп.панель для акцентирования внимания на основном.

Шаг 29. Создаем новый корректирующий слой Solid Color (Сплошной цвет или просто Цвет), кликнув на кнопке New Adjustment Layer (Новый Корректирующий Слой), и выбираем Solid Color (Цвет). Выберите цвет который хотите использовать для этой панели.

solid color

Шаг 30. Перемещаем этот слой наверх и переименовываем его в "Accent Bar".

перемещаем слой

Шаг 31. Создадим еще один Регулирующий слой Solid Color (Цвет), но на сей раз без выделения. Цвет будет такой - #e5e5e5. Поместим его над слоем "Background" и переименуем его тоже в "Background".

регулирующий слой

Шаг 32. Как вы уже догадались, мы опять будем работь над бекграундом нашего сайта. И для этого сперва выбираем инструмент Gradient Tool (Градиентная Заливка).

gradient tool

Шаг 33. Теперь для выбранного инструмента на Панели свойств задаем следующие параметры:

Панель свойств

Шаг 34. Для начала активизируем маску слоя. И используя выбранный градиент заливаем ее, как показано на рисунке.

маска слоя

Шаг 35. У вас должен получиться такой же замечательный градиент на картинке внизу.

градиент

Шаг 36. Теперь инвертнем его, нажав Ctrl+I или выбрав на панели меню Image>Adjustment>Invert (Изображение>Коррекция>Инверсия).

инвертирование

Шаг 37. Вот и готов наш шаблон для сайта. Осталось добавить контент.

добавляем контент

Шаг 38. Для начала добавим логотип с помощью импортирования File>Place (Файл>Поместить). Теперь у вас есть еще один новый слой, на сей раз с логотипом. Помещаем этот слой на самый верх и переименовываем в "Logo". C помощью инструмента Move Tool (Перемещение), передвигаем логотип в левый верхний угол.

импортируем логотип

Шаг 39. Теперь обозначим пункты в ранее сделанном меню, естественно с помощью инструмента Text Tool (Текст).

Text tool

Шаг 40. Вбиваем названия пунктов меню на различных слоях и после этого объединяем их в Группу Слоев.

группировка

Шаг 41. Вот и готов наш шаблон для сайта. Осталось добавить контент.

готовый шаблон

Шаг 42. Переименовываем слои с текстом в соответствии с пунктами меню.

переименовываем слои

Шаг 43. Мы сделали это. Вот он наш шаблон.

Шаг 44. Теперь дополняем его другой информацией и можно отдавать кодеру.

кодируем

Урок переведен автором сайта и при цитировании его на русском языке ссылка на сайт обязательна. Автор www.photoshopbox.com. Оригинал статьи на английском

< | 1 | 2

Другие уроки по Photoshop >>