M-am hotarat sa pasesc in lumea webdesign. Dupa multe lecturi pe internet si dupa cum am fost sfatuita, am ales HTML, Dreamweaver si Adobe Photoshop pentru ca este mai usor. Pasii sunt multi, marunti si greu de parcurs si am decis ca fiecare lectie pe care o voi invata si fiecare tutorial pe care-l voi face o sa-l prezint aici din doua motive:
1. Repetitia este mama invataturii, repetand voi retine mai bine.
2. Poate acest blog facut in pasi marunti va mai ajuta pe cineva.
Voi incepe sa invat bazele HTML-ului in Notepad dupa care voi trece la Dreamweaver
Cine doreste sa invete pas cu pas cu mine este binevenita (binevenit)

Adobe Photoshop : Butoane transparente



Am sa va prezint cum fac eu un set de butoane transparente. Ele pot fi mult mai complexe si mai lucrate dar acum am sa fac la modul simplificat. Mai complex am sa prezint in alt tutorial.
Am sa lucrez direct pe o fotografie pentru a se vedea efectul mai bine.

Deschidem poza in Adobe Photoshop.
Alegem unealta Rounded Rentagle Tool sau alta
Punem Radius 8 px.
Alegem o culoare.
Voi desena o forma (dreptunghi cu colturile rotunjite) care va fi forma butonului.
Punem Fill 0%.




Click dreapta pe Layer-ul nou si alegem Blending Options si bifam Drop Shadow
La Blend mode punem Multiply si ne jucam cu Angle pana obtinem o umbra care ne place si care se potrivste cu umbra din poza (eu am fixat la -153).



Am bifat Inner Shadow si am fixat Distance la 3 px.

La Outer Glow si Inner Glow am pus doar Blend Mode : Screen.

La Gradient Overley nu am umblat (de acolo putem seta cat din buton sa fie transparent si in ce proportie)

In final am bifat Stroke si am pus Outside la Position si am pus Opacity 50%




Ca sa facem alte butoane dam click pe Layer apoi dam Duplicate Layer. Butoanele se suprapun dar le putem trage si aseza unde vrem. Dam Duplicate Layer pentru fiecare buton pe care vrem sa-l adaugam.


Apoi cu unealta Horizontal Type Tools am scris pe butoane.



Orice modificare adusa in Blending Options se cunoaste in aspectul final. Putem interveni in orice setare pentru a observa ce se modifica.

Am facut alte butoane respectand coloristica pozei



Optiunile sund diverse si se pot crea nenumarate stiluri si efecte.
Cand am sa am mai mult timp am sa prezint mult mai detaliat si voi arata si cum se obtine si efectul de sticla sau oglinda semitransparenta.



Niciun comentariu:

Trimiteți un comentariu