Зарабатываю на smmka.ru
Главная » Статьи » Уроки Фотошоп » Графика для сайта

Рисуем красивую навигацию на сайт


Рисуем красивую навигацию на сайт


Приблизительное время выполнения: 10 минут



Создайте новый файл:


sleek-blue-nav_2.jpg


Залейте фон градиентом от #10365a к #2070bf


sleek-blue-nav_3.jpg


sleek-blue-nav_4.jpg


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


sleek-blue-nav_5.jpg


Смените режим смешивания для этого слоя на Soft Light и параметр Fill подведите до 25%


sleek-blue-nav_6.jpg


Создайте новый слой и выделите инструментом Rectangular Marquee
полоску в один пиксель. После этого залейте полоску градиентом тех же
цветов, только в обратном направлении. Мы нарисовали разделитель для
ссылок


sleek-blue-nav_7.jpg


Смените режим смешивания для его слоя на Soft Light


sleek-blue-nav_8.jpg


Скопируйте слой столько раз, сколько Вам нужно разделителей


sleek-blue-nav_9.jpg


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


sleek-blue-nav_10.jpg


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


sleek-blue-nav_11.jpg


И третий


sleek-blue-nav_12.jpg


И четвертый


sleek-blue-nav_13.jpg


Создайте новый слой, выделите прямоугольную область внизу нашего хедера и залейте ее цветом, подходящим к фону (я выбрал #03346c)


sleek-blue-nav_14.jpg


Создайте новый слой и выберите инструмент Pencil. В качестве цвета выберите светлый подходящий к другим цвет (я выбрал #7dbfff). Нарисуйте линию высотой в один пиксель поверх только что созданного прямоугольника.


sleek-blue-nav_15.jpg


Скопируйте этот слой и переместите копию наверх, прямо сверху цветных прямоугольничков


sleek-blue-nav_16.jpg


Напишите слева свой текст


sleek-blue-nav_17.jpg


По желанию добавьте еще текста


sleek-blue-nav_18.jpg


Теперь снабдите текстом навигационные кнопки


sleek-blue-nav_19.jpg


Осталось только добавить сопроводительных картинок к кнопкам


sleek-blue-nav_20.jpg


sleek-blue-nav_21.jpg


Рисуем красивую навигацию на сайт

Категория: Графика для сайта | Добавил: dEnny (05.03.2010)
Просмотров: 634 | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Дизайн сайтов и шаблоны для Ucoz