UI wireframe je vizualni prikaz dizajna korisničkog sučelja (UI) koji ocrtava osnovnu strukturu i izgled web ili mobilne aplikacije. To je mockup niske vjernosti ili kostur konačnog dizajna koji prikazuje položaj različitih elemenata dizajna, kao što su gumbi, izbornici, obrasci i slike, na ekranu.
Žičani okviri korisničkog sučelja važni su iz nekoliko razloga:
Žičani okvir korisničkog sučelja najbolje je koristiti u ranim fazama procesa dizajna. Dizajneri obično započinju stvaranjem nekoliko okvira niske vjernosti kako bi istražili različite opcije izgleda i ponavljali dizajn na temelju povratnih informacija dionika. Nakon što se odabere konačni dizajn, izrađuju se precizniji okviri ili modeli kako bi se pružilo više detalja i bolji dojam konačnog proizvoda. Te žičane okvire potom koristi kao referencu razvojni tim tijekom faze implementacije.
Žičani okvir korisničkog sučelja obično uključuje sljedeće elemente:
Kada dizajnirate izgled nove stranice ili redizajnirate postojeću, važno je pridržavati se sustava rešetki. Podijelite svoj žičani okvir u mrežu i pobrinite se da vaše slike, tekst i poziv na radnju dobro pristaju unutar mreže. To ne znači da svaka imovina bude iste veličine, to znači da neka budu međusobno proporcionalna.
Pogledajte sav razmak koji imate između dijelova teksta ili gumba. Sada udvostručite. Uvijek je bolje imati više prostora između odlomaka ili slika nego da izgledaju zbijeni. Korisnici neće biti obeshrabreni zbog puno praznog prostora (u razumnom roku), ali će se brzo osjećati preplavljenim i zbunjenim slikama naslaganim jedna na drugu.
Testirajte svoju stranicu sa stvarnim korisnicima. Upamtite da vas vaš tim za dizajn, tehnologiju i razvoj proizvoda može dovesti samo tako daleko. Morate poslušati povratne informacije stvarnih korisnika i pratiti njihove radnje koje poduzimaju s vašom novom shemom korisničkog sučelja. Je li korisnicima teško pronaći određeni gumb? Učinite ga većim. Je li slika prevelika za korisnike prijenosnih računala? Učinite svoju stranicu osjetljivijom. Testirajte svoju stranicu i iterirajte u skladu s tim.
Da, svatko može stvoriti UI wireframe. Međutim, važno je imati na umu da su žičani okviri ključni dio procesa dizajna i zahtijevaju osnovno razumijevanje načela dizajna korisničkog sučelja i najboljih praksi.
Ne, okviri korisničkog sučelja obično su niske kvalitete i ne uključuju konačne elemente vizualnog dizajna kao što su detaljna tipografija, sheme boja ili elementi marke. Međutim, oni mogu uključivati osnovne vizualne znakove kako bi dali opći osjećaj konačnog smjera dizajna.
Broj ponavljanja UI wireframesa ovisi o složenosti projekta i potrebnoj razini detalja. Dizajneri obično stvaraju više žičanih okvira niske vjernosti prije nego što se odluče za konačni dizajn, a zatim stvaraju žičane okvire veće vjernosti ili modele kako bi pružili više detalja. Nije neuobičajeno da dizajneri također ponavljaju dizajn tijekom procesa razvoja.