Photoshop

Creeaza un buton modern si atragator utilizand Photoshop CS4/5

Acesta este primul tutorial in care vei invata cum sa creezi un buton web2.0, atragator si simplu de creat.Pentru a crea butonul voi utiliza Adobe Photoshop CS5, dar puteti utiliza si CS4, obtinand aceleasi rezultate!

Timp de lucru:20-25 de min Dificultate:usor Program utilizat:PS CS4/5

Cum va arta la final:

Fontul utilizat este Ballpark, il puteti gasi gratuit.Doar instalati-l in C:/Windows/Fonts si gata.

Dupa cum vedeti va arata destul de mare la final, dar m-am gandit ca ati putea observa detaliile mai bine daca as face butonul la scara mare.

1.Deschgideti Photoshop si creati o noua fila de 500px*500px.

2.Creeaza un nou strat(Create a new layer)->Shift+Ctrl+N, numeste-l Noise, apoi ia unealta gradient si creeaza ceva asemanator cu(acest pas este optional):

3.Apoi mergi la Filter, Noise si adauga Amount 10%, Distribution Uniform, Monochromatic.Apoi mergi la Layers si redu opacitatea la 40%.Ar trebui sa ai ceva asemanator cu:

4.Utilizeaza Unealta pentru deptunghiuri rotunjite(apasa U) si deseneaza o forma ca aceasta.Am adaugat de data aceasta si niste marcaje pentru a crea o forma cat mai exacta.Acestea le vom utiliza si pe viitor pentru a alinia cele 2 dreptunghiuri.

5.Mergi din nou la layer styles, da clic dreapta pe aceasta figura si mergi la Blending Options, adauga Drop Shadow cu urmatoarele caracteristici.

6.Acum ia din nou unealta pentru a crea un dreptunghi cu colturi rotunjite(apasa U) si creeaza un dretunghi mai mic decat cel anterior dar care sa se suprapuna perfect peste celalalt.Trebuie sa arate asa:

La acset dreptunghi am adaugat mai multe efecte.pentru a face acest lucru mergi la Layer Style, Blending Options si adauga urmatoarele efecte in acset fel:

7.Acum fa clic dreapta pe aceasta figura geometrica(dupa ce ai aplicat efectele) su da clic “Convert to Smart Object“.Avem nevoie de acest lucru pentru a putea adauga Noise si acestei figuri geometrice.Apoi mergi la Filter, Noise, Add Noise si adauga valorile:Amount 2%, Distribution Uniform si Monochromatic.Dupa efectuarea acestor pasi butonul ar trebui sa arate asa:

8.Acum ia unealta pentru text, gaseste fontul Ballpark, seteaza marimea textului la 100 de px si culoarea acestuia la #908f8f.Ar trebui sa obtii ceva asemanator:

9.Ultimul pas este sa adaugam cateva efecte textului.Din nou, mergi la layerul text ce tocmai l-ai creat, clic dreapta pe el si mergi la Blending Options.Adauga:

Si acum ar trebui sa obtii ceva asemanator cu:

Personal, cred ca este ceva foarte simplu de realizat, dar care are un impact major asupra oricarui vizitator.Cred ca ar merge foarte bine la meniurile unor website-uri, website-uri ce vreau sa aiba un aspect modern, dar in acelasi timp simplist.Totusi v-as sugera sa reduceti dimensiunea lui in viitoarele voastre proiecte fiindca este destul de mare.

Write A Comment