Nemanja Srećković

Evo je moj drugi tekst na temu procesa interfejs dizajna ili jednostavnije rečeno o procesu nastanka dizajna web stranice, tačnije prototipa tj. Mockup-a.

Ovaj tekst možete posmatrati kao reviziju prvog teksta, usled motivacije zajednice i želje da malo smislenije razmenim iskustvo sa čitaocima bloga.

Kreiranje web stranice/aplikacije možemo podeliti na tri osnovna koraka, kojima predhodi detaljno planiranje:

• Kreiranje interfejsa/dizajna
• Kreiranje Frontend-a
• Kreiranje Backend-a

Kreiranje interfejsa/dizajna

Kreiranje prototipa dizajna je po mom mišljenju najzahtevniji deo procesa kreiranja web stranica ili aplikacije. Prototip tj.Mockup možemo kreirati na dva načina:

• Koristeci grafički program
• Direktno u html-u

Proces kreiranja Mockup-a

Prvi korak bi bio kreiranje dokumentacije, koja bi predstavljala specifikaciju projekta. Savršeno bi bilo kad bi klijent unapred imao spremnu specifikaciju projekta, no to uglavnom nije slučaj. Klijent nam uglavnom dolazi sa idejom koju želi da realizuje ili problemom koji treba da reši. Posto pronađemo rešenje prelazimo na strukturu.

Rešenje problema ? Klijent nam uglavnom dolazi sa idejom koju želi da realizuje ili problemom koji treba da reši.
Klijent želi da postigne određeni cilj. Da realizuje neku ideju ili da reši neki problem. Upravo je to ono što treba da Vas izdvoji iz mase drugih, rešite problem, i pokušajte da unapredite poslovanje Vašeg klijenta. Trenutno kod nas i u okruženju se na izradu web prezentacije gleda kao trošak, a ne kao na ulaganje (u večini slučajeva).

Sledeči korak bi bio da se kreira struktura (site map?) prezentacije/aplikacije, zgodan program koji možete koristiti u ove svrhe je npr. MS Visio. Naravno i ovo možete uraditi ručno u nekom vektorskom programu. Ovde već počinjemo da razmišljamo o mockup-u kao o grafičkoj ideji, o samom dizajnu. Prvi korak je da uobličimo sam raspored elementa na stranici, a zatim pređemo na kreativno uobličenje svega u jednu grafičku celinu koja ustvari predstavlja dizajn.U ovom delu procesa možemo razdvojiti kreiranje wire-a i samog mockup-a. Html wire kreiramo da bi klijent a i mi sami ispitali (potvrdili?) strukturu sajta. Rezultat procesa je mockup, koji zajedno sa kreiranom dokumentacijom ide na uvid kod klijenta.