Cum sa faci o emblema in Photoshop

Vrei sa-ti faci o emblema/sigla in Photoshop dar nu stii cum? Tutorialul acesta te poate ajuta, daca-l urmezi si pui in aplicare tehnicile prezentate. Vom invata cum sa realizam o emblema in Photoshop folosind atat elemente create de noi cat si alte resurse ce le puteti downloada gratis de pe internet. Sa incepem!

Pasul 1: Facem un nou document in Adobe Photoshop cu dimensiunile de 640×480 pixeli. Pentru a face un nou document mergem la File-New!

Pasul 2: Din bara de unelte alegem Custom Shape Tool si selectam forma de emblema/sigla indicata in imaginea de mai jos.

Pasul 3: Apasam Ctrl+Shift+N pentru a face un nou layer (strat) si folosind unealta indicata la pasul 2 desenam o emblema de culoare albastra. Important este sa mentineti apasata tasta Shift in timp ce desenati sigla pentru a pastra proportiile.

Pasul 4: Click dreapta pe layerul proaspat creat la pasul 3- Blending Options-Stroke si facem setarile din imaginea urmatoare:

Pasul 5: Pentru Pattern Overlay (Aveti aici tutorialul ce va explica realizarea pattern-ului respectiv)

Pasul 6: Gradient Overlay

Pasul 7: Bevel and Emboss:

Pasul 8: Inner Glow:

Pasul 9: Asa ar trebui sa arate sigla noastra daca am respectat setarile si indicatiile de mai sus.

Pasul 10: Facem un nou layer (Ctrl+Shift+N), il redenumim “Panglica”  iar apoi, folosind Pen Tool (P) facem urmatorul path.

Pasul 11: Click dreapta pe path-ul creat la pasul 10, alegem optiunea Fill Path si-l umplem cu o culoare albastra. Codul culorii este #007ab9.

Pasul 12: Inca un nou layer facem, eu l-am redenumit “Panglica Verso” ,folositi aceeasi tehnica ca la pasul 11 si adaugati acele portiuni indicate in imaginea urmatoare:

Pasul 13:  Selectati din nou layerul “Panglica” si folosind Dodge respectiv Burn Tool (O) adaugati niste lumini/umbre peste layerul nostru.

Pasul 14: Tineti tasta Ctrl apasata si dati un click pe iconita layerului “Panglica” pentru a selecta toata suprafata acestuia.

Pasul 15: Faceti un nou layer (Ctrl+Shift+N) si umpleti selectia cu un Pattern, eu am folosit acelasi pattern ca la pasii anterior doar ca de dimensiuni mai mari. Daca este nevoie voi face si un tutorial despre realizarea acestui pattern.

Pasul 16: Schimbam modul layerului pe Soft Light iar opacitatea o scadem pana in jur de 35% pentru un efect mai “misto”.

Pasul 17: Vom continua sa adaugam niste efecte si acestui pattern, click dreapta pe layerul respectiv-Blending Options-Inner Shadow si facem setarile urmatoare:

Pasul 18: Outer Glow

Pasul 19: Asa ar trebui sa arate pana acum daca am aplicat corect setarile.

Pasul 20: Mai adaugam putina lumina folosind Dodge Tool (O) peste acea panglica.

Pasul 21: Facem inca un nou layer (Ctrl+Shift+N), il redenumim “Stroke” si folosind Pen Tool (P) facem un path ca in urmatoarea imagine.

Pasul 22: La pasul acesta avem nevoie de setarile uneltei Brush Tool de aceea setam dimensiunea brushului pe 4px, culoare alba. Click dreapta pe path-ul creat la pasul 21 si dam Stroke Path,  din lista alegem Brushapoi dam Ok.

Pasul 23: Setam modul layerului “Stroke” pe Overlay iar opacitatea in jur de 70 %.

Pasul 24: Adaugam un text peste panglica noastra, caruia, daca dorim ii adaugam niste efecte, in functie de gusturi.

Pasul 25: Textul introdus a fost “Invata Photoshop” de aceea vom adauga niste iconite/imagini ce au legatura cu Photoshop-ul. Vom incepe cu iconita Adobe Photoshop care o gasim pe GOOGLE si o inseram in documentul nostru.

Pasul 26: Mergem la Edit-Free Transform si o redimensionam, apoi o pozitionam peste sigla noastra.

