Простые лощеные кнопочки » Уроки Photoshop CS2 :: Уроки фотошопа :: Уроки adobe photoshop :: Регулярные пополнения базы уроков

Важно! Создание прибыльных веб сайтов и поисковое продвижение сайтов в Москве: веб-компания StudioForYou!

Простые лощеные кнопочки

04.04.2008Категория урока: Кнопки и Иконки

Симпатичные кнопки для Вашего сайта

Простые лощеные кнопочки

Приблизительное время выполнения: 5 минут

Создайте новый документ 400х100рх

Инструментом Rounded Rectangle Shape нарисуйте на новом слое скругленный прямоугольник и залейте его градиентом от #6c7c84 к #5a676d

simple-glossy-buttons-2.gif

Примените к слою стили:

simple-glossy-buttons-3.gif

simple-glossy-buttons-4.gif

simple-glossy-buttons-5.gif

simple-glossy-buttons-6.gif

simple-glossy-buttons-7.gif

Создайте новый слой, выделите содержимое слоя с формой, CTRL-кликнув по его иконке в палитре слоев. Залейте выделение градиентом от белого к прозрачному сверху вниз

simple-glossy-buttons-8.gif

Отрежьте нижнюю половину градиента

simple-glossy-buttons-9.gif

Смените режим смешивания для этого слоя на Soft Light и понизьте его непрозрачность до, примерно, 25-40%

simple-glossy-buttons-10.gif

Создайте новый слой, снова выделите содержимое первого слоя (CTRL-клик). Далее Select>Modify>Contract 1px и заполните выделение белым цветом. Потом снова Select>Modify>Contract 1px и нажимаем DELETE.

simple-glossy-buttons-11.gif

Ластиком с большой мягкой кистью сотрите нижнюю часть только что созданного белого обрамления. Смените режим смешивания для этого слоя на Overlay или Soft Light и понизьте его непрозрачность до 80-100% по необходимости.

simple-glossy-buttons-12.gif

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

simple-glossy-buttons-13.gif

Добавьте текст

Простые лощеные кнопочки

Готово! ;)

Источник: http://www.photoshopstar.com/web-graphics/glossy-navigation-buttons/

Популярность: 11%

+news2.ru +ВааУ.ru +newsland.ru +СМИ2.ru +del.icio.us +bobrdobr.ru +memori.ru +RUmarkz +Mister Wong +Мое Место

Похожие уроки photoshop:


ВНИМАНИЕ! Столкнулись с трудностями при выполнении данного урока? Осталось что-то, что Вам непонятно? Забыли основы работы в Adobe Photoshop? Не расстраивайтесь! Решение всех Ваших проблем находится прямо здесь: "Начальный Курс Photoshop!" - Это Бесплатный Мультимедиа-Курс от Авторов Данного Сайта, пройдя который Вы сможете назвать себя мастером качественной работы в известнейшем графическом редакторе! Узнать о курсе подробнее, а также подписаться на него можно, перейдя на страницу курса: Начальный Курс Photoshop! Подпишитесь и пусть все завидуют тому, как легко и быстро Вы создаете шедевры в Adobe Photoshop! Ждем Вас!




2 комментария(-ев) к уроку “Простые лощеные кнопочки”

  1. симпотичная идея кнопочки :smile:

    Аниматор

  2. :wink: Хороший урок, спасибо Вам большое. Давайте больше уроков.

    Snacke

Прокомментировать урок

 


Rambler's Top100