• Përshëndetje Vizitor!

    Nëse ju shfaqet ky mesazh do të thotë se ju nuk jeni regjistruar akoma. Edhe pse nuk jeni regjistruar ju arrini të shihni pjesën me të madhe të seksioneve dhe diskutimeve të forumit, por akoma nuk gëzoni të drejten për të marrë pjesë në to dhe në avantazhet e të qënurit anëtar i këtij komuniteti. Ju lutem : REGJISTROHUNI që të dërgoni postime dhe mesazhe në Forum-Al.

    Regjistrohu !

Ndërtoni një Dizenjo Web të Pastër

Forum-Al

Aty ku shqiptarët mblidhen
Anëtar
Jan 5, 2010
Postime
561
Pikët
28
Vendndodhja
Forum
Kjo është guida ime e parë në Feniksi.com. Ideja të shkruaj këtë tutorial më erdhi sepse tek Feniksi mungojnë guidat për grafikën, prandaj bëra një mësim sadopak të nevojshëm për një dizajner që kërkon të ndërtojë faqe webi. Unë këtë web-dizajn e quajta “Web-dizajn I pastër” sepse nuk ka shumë ngarkesa apo shumë ngjyra dhe gjithashtu u mundova ta bëj sa më të qartë mësimin.


Për ta bërë më të lehtë bëra ndarjen e dizajnit:

Klikoni tek imazhi për ta zmadhuar atë


Si fillim hapim nje dokument të ri përmes File>New dhe japim permasat sikur në figurën e mëposhtme.



Pas kësaj na nevojiten disa vija qe do të na ndihmojnë shumë ne pozicionimin e dizajnit të cilat ndryshe quhen edhe “Guide lines”. Dizajni ynë ka përmasa 1000(gjerësia) x 1200(gjatësia). Atëherë veprojmë View>New guide 50px vertical, sikur në figurën më poshtë.



Kjo është vija jonë e parë ndihmëse. E përsërisim këtë edhe njëherë View>New guide 950px vertical dhe do të shohim dy vija me ngjyrë të kalter te celët (aqua) që do të paraqiten aty ku bëjmë punën.

Tani pa humbur shumë kohë veprojme edhe dy herë të tjera si më lartë View>New guide 450px vertical (kjo eshte vija jonë e tretë ndihmëse) dhe View>New guide 550px vertical (kjo eshte vija jonë e katërt ndihmëse).

Dokumenti me 4 vijat ndihmëse u rregullua dhe tani nuk na mbetet gjë vetëm se të vazhdojmë me dizenjimin.

Koka

Si ç’e dimë, një faqe duhet të ketë kokën, informacionet e ndryshme, menunë dhe këmbët. Unë nuk kam bërë ndonjë dizajn shumë të komplikuar, kam punuar një të thjeshtë dhe nuk është ndonjë filozofi e madhe ta dizenjojmë atë.

Së pari e hapim një grup me emrin Koka që të vendosim të gjitha elementet e kokës, pastaj marrim Rectangular Marquee Tool me përmasa si në figurë.

Kliko për ta zmadhuar


Dhe bëjmë një lloj koke ku asaj hapësire i japim ngjyrë #f7f7f7. Në kokë kemi të vendosur menunë dhe logon. Për logo kam vendosur vetëm një shkrim Feniksi.com me një lloj fonti Ballpark me madhësi 48 pt dhe me ngjyrë #f6a328. Bëhuni të kujdesshëm që shkrimin ta vendosni të ngjitur me vijën e parë ndihmëse, dmth me vijën 50px (shiko imazhin më poshtë).



Menuja

Tek menuja nuk kam bërë dicka shumë të gjerë, prandaj marrim fontin me llojin Myriad Pro 16 pt dhe i bëjmë disa lidhje si Fillimi, Projektet, Kontaktet, Për ne, Mbështetje etj. Gjithashtu kam përdorur edhe në mes të tyre Line Tool 1px që ta bëj një ndarje. Veproni edhe ju sikur unë dhe vendosni ato si më poshtë.



Mos harroni që të mos ju perzihen Shtresat (Layers). Të gjithë menunë bëjeni në një nën grupin e kokës me emrin “menuja”. Grupimin ja u rekomandoj sepse i ndani shtresat e ndryshme dhe mund ti aksesoni apo lëvizni më lehtë.

Për Feniksin

Kështu ja dhashë emrin grupit unë, por ju mund të përdorni çfarëdo lloj emri tjetër; nuk është me rëndësi. Shumë shpejtë marrim Rectangular Marquee Tool me përmasa si në figurë.

Kliko për ta zmadhuar


Si për fillim e mbushim me ngjyrë #e7e7e7 dhe pastaj po këtij layeri i shtojmë disa efekte në Blending Options.