Pasul 27: Acestea sunt iconitele de care vom avea nevoie in continuare, le puteti descarca de la sfarsitul acestui articol.

Pasul 28: Le adaugam pe rand ca si in cazul iconitei Photoshop. Intai rigla si stiloul (este iconita pentru pen tool).

Pasul 29: Apoi pensula si cel de-al 2lea stilou.

Pasul 30: In continuare, vom adauga o umbra subtila emblemei noastre. Facem un nou layer (Ctrl+Shift+N), acesta trebuie pozitionat sub toate celelalte layere, apoi folosind Eliptical Marquee Tool (Tasta M) facem o selectie ca in urmatoarea imagine:

Pasul 31: Umplem selectia cu culoarea neagra – Click dreapta pe selectie-Fill.

Pasul 32: Mergem la Filter-Blur-Gaussian Blur si facem urmatoarele setari:

Pasul 33: Apoi la Filter-Blur-Motion Blur:

Pasul 34: Putem sa-i mai scadem din intensitate folosind radiera (Eraser Tool).

Final:

Descarca resursele necesare!

Buton de download in Photoshop

In acest tutorial vom invata cum sa realizam un buton de download in Adobe Photoshop. Aceeasi pasi pot fi aplicati pentru realizarea si altor tipuri de butoane/iconite web. Sunt foarte multe stiluri de butoane, noi vom invata sa facem unul simplu dar de efect.

Pasul 1: Facem o noua imagine in Photoshop cu dimensiunile de 400×300 px si Background Alb.

Pasul 2: Acest pas este unul optional, dar eu am preferat sa nu las backgroundul simplu, ci sa-l modific putin pentru a scoate butonul mai mult in evidenta. Umpleti backgroundul cu o culoare albastra. Codul culorii :#2777A9

Pasul 3: Mergem la Filter-Render-Lighting Effects pentru a adauga ceva efecte fundalului

Pasul 4: Facem un nou layer (Ctrl+Shift+N) iar apoi folosim Rounded Rectangle Tool, cu culoarea neagra si facem un dreptunghi asemanator celui din imaginea de mai jos.

Pasul 5: Click dreapta pe layerul creat la pasul 4- Blending Options- Gradient Overlay si facem urmatorele setari:

Pasul 6: Apoi pentru Inner Shadow :

Pasul 7: Stroke:

Pasul 8: Si Drop Shadow:

Pasul 9: Asa ar trebui sa arate daca am aplicat corect setarile de mai sus

Pasul 10: Folosind Type Tool (T) si un font la alegere (eu am alex Myriad Pro, Semibold, 18pt )  adaugam textul “Download”  peste butonul nostru.

Pasul 11: Click dreapta pe layerul cu textul- Blending Options-Drop Shadow si adaugam o umbra subtila sub text.

Pasul 12: Facem inca un layer (Ctrl+Shift+N), il redenumim Pattern si folosind Pen Tool (P) sau orice unealta de selectie, faceti o selectie in jurul butonului.

Pasul 13: Click dreapta pe selectie – Fill si selectam Pattern apoi dam ok. Puteti invata cum sa realizati acest pattern in tutorialul de aici.

Pasul 14: Dupa ce am dat ok, ar trebui sa avem ceva de genul acesta.

Pasul 15: Pentru layerul cu pattern-ul modificam Blending Mode-ul pe Soft Light iar opacitatea o descrestem pana la 35%.

Pasul 16: Vom adauga si un efect de “sticla” peste buton. Facem un nou layer, il redenumim “Efect sticla” .

Pasul 17: Folosind Rectangular Marquee Tool facem urmatoarea selectie:

Pasul 18: Click dreapta pe selectie-Fill,  si umplem selectie cu culoarea alba.

Pasul 19: Stergem excesul folosind radiera (Eraser Tool – tasta E).

Pasul 20: Apoi pentru layerul “Efect sticla” setam Blending Mode-ul pe Soft Light, si la fel scadem opacitatea pana la 30 %.

Pasul 21: Apoi folosind unealta Single Row Marquee Tool, prezentata si in imaginea de mai jos facem urmatoarea selectie,   nu inainte de a face un layer nou.

Pasul 22: Cu Brush Tool de dimensiuni mari si culoarea alba dati un click in interiorul selectiei facute la pasul anterior.

Final : Puteti face butoane de diferite culori, doar schimband setarile de la pasul 5. Succes!

Descarca PSD-ul cu butonul de download!