Share
În acest tutorial, vom crea un aspect textual al site-ului prin stratificarea mai multor imagini. Crearea de layout-uri de design web foarte texturate este mai ușor decât credeți. Puteți învăța să construiți rapid modele de imagini intensive. Pentru designerii intermediari Photoshop, crearea acestui design va dura mai puțin de o oră și veți învăța câteva sfaturi profesionale pe parcurs. Să începem!
Puteți vedea previzualizarea imaginii finale de mai jos.
Aruncati o privire la design-ul site-ului pe care il vom crea mai jos.
Editorul nostru video Gavin Steele a creat acest tutorial video pentru a completa acest tutorial text + imagine.
În acest tutorial vom folosi câteva imagini stoc pentru a crea un layout de web foarte texturat. Să începem prin crearea unui nou document cu următoarea dimensiune: 1000 pixeli la 1000 pixeli.
Acum continuați și descărcați textura fără sudură din lemn de la Grafplus.com. Aici puteți găsi linkul de descărcare: Descărcați textură fără sudură din lemn. Deschideți "texture-small.jpg" în Photoshop și apoi mergeți la Edit> Define pattern. Alegeți un nume pentru modelul dvs. și faceți clic pe OK. Acum puteți închide imaginea cu textura lemnului.
Selectați stratul "fundal" și apăsați Command + J. Această comandă rapidă va duplica stratul "fundal". Selectați acest nou strat, iar din meniul de sus selectați Layer> Style Layer> Overlay Pattern ... Utilizați modelul pe care l-ați creat cu câteva secunde în urmă.
Utilizați instrumentul Rectangle pentru a crea niște bare verticale cu culori diferite /
Selectați toate aceste forme în paleta de straturi ținând apăsată tasta Command (Comandă) și cu mouse-ul faceți clic pe fiecare strat). În acest fel veți selecta toate formele.
Când ați selectat toate formele, apăsați pe Command + E (această comandă va îmbina toate straturile într-o singură). Modificați modul de amestecare la Color Dodge și valoarea Opacitate între 40% și 50%.
Acum este momentul să adăugați o altă imagine de stoc mare. Vizitați grafplus încă o dată și descărcați următoarea imagine: textură grunge. Plasați această imagine în documentul dvs. din partea de sus. Mergeți la File> Place și selectați această textură de grunge frumos.
Asigurați-vă că ați selectat acest strat și apoi aplicați o umbră de picătură simplă. Strat> Stiluri strat> Drop Shadow.
Utilizați instrumentul Marcaj dreptunghiular pentru a face o selecție după cum se arată.
Asigurați-vă că aveți stratul cu textura grunge selectat, apoi apăsați Command + J (această comandă rapidă va crea un strat nou prin tăiere). Selectați stratul nou și rotiți stratul cu 180 de grade (Editare> Transformare> Rotire 180. Plasați acest strat nou pe partea de sus a planului cu instrumentul Mutare. text: "PSDututs +".
Schimbați modul de amestecare pentru emblema textului în Color Burn.
Utilizați aceeași tehnică pentru a tăia unele butoane și un subsol. Aici puteți vedea rezultatul.
Dacă doriți să creați un buton distinct cu o altă culoare, trebuie să selectați stratul cu butonul pe care doriți să-l faceți unic, apoi apăsați Command + U pentru a afișa setările Hue / Saturation. Bifați caseta de selectare Colorize și mutați glisoarele la dreapta sau la stânga până când sunteți mulțumit de rezultat.
În partea dreaptă, creați o formă albă cu instrumentul Rectangle.
Utilizați instrumentul Linie pentru a crea câteva linii subțiri și a le pune peste forma albă. Culoarea folosită pentru linii este # d3d1d2.
Selectați forma albă și liniile din paleta de straturi, apoi apăsați Command + E pentru a fuziona toate straturile. Selectați instrumentul Eraser și cu o perie rotundă mică ștergeți anumite părți ale stratului până când aveți o bucată de hârtie realistă.
Acum adăugați următoarele stiluri de straturi.
Utilizați instrumentul tip orizontal pentru a adăuga text. Am folosit fontul Myriad Pro (veți găsi fontul în Windows 7 și Vista).
Acum adăugați o altă imagine în mijlocul layout-ului, iar în partea dreaptă a imaginii adăugați două săgeți. Săgețile pe care le veți găsi în cadrul instrumentului Custom Shape Tool.
Împreună cu fișierul PSD veți găsi două imagini stoc în fișierele sursă Psd Plus pentru acest tutorial. Desigur, dacă nu sunteți membru Plus, puteți căuta imagini echivalente pe web. Prima este o frunză, iar a doua este o floare roșie. Deschideți ambele imagini în Photoshop și scoateți fundalul. Ambele fotografii sunt de înaltă calitate, la aproximativ 4000 de pixeli, și puteți elimina fundalul cu ajutorul instrumentului Magic Eraser Tool sau puteți folosi metoda preferată.
Plasați imaginea cu frunza din partea dreaptă a aspectului sub bucata de hârtie albă.
Duplicați stratul cu frunza de mai multe ori și plasați aceste mai multe frunze în poziții diferite, după cum se arată.
Ultimul pas este sa plasezi floarea rosie peste frunzele verzi.
Iată rezultatul final. Distreaza-te sa-ti creezi propriile layouts ale site-urilor Photoshop.
Accentsconagua