Уникальные Видеоуроки по Photoshop.
Убедитесь Сами в их Эффективности!
(каждый месяц свежие уроки)

+ ПОДАРОК
(Ваше реальное имя,
желательно на русском языке)


Закрыть
 
Глянцевая кнопка
(41 голосов)
Автор\Перевод Вячеслав Пчелов   
06.08.2008
 
Шаг 1 Создание кнопки

  • Создайте новый документ с размерами 640х480 пикселей
  • Создайте новый слой
  • Выберите Rounded Rectangle Tool , нарисуйте прямоугольник размером 150х30 пикселей
  • Выберите Pen Tool , щелкните правой кнопкой мыши и выберите Make selection , теперь у вас есть прямоугольное выделение.
  • Залейте выделенную область таким цветом: #0452CA (или тем, который вам больше нравится)
  • Теперь у вас есть голубая кнопка


Шаг 2 Стиль слоя - тиснение

  • Нажмите правую кнопку мыши на слое и выберите Blending options
  • Выберите Bevel and Emboss , установите такие параметры:
    Size = 2
    Soften = 2
    Highlight mode Opacity = 50
    Shadow mode Opacity = 25
    Теперь нажмите ОК!


Шаг 3 Создание эффекта глянца

  • Создайте новый слой и выберите Rectangular Marquee Tool
  • Создайте выделение как показано на картинке
  • Выберите Gradient Tool , и цвет установите такой, чтобы с одной стороны был белый, а с второй белый и прозрачность установлена в 0.
  • Теперь начинайте заливать от верха выделения к его нижней части
  • После этого, нажмите Ctrl+D, чтобы снять выделение, немного подкорректируйте Opacity
  • Нажмите Ctrl+левая кнопка мыши на нижнем слое, чтобы сделать выделение, потом идите в SelectInverse и теперь нажмите на слое с глянцем и нажмите кнопку Del на клавиатуре.
  • Вот и все, ваша кнопка готова


Если вам понравился или не понравился этот фотошоп урок, в любом случае - можете оставить свой комментарий и проголосовать за него. Хотя, я надеюсь, что он вам понравился:)

Если вы нашли опечатку, можете уведомить меня об этом, выделите текст и нажмите Shift+Enter

 

Комментарии 

 
# YrZ 16.08.2008 15:01
спасибо за урок и спасибо за классный сайт)
Ответить | Ответить с цитатой | Цитировать
 
 
# Евгений Смольянинов 20.08.2008 11:56
Спасибо за урок!
Судя по подсказкам при наведении курсора, автор делает сайт не для самоублажения, а старается для нас-посетителей.
Админу респект и уважение!
httр://pоmоshnik.biz/
Ответить | Ответить с цитатой | Цитировать
 
 
# Ната 09.09.2008 14:00
Цитирую Евгений Смольянинов:
Спасибо за урок!
Судя по подсказкам при наведении курсора, автор делает сайт не для самоублажения, а старается для нас-посетителей.
Админу респект и уважение!
httр://pоmоshnik.biz/



Абсолютно соглсна, нигде еще не втсречала такой фишки, реально удобно!
Ответить | Ответить с цитатой | Цитировать
 
 
# Fiancee 25.10.2008 15:30
очень многое осталось непонятно...

"немного подкорректируйт е Opacity"- где это искать и как выполнять?

а ведь урок для начинающих... можно было и поподробнее!
Ответить | Ответить с цитатой | Цитировать
 
 
# Frame 22.11.2008 17:37
Распишите пожалуйста вот этот момент:
"Нажмите Ctrl+левая кнопка мыши на нижнем слое, чтобы сделать выделение, потом идите в Select ? Inverse и теперь нажмите на слое с глянцем и нажмите кнопку Del на клавиатуре."
Ответить | Ответить с цитатой | Цитировать
 
 
# Kettrin 26.11.2008 16:40
Так много уроков по произведению на свет подобных кнопок! Я их скоро с закрытыми глазами и с завязанной за спиной одной рукой буду делать!)))
Ответить | Ответить с цитатой | Цитировать
 
 
# victor 27.03.2009 18:54
реально беспантовый урок,тк я пользуюсь фотошопом кс4 11.0 на русском языке...
А вот Вячеслав делает норм все,по русски внятно,и запоминается быстро.
Ответить | Ответить с цитатой | Цитировать
 
 
# romati 08.04.2009 23:32
Сымый граммотный сайт из всех,что я видел. Респектище автору!!!
Ответить | Ответить с цитатой | Цитировать
 
 
# Дарья_M 22.05.2009 18:06
Не могу выбрать Inverse в Select
Ответить | Ответить с цитатой | Цитировать
 
 
# Hunt 11.06.2009 17:12
Спасибо! Быстро и просто) :roll:
Ответить | Ответить с цитатой | Цитировать
 
 
# Waterfall 18.11.2009 15:26
У меня ничего не получается! :cry:
На первом шаге не получается с Pen Tool, у меня фотошоп на русском, что такое Make selection?
Gradient Tool - это где?
Как уже говорили, непонятно, как и что делать с Opacity.
Цитата:
Нажмите Ctrl+левая кнопка мыши на нижнем слое, чтобы сделать выделение, потом идите в Select ? Inverse и теперь нажмите на слое с глянцем и нажмите кнопку Del на клавиатуре.

Нажимаю Del - ничего не происходит. Помогите пожалуйста! :sad:
Ответить | Ответить с цитатой | Цитировать
 
 
# йолик 18.11.2009 20:55
спасибо за урок!!! а сайт просто супер и переводчик терминов ну когда написано на скрине ж не переводит а тут есть и такой переводчик ;-) :lol:
Ответить | Ответить с цитатой | Цитировать
 
 
# Лаврентий 06.12.2009 11:24
Спасибо, нашел то, что искал - красивые кнопки для сайта, которые можно было бы легко сделать :)
Ответить | Ответить с цитатой | Цитировать
 
 
# A.Mahone 02.02.2010 12:28
У меня просьба к админу можно залить побольше уроков в раздел "Детали веб сайтов" :lol: ибо это очень актуально
P.S классная кнопка так и хочется нажать
Ответить | Ответить с цитатой | Цитировать
 
 
# Энди 14.01.2011 11:34
Спасибо за отличный сайт!!!
Ответить | Ответить с цитатой | Цитировать
 
 
# Дмитрий74 04.04.2011 17:18
Спасибо!
Ответить | Ответить с цитатой | Цитировать