Foto Design-Fototruki

Пятница, 10.05.2024, Приветствую Вас Гость
Главная | Регистрация | Вход

-

Главная » Статьи » Уроки Photoshop » Классные кнопки со стеклянным блеском.

            Классные кнопки со стеклянным блеском 
       

       

Этот урок научит Вас создавать классные кнопки с отблеском, как у стекла, которые Вы сможете использовать не только на своем сайте, но и на баннерах, печатных материалах и т.п.
                       
Создайте документ любого размера (я использовал размер 500х500 px). Используя инструмент Rounded Rectangle с радиусом в 8px, нарисуйте квадрат (зажав клавишу Shift). После этого откройте меню Blending Options для этого слоя и выберите пункт Gradient Overlay. Задайте два цвета, как на рисунке ниже и назовите этот слой "bg".       

       

 

            Классные кнопки со стеклянным блеском
       

       

Теперь копируйте этот слой и назовите копию "glass". Выберите его и переместите выше слоя "bg". Залейте его белым цветом и измените его прозрачность (Opacity) на, примерно, 50%. Используя инструмент Square Marquee (клавиша М) и создайте выделение примерно таким, как на рисунке ниже. Проверьте, выбран ли слой "glass” и нажмите клавишу Delete.       

       

            Классные кнопки со стеклянным блеском
       

       

Мы добились эффекта стеклянного блеска. Чтобы немного его смягчить, используйте инструмент Round Marquee. Создайте выделение, как на рисунке ниже. Далее выбирайте Select > Feather (Ctrl+Alt+D) и вводите значение в 30px. Нажимайте клавишу Delete.       

       

  

            Классные кнопки со стеклянным блеском
       

       

Зажав клавишу Ctrl, кликните по слою "bg", чтобы выделить его содержимое, и выбирайте Select > Modify > Expand. Вводите 1px и нажимайте ОК. Создавайте новый слой ПОД слоем "bg", заполняйте выделение белым цветом и называйте слой "shine".       

       

  

            Классные кнопки со стеклянным блеском
       

       

После этого шага Вы не заметите изменений из-за белого фона. Чтобы все было нагляднее, создайте еще один слой ПОД слоем "shine” и нарисуйте на нем черный прямоугольник. Вы увидите, чего мы добились. Назовите этот слой "black-bg".       

       

    

            cool_glassy_icon_06.png 
       

       

Теперь выбираем инструмент Round Marquee и создаем выделение, как на рисунке ниже. Затем отправляемся в меню Select > Feather (Ctrl+Alt+D) и вводим 30px. Выбираем слой "shine” (не снимая выделения) и дважды нажимаем клавишу Delete.       

       

      

            cool_glassy_icon_07.png 
       

       

Повторяем действие с верхней частью рисунка, но нажимаем Delete уже только один раз.       

       

       

            cool_glassy_icon_08.png
       

       

Теперь, если хотите, можете настроить прозрачность (Opacity) слоя "shine".       

       

      

            cool_glassy_icon_09.png
       

       

Зажав Ctrl, щелкаем по слою "bg” и отправляемся в меню Select > Modify > Expand. Вводим значение в 2px. Создаем новый слой над слоем "black-bg” и под слоем "shine” и называем его "frame". Заполняйте его любым цветом (я выбрал черный).       

       

        

            cool_glassy_icon_10.png
       

       

Теперь скройте слой "black-bg” и Вы увидите, что у нас получилось. Все почти готово.       

       

           

            cool_glassy_icon_11.png
       

       

Откройте панель Blending Options для слоя "frame” и выберите пункт Gradient Overlay. Задайте цвета, как на рисунке:       

       

           

            cool_glassy_icon_12.png 
       

       

Вот мы почти и закончили. Осталось только добавить нужный нам символ в иконку. Я попробую добавить символ                 RSS                -подписки.       

       

          

            cool_glassy_icon_13.png  
       

       

Добавьте параметр Inner Shadow, если хотите, и все! Вы только что сделали классную иконку с эффектом стеклянного блеска!       

       

        

            cool_glassy_icon_14.png 
       

       

Теперь с этой иконкой можно делать все, что угодно. Давайте рассмотрим, как сделать отражение.       

       

Создайте слой под основными слоями, используя инструмент Ellipse. Нарисуйте длинный тонкий эллипс, как на рисунке ниже. Залейте его черным цветом.        

       

           

            cool_glassy_icon_15.png 
       

       

Используя фильтр Gaussian Blur, размойте его с радиусом в 1px. Затем немного поиграйтесь с прозрачностью (Opacity).       

       

            

            cool_glassy_icon_16.png 
       

       

Теперь скопируйте всю иконку, отразите ее вертикально (Edit > Transform > Flip Vertical) и подвиньте настолько, чтобы нижние части иконок соприкасались.       

       

             

            cool_glassy_icon_17.png 
       

       

Используя Round Marquee, создайте выделение, как на рисунке ниже и добавьте Feather величиной в 30px. Нажмите клавишу Delete 3-4 раза.       

       

             

            cool_glassy_icon_18.png 
       

       

Подстройте прозрачность слоя, и у Вас есть замечательная иконка! Поздравляю!       

       

             

            cool_glassy_icon_19.png  
       

       

Манипуляции с цветами тоже могут принести интересные результаты, например, как тут:       

       

              

            Классные кнопки со стеклянным блеском  
       

       

Готово!           

       

Источник:            Автор       

Категория : Классные кнопки со стеклянным блеском. | Источник материала |
Просмотров : 998 | Теги : уроки фотошоп, как сделать классные кнопки со стек
Foto Design-Fototruki-www.fototruki.3dn.ru