Создайте вкладку Web 2.0 с помощью Photoshop
Приведенное ниже руководство попытается дать вам представление о том, как создать красивое гладкое меню с вкладками в Photoshop в стиле Web 2.0..
Шаг 1
Создайте новый холст с белым фоном [#ffffff] любого размера, предпочтительно прямоугольного сечения; они больше подходят для рисования вкладок. Затем переключитесь на Вкладка «Каналы» (Windows -> Каналы), нажмите Создать новый канал справа внизу.
Шаг 2
На выбранном канальном слое нарисуйте похожую форму с помощью инструмента Polygonal Lasso. Залейте его белым цветом [#ffffff]; отмените выбор полигональной области (выберите любой инструмент Marquee и нажмите один на экране); придать форму Gaussian Blur с радиусом 6.0px.
Шаг 3
CTRL-L чтобы вызвать диалог уровня и нажать стрелку влево и вправо, чтобы встретить центральную стрелку, как на картинке выше. Это будет “гладкий; плавный” Ваша размытая форма придаст вам округлую форму.
Шаг 4
На вкладке "Каналы", Удерживайте CTRL, нажмите на Миниатюра канала слоя Alpha 1. Теперь будет выбрана новая форма, переключитесь обратно на Вкладка "Слои", Создать новый слой и заполните выделенную область черным [# 000000].
Шаг 5
Уберите закругленные углы для нижнего левого бота и нижнего правого, переместите его влево и расположите, как показано выше. Далее мы сосредоточимся на вкладке черного цвета.
| Держать CTRL, нажмите на вкладку Миниатюра слоя чтобы выделить все изображение вкладки. | |
| С выделенным изображением вкладки выберите Инструмент прямоугольного выделения, держать ALT и нарисуйте прямоугольник области, которую мы хотим удалить. | |
| Вы должны увидеть только верхнюю часть, выбранную. Выбрать -> изменять -> контракт, Контракт на 2px и вы должны получить что-то вроде изображения слева. | |
| Создайте новый слой, залейте выделенную область белым [#ffffff]. Щелкните правой кнопкой мыши, выберите Параметры наложения затем Градиентное наложение. Замените остановку белого цвета [#ffffff] на серый [# 616161]. Ваша вкладка должна выглядеть как изображение слева. |
Шаг 6
Создать новый слой; Выбрать Прямоугольный закругленный инструмент (Радиус 8px), нарисуйте прямоугольник и поместите этот слой за черным слоем табуляции. Щелкните правой кнопкой мыши и выберите Параметры наложения и вставьте следующие настройки.
Drop Shadow
- Непрозрачность: 31%
- Расстояние: 0px
- Распространение: 0%
- Размер: 2 пикс.
Скос и тиснение
- Глубина: 100%
- Размер: 0px
- Смягчить: 0px
Градиентное наложение
- Вот настройки цветовых остановок.
- Цвет: #aaaaaa, Расположение: 0%
- Цвет: #ffffff, Расположение 100%
Шаг 7
Добавьте текст, чтобы увидеть общий вид web 2.0. Я использую шрифт Lucida Fax, размер шрифта 32pt и 25pt. И ваша вкладка готова! Не стесняйтесь играть с комбинацией цветов вкладки.
Скачать учебник
