Блестящая стеклянная кнопочка.

[Alisа]

Вот такая вот кнопочка. Сделать ее несложно, единственный недостаток – смотрится только на очень темном фоне. :(

http://img138.**************/img138/4484/button7sz.jpg


1. Создадим файл размером 150х50 и зальем черным цветом.

http://img497.**************/img497/6651/21017mf.jpg


2. Выберем инструмент Circle Marquee Tool фиксированного размера 20х20

http://img497.**************/img497/9131/21029wn.jpg


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

http://img95.**************/img95/5015/21035vb.jpg


4. Инструмент Rectangle Marquee Tool, стиль Normal, рисуем аккуратное прямоугольное выделение.

http://img95.**************/img95/74/21045im.jpg



5. Зальем выделение белым цветом. Все это сделаем в одном слое.

http://img497.**************/img497/7615/21053wd.jpg


6. Layer – Layer Style -- Blending Options. Везде будем использовать голубой цвет #00FFF7, хотя можно попробовать и другой какой-то.


http://img497.**************/img497/7210/21062lc.jpg

http://img497.**************/img497/9308/21070po.jpg

http://img497.**************/img497/7844/21080qr.jpg

http://img95.**************/img95/8743/21096in.jpg

http://img497.**************/img497/8091/21107ig.jpg

http://img95.**************/img95/8863/21112gz.jpg


7. Вот что у нас получится.

http://img95.**************/img95/2352/21136av.jpg

[Alisа]

8. Нажмем Ctrl-I чтобы инвертировать изображение.

http://img95.**************/img95/2281/21144if.jpg


9. Создадим вот такое овальное выделение большого радиуса, примерно как у меня. Создадим новый слой. Щелкнем на клавише D и выберем градиент Foreground to Transparent. Зальем градиентом вертикально, от верха до низа выделение. Инвертируем выделение. Щелкнем на клавише Х, градиент изменится на белый-прозрачный. Проведем от верхнего края картинки до низа выделения.

http://img133.**************/img133/355/21166lx.jpg

10. Загрузим выделение кнопочки, щелкнув на предыдущем слое с нажатой клавишей Ctrl. Инветируем выделение и отрежем лишнее.

http://img95.**************/img95/4409/21179aa.jpg


11. Для надписи я выбрала вот такой шрифт.

http://img133.**************/img133/4772/21184xw.jpg

http://img133.**************/img133/1851/21194gi.jpg


12. К надписи применим вот такой стиль слоя.

http://img133.**************/img133/3580/21205ja.jpg


13. Создадим копию слоя с надписью, перевернем ее вертикально. Щелкнем правой кнопочкой на копии слоя и выберем команду Rasterize Layer. Щелкнем на клавише D, перейдем в режим быстрой маски, выберем градиент Foreground to Transparent, зальем им кнопочку снизу, дабы получить плавный переход, выйдем из режима быстрой маски и отрежем нижнюю часть слоя. Немного уменьшим прозрачность. У меня 90%.


http://img95.**************/img95/1858/21214zt.jpg

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

http://img95.**************/img95/306/21227jz.jpg

http://img95.**************/img95/6497/21233qf.jpg



15. Нарисуем еще вот такой треугольничек. Я нарисовала при помощи Path, потом задала выделение. Создадим новый слой и зальем выделение белым.

http://img95.**************/img95/831/21244nv.jpg

http://img95.**************/img95/8008/21256lw.jpg


16. Зададим режим смешивания soft light и несколько раз скопирум слой. Вот такакя миленькая кнопочка получилась.


http://img138.**************/img138/4484/button7sz.jpg


P.S. Изначально данная статья, видимо, находилась на сайте - www.n-sane.com.
Переведена с английского, обработана и дополнена, мной. Некоторые изначальные операции показались мне лишними, некоторые не дающими нужного эффекта, и были изменены.