Pasul 1

Pentru a începe, creăm un document nou. Pentru acest tutorial am ales dimensiunea 500×200 px. Se va umple cu un fundal Radial Gradient de la un gri închis la un gri mai întunecat. Puteți face acest lucru prin selectarea butonului Gradient și apoi Radial. Selectați culoarea de background #45443f și culoarea foreground #31302c. Click stânga în mijlocul documentului și trageți spre exterior.

Pasul 2

Creați un nou layer (Layer > New > Layer) și faceți o selecție de 440×50 px în mijlocul documentului.

Pasul 3

Folosiți Linear Gradient pentru a umple selecția. Culoarea #f4f4f4 în partea de sus, #d9d9d9 în partea de jos.

Pasul 4

Acum vom aplica stiluri layer-elor create.

Layer > Layer Styles > Drop Shadow

Layer > Layer Styles > Outer Glow

 Rezultatul:

Pasul 5

Acum vom folosi Text Tool pentru a adăuga text. Fontul pe care l-am folosit este Verdana, Regular, 13pt, #686868 (și #ac0000 pentru efectul hover)

Pasul 6

În cele din urmă vom adăuga liniile pentru separarea butoanelor. Mai întâi cream un layer și iarăși o selecție de 1×50 px între cele două link-uri. Umpleți (Edit > Fill) selecția cu #b4b4b4.

Pasul 7

Mutați selecția la dreapta cu 1px  (săgeată dreapta de pe tastatură). Umpeți selecția cu #d9d9d9.

Pasul 8

Multiplicați acest layer si mutați-l și între celelalte link-uri. În acest tutorial am și modificat transparența la 50% pentru separatoarele link-urilor.

Succes

* Editori (verifică toate postările de pe blog și modifică atunci când e ceva greșit)
* Autori (o functie care e foarte importantă pe un blog și este foarte greu să găsești oameni care să se priceapă cu adevarat, ei postează articole/subiecte pe blog)
* Contribuitor (contribuie cu ceva constructibil la blog)

Cine este interesat contact la: design@digitalmoments.ro

Pasul 1

Vom incepe prin a crea un nou fisier. Eu voi folosi 450×350 px la 72 dpi. Ca fundal voi folosi culoarea neagra.
Dupa aceea cream un nou layer pe care il vom numi “Buton”. In acest layer vom crea un cerc cu dimensiunea 194×194 px si culoarea #003637.

Pasul 2

Intrati in Layer Style pe layer-ul “Buton” si adaugati Inner Shadow, Inner Glow si Gradient Overlay cu setarile din imaginile urmatoare.

Rezultatul va fi:

Pasul 3

Creati un nou layer in care vom trasa un alt cerc cu dimensiunea 147×147 px, culoare alba si pozitionati-l in centrul design-ului.

Pasul 4

Intrati in Layer Style si selectati Inner Glow, Gradient Overlay si Stroke pentru cercul alb. Apoi selectati Darken la Blending Mode .

Rezultatul va fi:

Pasul 5

Duplicati layer-ul “Buton” si apoi click dreapta pe el si Merge Layer Set. Acum redimensionati layer-ul la 70% (Edit -> Transform -> Scale) si pozitionati-l in centrul design-ului.

Pasul 6

Repetati pasul 5, dar faceti redimensionarea la 40%.

Pasul 7

Mutati layer-ele create in pasul 5 si 6 in layer-ul “Buton”. Luminati acel layer din Layers palette apoi dati click dreapta  si Merge Layer Set. Acum avem un singur layer cu un design unic.

Pentru acest layer selectati Inner Shadow, Inner Glow si Gradient Overlay.

Rezultatul va fi:

Bafta!

Descarca Gmail Google Gadget [via Official Gmail Blog]