Tags: Графика для сайта | Уроки Photoshop | уроки web дизайна | уроки веб дизайна

В этом уроке мы создадим кнопку для сайта. Данный урок небольшой по обьему, так как он не является особо сложным. К концу урока вы научитесь создавать глянцевые кнопки  в несколько шагов.

Создайте новый документ размером 300*300 пикселей.

Залейте содержимое области темно-серым цветом. При помощи инструмента Прямоугольник со скругленными углами создайте форму черного цвета.

При помощи инструмента Перо создайте выделение белого цвета, подобное тому, что вы видите на картинке ниже. Данное выделение в дальнейшем будет служить нам как блик на глянце.

Далее уберите все ненужные области белой фигуры , оставив только необходимую область на кнопке. Уменьшите непрозрачность этого слоя до 10-20 %.

Далее при помощи инструмента Карандаш толщиной в 1 пиксель создайте полоски подобно тому, как показано на рисунке. Для того чтобы линии получились достаточно ровными зажмите клавишу Shift.

Далее при помощи мягкого ластика уберите слегка ненужные области. Добейтесь такого результата как на картинке.

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

Для того чтобы немного проэкспериментировать необходимо лишь заменить нашу нижнюю белую полосу на кнопке на любую другую , которая больше подойдет к вашему сайту. Вот какие кнопки получились у меня:

Данные методы лучше будет сделать для разделения активной кнопки  от неактивной.