Купить этот сайт

Уроки » Веб-дизайн → Кнопка «GO»  

Создайте новый документ с размерами 300x155px, цвет фона: #2AB9E2. Двойным щелчком по фоновому слою, разблокируйте его. Загрузите образец отсюда bluescanline_pstr.rar [244 b] (cкачиваний: 2) и откройте его в Photoshop.

Кнопка «GO»


Примените следующие стили слоя.

Кнопка «GO»

Кнопка «GO»

Кнопка «GO»


Выберите инструмент Rounded Rectangle Tool с радиусом: 10px и цветом: #1684A4 и нарисуйте форму как показано ниже. Переименуйте слой в «Button».

Кнопка «GO»


Примените к слою «Button» следующие стили слоя.


Кнопка «GO»


Выберите инструмент Horizontal Type Tool

Кнопка «GO»


Напечатайте ваш текст

Кнопка «GO»


Снова выберите Rounded Rectangle Tool с радиусом: 10px и белым цветом. Нарисуйте еще одну, такую же форму. Переименуйте слой в «Gloss» и растерезуйте его.

Кнопка «GO»


Выберите инструмент Elliptical Marquee Tool и создайте выделение как показано ниже.

Убедитесь, что вы находитесь на слое «Gloss» и нажмите CTRL+SHIFT+I, чтобы инвертировать выделение, а затем Delete, чтобы удалить лишнее.

Кнопка «GO»


Примените к слою «Gloss» следующие стили слоя.

Кнопка «GO»

Кнопка «GO»

Кнопка «GO»


Продублируйте слой «Button» и очистите его от стилей слоя (щелкните правой кнопкой мыши по слою и выберите Clear Layer Style), измените цвет на #116F86, расположите этот слой ниже слоя "Button"

Используя стрелки клавиатуры, опустите этот слой вниз на 4px. Переименуйте слой в «Button Front»

Кнопка «GO»


Примените к слою «Button Front» следующие стили слоя.

Кнопка «GO»




Кнопка «GO»

Информация к уроку:

Категория - Уроки » Веб-дизайн

Дата публикации: 12-07-2012, 06:43

Опубликовал: killot

Просмотров: 595

Комментариев: 0

Ссылки к этой статье:

Источник - Empire Dezign

Автор - Не указан

Переводчик - Killot

Найти - Все уроки с Empire Dezign

Еще по этой теме:

Кнопка с водой Кнопка с водой
В этом уроке создадим прикольную кнопку, с ...
Красная гелевая кнопка Красная гелевая кнопка
Сегодня снова будем делать кнопку, но эта кнопка ...
Кнопка в стиле чужих Кнопка в стиле чужих
В этом уроке будем создавать кнопку в стиле ...
Меню "Синий металл"
В этом уроке создадим стильное меню для сайта ...
Кнопка для девочек Кнопка для девочек
В этом уроке создадим привлекательную розовую ...
Техническая кнопка Техническая кнопка
В этом уроке мы создадим техническую кнопку. ...
Кнопка закладок Кнопка закладок
В этом уроке создадим прикольную кнопку для ...
Кнопка «Mail» Кнопка «Mail»
В этом уроке создадим кнопку для отправки почты. ...
42 Photoshop Styles For Button 42 Photoshop Styles For Button
При создании этих стилей я вдохновлялся кнопками ...
Иконка папки Иконка папки
Надоели скучные папки Windows XP... нарисуй свои ...

Социальные закладки:


Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь. Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

 

Добавление комментария

 
 
Ваше Имя:
Ваш E-Mail:
Вопрос:
Ты робот? (да-нет)
Ответ:*
Код:
Включите эту картинку для отображения кода безопасности
обновить, если не виден код
Введите код: