KAJ JE WIREFRAME IN KAKO GA KAKOVOSTNO IZDELATI? 

Wireframe je ključen del pri izdelavi spletne strani – je shema/ načrt, ki bo vam, vašim programerjem in oblikovalcem pomagal pri razmišljanju o strukturi spletne strani, ki jo gradite. Isti zaslon je mogoče zgraditi na veliko različnih načinov, vendar bo le nekaj izmed njih učinkovito predstavilo vaše sporočilo potencialnim strankam ter jih nagovorilo k nakupu ali sodelovanju. Kaj je wireframe in kako ga izdelati si preberite v tem članku.

Določitev dobre strukture wireframa  je verjetno najpomembnejši del izdelave spletne strani.

ZAKAJ RABIMO WIREFRAME? ALI JE TO SAMO IZGUBA ČASA?

Če to delo opravite zdaj, preden je napisana koda in dokončana vizualna zasnova, boste prihranili veliko časa in bolečega preurejanja. Nizka realističnost in malo barv vas prisilijo, da se osredotočite na strukturo in ne na podrobnosti. Ko bo struktura dokončno oblikovana, bo veliko časa za vizualno oblikovanje. Design spletne strani vzame ogromno časa in truda, tako da se splača vnaprej podrobno splanirati, kaj od designa pričakujemo in na kakšni strukturi želimo design spletne strani graditi. 

V fazi izdelave wireframa je zelo normalno in pričekovano, da se bo wireframe veliko spreminjal. Vse pripombe so dobrodošle in ne bo nobenih zamer, če boste izrazili svoje mnenje. Dober wireframe bi pa moral idealno obstajati na podlagi predhodne raziskave user experience potencialnih strank.

KAKO ZAČETI WIREFRAME?

Poznamo tri glavne vrste wireframov: low-fidelity wireframes, mid-fidelity wireframes in high-fidelity wireframes. Najpomembnejši dejavnik, ki razlikuje med temi okvirji, je količina podrobnosti, ki jih vsebujejo. 

Low-fidelity wireframes so osnovne vizualne predstavitve spletne strani in običajno služijo kot izhodišče za oblikovanje. Kot take so običajno precej grobe, ustvarjene brez občutka za merilo, mrežo ali natančnost pikslov. 

Najpogosteje uporabljeni od treh wireframe konceptov – mid-fidelity wireframe, vsebuje natančnejše prikaze postavitve. Čeprav se še vedno izogibajo motečim elementom, kot so slike ali tipografija, je določenim sestavnim delom dodeljenih več podrobnosti, funkcije pa so med seboj jasno ločene.

Nazadnje, high-fidelity wireframes so že zelo natančni in se približujejo končnemu designu.

KATERA ORODJA SE UPORABLJAJO ZA IZDELAVO WIREFRAMOV?

Eno od najbolj znanih orodij za izdelavo žičnih načrtov je Sketch, ki uporablja kombinacijo artboardov in vektorskih oblik, da oblikovalcem omogoča enostavno ustvarjanje okvirjev. Lahko pa bi priporočili tudi orodje Balsamiq ali Figma, ki je prilubljeno med profesionalci.

V resnici pa lahko uporabite kakršnokoli spletno orodje, s katerim se da risati, noben pa ne reče, da nesmetel sploh pri začetni fazi, uporabiti običajni papir in svinčnik.

Izdelava wireframe-a vam bo koristila pri kvalitetni izdelavi spletne strani. Več boste naredili zasnovam, manj časa in denarja boste zapravili za končni design. Ali smo vam pomagali? Za kakršnakoli vprašanja smo vam vedno na voljo!