Категории каталога
18+ [101] Жесть! [2]
БуГаГа [3] Прикольно [17]
Красяв0 [7] Спорт [1]
Музыка [67] Желез0 [0]
Игры [55] Крео от падонкаФФ [1]
ВАЖН0! [6] Звезды [0]
Красота & Здоровье [10] Любовь & Секс [14]
Уроки Photoshop'a [26]
Уроки Фотошопа - избранные, качественный и самые нужные.
Стиль & Мода [1]
Умора [1] КреотиФчиГ [3]
Наш опрос
Скоко тебе лет?
Всего ответов: 126
Главная » Статьи » Уроки Photoshop'a

Выглядит очень эффектно!

Выглядит очень эффектно!

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

Приблизительное время выполнения: 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

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

Готово! ;)

Категория: Уроки Photoshop'a | Добавил: SuSliK (26.04.2008)
Просмотров: 629 | Рейтинг: 0.0/0 |
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Пятница, 17.05.2024, 07:49
Приветствую Вас Прохожий(ая) по сайту =)
Форма входа
Поиск
Друзья сайта
Статистика

ОнлАйн всег0: 1
Гостей: 1
ПоЛь3оВаТеЛей: 0
 (Рейтинг: 0.0/0)