Astazi vom invata cum sa realizam o bara de navigare ( o bara de meniu ) folosindu-ne de Adobe Photoshop. In acest articol vom face o bara de meniu clasica, foarte simpla, vor mai exista tutoriale in care voi face si alte tipuri de meniuri.
Pasul 1: Facem un nou document in Adobe Photoshop (File-New) cu dimensiunile de 600×400 px si fundal alb.
Pasul 2: Folosim Rounded Rectangle Tool (U) si cu brush setat pe culoarea albastra, intr-un nou layer, facem urmatoarul shape.
Pasul 3: Dupa ce am facut acea forma, dam click dreapta pe layerul proaspat creat si alegem optiuneaBlending Options. Iar pentru Gradient Overlay facem urmatoarele setari:
Pasul 4: Inner Shadow
Pasul 5: Stroke
Pasul 6: Asa ar trebui sa fie bara daca ati respectat setarile de mai sus.
Pasul 7: Alegem Type Tool si adaugam butoanele peste bara creata. Incercati sa nu folositi fonturi foarte sofisticate pentru ca vor strica aspectul website-ului. Eu am folosit fontul Arial, Regular, 13 PT.
Pasul 8: Click dreapta pe layerul cu textul si facem urmatorele setari pentru Drop Shadow
Pasul 9: Din bara de unelte, alegem Single Column Marquee Tool si facem o selectie ca in imaginea de mai jos, bineinteles, intr-un Layer nou.
Pasul 10: Umpleti selectia cu culoarea alba iar apoi cu Eraser Tool (E) incercati sa-i dati un aspect cat mai “ascutit” la capete.
Pasul 11: Duplicati layerul cu separatorul (Ctrl+J) sau mai faceti inca o data aceeasi chestie ca la pasul 10, doar ca folosind culoarea neagra.
Pasul 12: Schimbati modul layerelor cu separatoarelor pe Soft Light.
Pasul 13: Repetati pasii 9-12 pentru a face si celelalte separatoare.
Asa ar trebui sa arate rezultatul, eu am mai facut inca 2 meniuri de culori diferite. Sper ca tutorialul sa va ajute, puteti descarca PSD-ul cu bara de navigare mai jos!
Unele imagini sunt neclare, asta datorita functiei acestei teme de a redimensiona imaginile pentru ca site-ul sa nu fie distorsionat, de aceea este necesar sa dati click pe ele pentru a le vedea HD.
Niciun comentariu:
Trimiteți un comentariu