Создаем глянцевую кнопку
Всем привет, в этом году лето жаркое просто копец. Уже +35 градусов и думаю это только начало, что же будет дальше в июле?. В такую жару лень, что-то делать вообще, но я все таки нашел в себе силы написать урок. В такую жару мечтаю о кондиционере. Этот урок очень простой, а результат и принцип может пригодится во многих случаях. Особенно в веб-дизайне для оформления навигации. В уроке будем делать глянцевую объемную кнопку как в виндовс 7 в меню пуск.

1. Создаем документ в фотошопе произвольного размера. Фон взял как и в семерке #1f4258 примерно он.
2. Создайте прямоугольник
с округлёнными углами с радиусом в 2 px
. Сразу продублируйте прямоугольник, вам пригодится дубликат. Вот примерно как на примере. (Чтобы быстро создать дубликат удерживайте Alt и кликом мыши перетащите прямоугольник.)

3. Прямоугольнику я применил цвет немного темнее #1c3c4f. Теперь применяем черную обводку в 1 px. Дубликат прямоугольника не трогаем.
4. Применяем свечение Outer Glow в свойствах слоя.

5. Теперь время нашего дубликата. Применяем дубликату градиент от #192e3c до #405a6a.

6. Далее применяем внутреннюю обводку белого цвета в 1 px с прозрачностью 50%.
Переносим слой с градиентом на наш готовый нижний слой прямоугольника.

7. Почти готово, осталось добавить блик. Для этого создайте дубликат слою с градиентом. Примените ему такой градиент
9. Правой кнопкой мыши по слою преобразовываем слой с последним градиентом в Convert to Smart Object. Затем выделяем половину слоя прямоугольным выделением, и удаляем.

10. Применяем слою прозрачность Оpacity 40%. Вот и все блик готов теперь переносим его на нашу кнопку.


Все готово можно объединить слои все кроме блика. И осветлить инструментом
Dodge tool в режиме осветления Highlights
в центре кнопки.
Все финальный результат.


Следи за мной




