Главная | Регистрация | Вход | RSSСреда, 18.06.2025, 14:09

PhotoShopWorld

Форма входа
PhotoShopWorld
Уроки Фотошоп
Фотошоп дополнения
Учебник Фотошоп
Фотошоп Ещё...
Категории раздела
Эффекты [243]
Работа с текстом [188]
Работа с фото [444]
Графика для сайта [96]
Дизайн/Рисование [389]
Анимация [43]
Практика [53]
Работа с планшетом [33]
Кисти [22]
Фильтры / Плагины [17]
Рамки [1]
Текстуры (фоны) [11]
Экшены [0]
Стили [0]
Градиенты [7]
Шрифты [0]
Фигуры [2]
Шаблоны для фото [0]
Иконки [0]
PSD исходники [0]
Основы работы [65]
Установка дополнений [7]
Описание инструментов [32]
Фотошоп Ещё... [0]
Фотошоп
Орфография
Система Orphus
Статистика

Онлайн всего: 2
Гостей: 2
Пользователей: 0

Мир Фотошопа

Главная » Файлы » Графика для сайта

Замаскированная навигация
18.03.2011, 14:36

В этом Фотошоп уроке будем создавать вот такую замаскированную навигацию.

Шаг 1.

Откройте новый документ 460x190 пикселей, с черным фоном. Сделайте овальное выделение с помощью инструмента , создайте новый слой и заполните выделение серым цветом (C1C1C1).

Перейдите в меню Выделение - Растушевка (select > feather), установите параметр 2 пикселя.
Снова меню выделение - модификация - сжать (Select > Modify > Contract) установите параметр 5 пикс.
Заполните выделение белым цветом.

a) б)

Шаг 2.

Выберите инструмент , установите радиус скругления 30 и нарисуйте фигуру как на рисунке (цвет для фигуры - E5E5E5)

a) б)

Шаг 3.

Примените стиль "Внутренняя тень" к слою с новой фигурой.

Слейте два слоя вместе.

Шаг 4.

Дублируйте слой с кнопкой несколько раз, а потом слейте все кнопки в один слой Ctrl + E.
Снова дублируйте слой уже с рядом кнопок.


Шаг 5.

Примените к верхнему слою кнопок стиль "Наложение текстуры/Перекрытие узора". Кликните по стрелочке и выберите набор "Природные узоры". Найдите там узор "Листья плюща".

и


Шаг 6.

После применения стиля кнопки станут выглядеть вот так:


Шаг 7.

Измените режим наложения верхнему слою на "Multiply" (Умножение), и уменьшите непрозрачность до 75%.

Шаг 8.

Возьмите инструмент , из открывающегося списка выберите фигуру кленового листа. Нарисуйте один листик белого цвета под слоями с кнопками.


Шаг 9.

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

Шаг 10.

Дублируйте слой с листьями, отразите его по вертикали (edit > transform > flip vertical/ редактирование - трансформация - отразить по вертикали).
Теперь объедините два слоя с листьями в один.

Шаг 11.

Примените слою с листьями тот же стиль.

и

Шаг 12.

Вот что у вас должно получиться:

Шаг 13.

Уменьшите непрозрачность слоя с листьями до 75%

Шаг 14.

Напишите на кнопках текст белым цветом. Настройки:

Тексту примените стиль "Тень":

Результат:


Шаг 15.

Измените режим наложения текстовому слою на Overlay (Перекрытие) и уменьшите прозрачность на 80%

Шаг 16.

Зажмите Ctrl и кликните по слою с текстом - появится выделение.
Перейдите в меню Выделение - Модификация - Расширить (select > modify > expand). Установите 1 пиксель.

Создайте новый слой под текстовым и заполните его темно-зеленым (585E3C).

Шаг 17.

Уменьшите прозрачность темно-зеленого слоя до 60%

ГОТОВО!

До встречи на www.photoshopworld.at.ua!

Категория: Графика для сайта | Добавил: Photoshop-master
Просмотров: 365 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Поиск
Фотошоп-Мастер
Фотоэффекты онлайн
Фотошоп с нуля!
Фотошоп уроки!
Photoshop
RSS лента

Кликните по иконке, чтобы получать новые уроки по RSS каналу

Создать фоторамку
Опросы
Есть ли у вас проблемы с закачкой дополнений с сайта?
Всего ответов: 21
Друзья сайта
  • Официальный блог
  • Сообщество uCoz
  • FAQ по системе
  • Инструкции для uCoz

  • Copyright MyCorp © 2025
    Сделать бесплатный сайт с uCoz