Kliko për ta zmadhuar


Kliko për ta zmadhuar


Kliko për ta zmadhuar


Tani e përfunduam atë dhe na kanë mbetur vetëm shkrimet dhe logo. Për shkrimin në fillim me titull “Feniksi.com – Thesari i njohurive” kam vendosur keto permasa:



Si po e shihni të gjitha tekstet janë të ngjitura pas vijës ndihmëse dhe* japin një pamje shumë më të bukur. Në titull fjala “Thesari” është bërë me ngjyrë #f6a328.* Asgjë tjetër nuk na mbetet përveç se të vendosim edhe logon e Feniksit, që mund t’a merrni direkt nga faqja Feniksi.com lart tek koka, dhe ta vendosni diku.

Feniksi Staf

Krijoni nje grup me emrin autorët dhe pas kësaj zgjidhni Brush dhe vendosni opsionet:



Lini pak hapsirë nga fusha e “Për feniksin” dhe mundohuni të jeni sa më të saktë dhe të tërhiqni një vijë horizontale nga vija e parë ndihmëse deri tek e dyta. Largohuni më poshtë dhe shkruani “Kush qëndron mbrapa Feniksit?” me Arial Regular, 18pt, #b0b0b0. Bëjeni një grup me emrin “Personat” që të mos na perzihen gjërat dhe pastaj merrni përsëri Rectangular Marquee Tool me përmasa Width: 86px dhe Height: 86 px. Katrorin vendoseni pak më poshtë vijes me pika dhe të ngjitur me vijën e parë ndihmëse. Këtë mbusheni me ngjyrë #cccccc dhe vendosni ndonjë foto te çfarëdoshme (unë mora si shembull 3 nga autorët e Feniksit). Bëni kujdes dhe mundohuni t’i vendosni fotot me madhesi sa katrori dhe të lini anash pak hapësirë që të shihet ngjyra e hirit.

Bëni nje tekst anash. Teksti duhet të jetë Arial Regular, 12pt, #7a7a7a dhe emrin e autorit bëjeni bold me një ngjyrë më të errët. Gjithashtu edhe shkrimin “Feniksi staf”* bëjeni Arial Regular, 12pt, #f6a328.

Bëjeni Duplicate grupin dy herë vetëm se ndryshoni shkrimet dhe foton dhe mundohuni ti largoni nga njëra tjetra.

Pas këtyre, vijën e parë që krijuam (vijën me pika) bëjeni duplicate dhe bëjeni Edit>Transform>Rotate 90CW. Mundohuni t’a vendosni në mes të vijës së tretë dhe të katërt ndihmëse. Gjithashtu, një pjesë duhet të fshihet që të jetë më e vogël. Prapë vijen e parë bëjeni duplicate dhe këtë vendoseni pak përfundi Autorit të tretë.

Projektet e fundit

Thjesht bëjeni një grup me këtë emër, vendoseni nje titull psh si: “Kush qëndron mbrapa Feniksit?” ngjitur me vijën e dytë ndihmëse. Gjithashtu një foto dhe në Blending Options vendosjani 1, 0, 1 me ngjyre te zezë dhe opacity 75%. Për pak zbukurim vendosni edhe dy rrathe të vegjël, dy shigjeta dhe një shkrim me Myriad Pro 14 pt #7a7a7a.

Ofertat

Si perherë krijoni një grup me emrin ofertat. Kapni Rectangular Marquee Tool me përmasa Width: 250px dhe Height: 10 dhe bëjeni një hapsirë të cilën e mbushni me ngjyrën #949494.

Teksti si me poshtë:



Tani atë hapësirën që bëmë pak më lartë bëjeni duplicate dhe vendoseni pak më poshtë. Këtë bëjeni duplicate dy herë dhe vendosini me një hapësirë të vogël nga njëra-tjetra deri sa te përputhen me vijat ndihmëse 1 dhe 2.

Këmbët

Pak punë merrni atë vijën me pika që e krijuam më lartë, bëjeni duplicate dhe vendoseni pak para fundit. Në fund shtoni nje tekst copyright.

Përfundimi

Kjo ishte gjithçka rreth mësimit. Si guidë e parë, shpresoj të jem shpjeguar mirë dhe t’ju kem ndihmuar në hapat tuaj të parë në dizenjimin për web. Rezultati përfundimtar është i thjeshtë, por qëllimi i guidës është të mësojë fillestarët që nuk kanë shumë eksperiencë.

Komentet, kritikat dhe sygjerimet janë të mirë pritura.

Ndërtoni një Dizenjo Web të Pastër është një postim nga: Feniksi.Com - Thesari i Njohurive



Forum-Al.com
Aty ku shqiptarët mblidhen!
 
Top