Design Glossy Web 2.0 Button în Photoshop
Privind pentru a proiecta unele glossy caută Web 2.0 buton? Iată un simplu tutorial Photoshop care vă oferă pas cu pas cum să obțineți un buton frumos cu aspect lucios roșu.
Pasul 1 - Crearea bazei
Activați o nouă pânză și reglați următoarele setări (marcate în galben) conform imaginii de mai jos. Restul ar trebui să fie implicit. S-ar putea să doriți să verificați dublu și cu valorile implicite.
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop.gif)
Creați un nou apel pentru straturi "Buton"
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_2.gif)
În stratul "Buton", selectați instrumentul Rounded rectangle
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_3.gif)
Dați-i o rază de 7 pixeli
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_4.gif)
Desenați un dreptunghi similar cu imaginea de mai jos.
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_5.gif)
Pasul 2 - butonul roșu
Faceți clic dreapta pe opțiunea de îmbinare pentru stratul "buton"
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_6.gif)
Confirmați următoarele setări pentru
Umbra
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_7.gif)
Umbra interioara
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_8.gif)
Bevel și Emboss
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_9.gif)
Gradient Overlay
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_10.gif)
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_11.gif)
Butonul dvs. ar trebui să arate așa
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_12.gif)
Pasul 3 - Crearea unui efect lucios
Creați un nou nivel de apel "Sticlă"
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_13.gif)
Selectați instrumentul Retangular marquee, asigurați-vă că selectați layerul "Buton". HOLD cheia dvs. ctrl și faceți clic pe stratul "Butoane”miniatură de strat. Butonul dvs. trebuie acum evidențiat.
Selectați acum butonul "Sticlă", țineți apăsată tasta Alt cu instrumentul de margine rectangulară selectat. Desenați (tăiați) în jumătatea inferioară a butonului ca imaginea de mai jos.
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_14.gif)
Umpleți zona selectată cu culoarea albă #ffffff folosind Instrumentul Bucket Paint
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_15.gif)
Reglați opacitatea la 18%
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_16.gif)
Ar trebui să aveți un buton lucios care arată în felul acesta.
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_17.gif)
Pasul 4 - Suprapunerea modelului
Să dăm butonului o acoperire ușoară. Voi folosi stripe5px creat mai devreme. Creați un nou strat de apel "Model" între "Buton" și "Sticlă" și continuați cu Opțiuni de amestecare.
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_18.gif)
Selectați Overlay Layout, alegeți Stripe5px (sau orice model pe care l-ați creat) și faceți clic pe OK apoi închideți dialogul.
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_19.gif)
Asigurați-vă că sunteți încă în instrumentul Rectangular Marquee, țineți apăsat
Pasul 5 - Introducerea textului
Aruncați în text aleatoriu în culoarea alb #ffffff cu următoarele setări
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_20.gif)
Utilizați următoarele efecte de amestecare pe stratul textului meu.
Umbra
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_21.gif)
Pasul 6 - Rezultatul final
Ar trebui să obții o imagine ca asta.
![](http://savtec.org/img/images_4/design-glossy-web-20-button-in-photoshop_22.gif)