Pre svega, želim da kažem da je takav rad isplativiji u vektorskom uređivaču kao što je Adobe Illustrator ili CorelDraw nego u rasterskom uređivaču Photoshop.

Ali šta učiniti ako pri ruci nema uređivača vektora, a posao treba obaviti odmah? Nema drugog izlaza nego koristiti stari stari Photoshop. Ali nije teško ni u Photoshopu nacrtati dugme koje ima efekat metalne površine.

Ovo sam dobio za pet minuta rada:

Trebalo mi je da nacrtam metalno dugme sa efektom pritiska da kreiram interfejs besplatne android aplikacije Flashlight, koju možete instalirati sa ovog linka, istovremeno i videti kako možete primeniti sliku kreiranu u Photoshopu u praksi.Opis aplikacije ovdje.

Počnimo.

Otvorite Photoshop, kreirajte novi dokument 500 x 500 piksela ili šta god želite. Dimenzije dokumenta se kasnije mogu menjati bez gubitka kvaliteta, jer. za kreiranje koristit ćemo vektorske alate i stilove slojeva.

Postavite dve vodilice tačno u centar dokumenta. Uzmite alat Ellipse, postavite mod na Shape (Snape), boja ispune je siva 8f8f8f. Usmjeravamo kursor točno na križić vodiča, držimo lijevu tipku miša i počinjemo povlačiti kursor u bilo kojem smjeru od centra.Nakon, kada počnete da prevlačite kursor, držite pritisnute tastere Alt i Shift, centar elipse će se pomeriti na nišak kursora, a sama elipsa će postati geometrijski ispravan krug. Tako napravite figuru u obliku kruga. Kada završite,prviotpustite levi taster miša, asamo zatimtastere Alt i Shift. Dakle, trebali bismo završiti sa nečim poput ovoga:

Izgradnja figure elipse.

Ovo će biti prednja ravna površina dugmeta. Da bi izgledao kao metal, morate dodati stil sloja Gradient Overlay sa sljedećim postavkama:

Imajte na umu da je stil gradijenta "Ugao" . Boje se smenjuju - čista bijela sa različitim nijansama sive.

Rezultat:

Metalni gradijent na dugmetu.

Duplirajte sloj elipse i premjestite rezultirajući duplikat ispod originalnog sloja (imam duplikat pod nazivomEllipse 1 copy). Primijenite naredbu Slobodna transformacija (Ctrl + T) na duplikat, držite tipke Alt + Shift i malo povećajte prečnik oblika povlačenjem bilo kojeg od uglova okvira:

Kreiranje osnove dugmeta.

Primijenite stil sloja na njega i stil sloja "Gradient overlay" , ali postavke će ovaj put biti drugačije, stil gradijenta je spektakularan, crno-bijeli naizmjenično:

Dodavanje spektakularnog gradijenta na osnovu dugmeta.

Rezultat bi trebao biti:

Oblici od dva sloja sa gradijentima.

Duplikat slojaEllipse 1 copy, nazvao sam gaEllipse 1 copy 2i premjestite ga ispodseEl copy. Povećajte njegov prečnik pomoću Free Transform tako da dokument izgleda otprilike ovako:

Duplikat sloja oblika.

Ovom sloju oblika ćemo dodati dva stila sloja - "Embossed" i "Stroke" sa sljedećim postavkama:

Rezultat:

U sledećem tutorijalu ćemo nacrtati ikonu za uključivanje/isključivanje i dati dugmetu teksturu.

Preuzmite materijale za lekciju:

1 PSD, 1 PNG | 1,54 MbPreuzmi sa Yandex.Disk-a

Kategorija: