Photoshop – Kreiranje web sajta (II deo)

Nastavljamo sa dizajnom sajta u Photoshop-u:

  • Sada ฤ‡emo kreirati liniju uz levu ivicu dokumenta koja ฤ‡e u buduฤ‡nosti predstavljati liniju gde ฤ‡e biti smeลกten meni, tj. navigacija kroz sajt. Izaberite alatku „Rectangle tool“ i selektujte njome prvih 150 piksela, na levoj strani dokumenta. Zatim taj selektovani deo ispunite foreground bojom. Za popunu selekcije mustrom (pattern-om) kreirajte „pattern overlay“ efekt izborom menija „Layer> Layer Style> Pattern Overlay“. Po izboru ovog menija, u dijalogu izaberite mustru koju smo prethodno spremili, te kliknite „OK“. I pogledajte ฤudo: imate gotovu liniju menija.

  • Prelazimo na kreiranje tzv. „svoda“, koji ฤ‡e se nalaziti u gornjem delu web stranice. Kada dizajnirate web sajt u Photoshop-u, pre toga veฤ‡ morate imati sliku u glavi o tome da li ฤ‡ete za formiranje strane u HTML-u koristiti tabele ili frejmove. Ova odluka ฤ‡e direktno uticati na ono ลกta moลพete da uradite u Photoshop-u, a ลกta ne moลพete. Mada ovaj dizajn koji predstavljamo moลพe biti izveden i uz pomoฤ‡ tabela, mnogo je prikladnije koristiti frejmove jer ฤ‡emo kreirati „svod“ koji ฤ‡emo kasnije smestiti u frejm na vrhu stranice. Kreirajte novi sloj klikom na dugme „Create New Layer“ u paleti „Layers“, te izaberite alatku „Rectangle tool“. Selektujte pravougaoni oblik koji ฤ‡e poฤeti u gornjem levom uglu dokumenta, i to 20 piksela od vrha, a imaฤ‡e visinu od 95 piksela. Neka selekcija bude ลกiroka koliko i sam dokument. Da biste bili precizniji u selekciji, zumirajte dokument i pratite lenjir. Ako kasnije budete imali potrebu da menjate oblik selekcije, to moลพete uraditi sa „Path Component Selection“ alatkom, i potvrฤ‘enom opcijom „Show Bounding Box“ na liniji opcija. Sa ovom alatkom moลพete promeniti oblik selekciji, kao ลกto to radite, recimo, u Corel-u.

  • Poลกto je oblik pravougaonika dosta jednostavan, promeniฤ‡emo ga u neki luฤni oblik (u obliku luka). Kliknite u donji desni ugao alatkom „Direct Selection“ (beli pokazivaฤ miลกa) i prevucite sidrenu taฤki (Anchor Point) nagore, drลพeฤ‡i istovremeno taster „Shift“ (ovo ograniฤava pokret samo na vertikalnu osu). Za dodavanje joลก jedne sidrene taฤke na sredinu pravougaonika, iskoristite alatku „Add Anchor Point“, a zatim alatkom „Direct Selection“ premestite ovu taฤku nagore i dobiฤ‡ete fini luk.

  • „Nafilujte“ sada ovu putanju (Path) istom mustrom kao i liniju menija, selektujte meni „Layer> Change Layer Content Pattern…“ i izaberite veฤ‡ koriลกฤ‡enu mustru. Nabaciฤ‡emo i efekat senke – meni „Layer> Layer Style> Drop Shadow“.

    Pratite Krstaricu na www.krstarica.com