Održavanje dosljednosti u vašem dizajnu sučelja

Dosljednost u dizajnu korisničkog sučelja stari je princip škole i pomalo se zaboravlja u nekim današnjim dizajnom web-aplikacija i aplikacija. Čini se da dizajneri odlučuju izostaviti dosljednost iz svojih sučelja.

U slučaju dizajna mobilnih aplikacija, neki dizajneri odlučuju iznova izumiti, ponovno stvoriti ili čak potpuno prekinuti standardne interakcije hardvera s vlastitim jedinstvenim obrascima sučelja. Iako kršenje konzistentnosti pravila hardverskog sučelja i iskustva s vašim aplikacijama možda nije loša ideja, može biti narušavanje dosljednosti vlastitih aplikacija.

Tri koraka do konzistentnog dizajna sučelja

U osnovi postoje tri vrste dosljednosti o kojima biste trebali razmisliti prilikom dizajniranja dizajna vaših web i mobilnih aplikacija:

• 1. Pridržavajte se smjernica i načina ponašanja na korisničkom sučelju
• 2. Ostanite dosljedni ostalim sličnim web mjestima ili aplikacijama
• 3. Ostanite dosljedni svom vlastitom dizajnu

U svrhu ovog članka želio bih se više usredotočiti na treći - zadržavanje dosljednosti u vlastitom korisničkom sučelju. Ovo je velika stvar uglavnom zato što ne želite zbuniti ili iznenaditi korisnike unutar vlastite aplikacije.

Ne želite da korisnik s vaše početne stranice pređe na podstranicu i vidi različite stilove ili čak vrlo različite interakcije korisnika. Ovakva stvar može iznenaditi korisnike ili ih, u nekim slučajevima, čak i preplašiti. Dosljednost nije samo velika stvar za cjelokupnu iskoristivost web mjesta, već može uvelike povećati i konverziju.

Dosljedna struktura i interakcije

Ovo je ključno za stvaranje konzistentnog sučelja. Ponekad kad se razvijamo zaboravljamo kako će struktura i interakcija utjecati na cjelokupno korisničko iskustvo. No, jednako kao što su nacrt i izrada planova važni prilikom gradnje kuće ili zgrade, također je važno za stvaranje konzistentnog i korisnog korisničkog sučelja. Treba razmisliti i isplanirati nekoliko stvari prije nego što počnete pisati kôd.

• 1. Razmislite kako dosljedno postavljati elemente na svoju web lokaciju ili u aplikaciju.
• 2. Razmislite koje ćete modele korisničkog sučelja koristiti.
• 3. Isplanirajte potrebne elemente za unos.
• 4. Otkrijte koje će vam ikone trebati, a zatim odaberite i dizajnirajte dobar set ikona koji ih sve pokriva.

Postavljanje elemenata ogroman je način da se smanji iznenađenje korisnika i stvori dosljedna, pouzdana očekivanja. Držite navigaciju na istom mjestu, ništa ne iritira korisnika brže od pomicanja ili nestajanja navigacijskih elemenata. Također logotipove i ostale predmete robne marke držite na istim mjestima na web mjestu.

"Ništa ne iritira korisnika brže od pomicanja ili nestajanja navigacijskih elemenata"

Ako koristite bočnu traku, nemojte je jako pretresati bočnom trakom mijenjajući ono što je u njima prikazano sa stranice na stranicu. Nešto od toga može biti relevantno za sadržaj na stranici, ali izbjegavajte uklanjanje ili čak premještanje ukupnih elemenata uvoza, poput oblika pretraživanja. Jedna velika stvar koju se treba dosljedno postavljati su veze ili gumbi za prijavu i postavke korisnika.

Razmotrite obrasce korisničkog sučelja

Planirajte unaprijed i razmislite koji će vam obrasci korisničkog sučelja trebati. Trebat će vam galerija? Modals? Harmonika? Naznake? Planiranje obrazaca dizajna unaprijed ne samo da će vam pomoći da brže razvijate i dizajnirate svoju aplikaciju, već razmišljanje o tome koji će vam obrasci dizajna trebati također pomaže u otkrivanju vašeg sadržaja prije vremena - što vam može uštedjeti i vrijeme.

Ovo će također riješiti probleme i odgovoriti na pitanja prije vremena, na taj način kada dođete na odjeljak ili stranicu na vašoj web lokaciji koja zahtijeva odluku o korisničkom sučelju, to ste već napravili i nećete biti uhvaćeni u stvaranju rušila dizajnerskih obrazaca. na cijeloj vašoj web lokaciji.

Zamislite i svoje obrasce prije ruke. Isplanirajte elemente oblika koji će vam trebati i pronađite elemente koji vam nisu potrebni ili koje biste mogli zamijeniti. Elementi obrasca mogu biti zastrašujući ili čak složeni za navigaciju korisnika, pa ako možete ukloniti ili zamijeniti neke unose koji mogu biti kamen spoticanja, učinite to.

"Ako možete ukloniti ili zamijeniti neke ulaze koji mogu biti kamen spoticanja, učinite to."

Ovo je ujedno i izvrstan način uklanjanja odluka iz procesa razvoja. Održavanje obrazaca u stilu, strukturi i interakciji ponekad može dovesti ili prekinuti stopu konverzije.

Opet, planirajte glavu. Planirajte koje će vam ikone trebati prije vremena. Jedan super brz način da popravite dosljednost jest biti na pola puta kroz razvoj vaše aplikacije kada otkrijete da će vam trebati ikone za ispis, a zatim shvatite da se ne možete sjetiti odakle su vam ikone ili čak ako možete pronađite ikonu za ispis koja odgovara ostatku vaših ikona.

To uopće nije problem stila, već interaktivan. Korisnici će se naviknuti na izgled određene ikone i moći će ih brzo prepoznati. Ali ako koristite set ikona patchwork-a, zbunit ćete korisnika ili im čak i teško reći što predstavljaju određene ikone.

Dosljedan stil

Stil i dizajn svakog UI elementa je važan, a korisniku je također održana dosljednost. Baš kao što je važno da se postave dosljedne ikone, važno je da vaša aplikacija ima svu dosljednost dizajna. Možda mislite da su određeni gumbi u redu iako se ne približavaju dizajnu ili shemi boja web mjesta, ali to će zbuniti vašeg korisnika i izgledati ružno.

Prilikom dizajniranja UI kompleta imajte na umu nekoliko stvari kako biste stvorili dosljednost:

• 1. Shema boja
• 2. Stil
• 3. Granice
• 4. Upišite i fontove
• 5. Veličina
• 6. Pozadinske slike
• 7. Učinci

boje

Kao što sam već rekao, držite svoju boju sučelja u skladu s cijelom shemom boja vaše web stranice. Čak i prilikom dizajniranja poziva na radnje u kojima želite da se gumbi istaknu i primijete, budite oprezni da vaš poziv na akciju ne bude ružan kompliment za vašu shemu boja. Da bi vam pomogli, upotrijebite alate poput Kulera ili ColorSchemera kako biste pomogli u odabiru boja koje dobro idu zajedno.

Kad govorim o održavanju dosljednog stila, govorim o tome da ne koristim neki ludi gradijentni gumb sa kapljicama i sjenkama ako je ostatak dizajna web mjesta ravan i nema sjenu ili gradijent. Osim što ostajete u skladu s cjelokupnim dizajnom web mjesta, budite dosljedni stilu vaših UI elemenata. Ako na svojim ulaznim naljepnicama koristite određenu boju ili stil fonta, držite se toga i koristite ga na svim oznakama.

granice

Ahh, granice. Prečesto vidim web stranice koje koriste tri ili četiri različite debljine ili radijusa obruba gumba i to zaista može biti zbunjujuće. Pridržavajte se svih granica na gumbima, ulazima, odabirima, galerijama, slikama i svim ostalim elementima korisničkog sučelja. To ne znači da morate koristiti granični obrub, možete ga miješati s nekoliko vrijednosti ili čak koristiti jedan stil dosljedno za svaki element.

Vrsta i fontovi

Korištenje iste vrste i fontova u vašim elementima prilično je važna stvar, posebno kada se radi o elementima oblika. Držite zaglavlja dosljednima i ne upotrebljavajte se za mnoge fontove iako biste im se mogli svidjeti svi - možete ih spremiti za druge projekte. Unosi i gumbi trebaju imati stilove fonta koji se međusobno podudaraju ili nadopunjuju tako da se obrasci lako čitaju i mogu predvidjeti.

Veličina

Veličina fontova i ostalih elemenata treba biti međusobno konzistentna ili besplatna. Zaglavlja i naslov stranica trebaju ostati dosljedni kako bi korisnik znao da se ti redovi teksta u stvarnosti podudaraju zaglavlja i naslova. Dosljedna veličina također se odnosi na bilo koji UI element iz područja sadržaja, veza, navigacijskih elemenata ili bočnih traka. Izbjegavajte da mijenjate bilo koje veličine da biste drastično stajali između prikaza stranica kako bi ih korisnik mogao odmah prepoznati kada se stranica učita.

Pozadinske slike

Pokušajte ne mijenjati previše pozadinskih slika. To se danas ne događa mnogo ranije, ali je ipak dobra ideja da izbjegavate mijenjanje pozadinskih slika iz prikaza stranice u prikaz stranice. Ako to učinite, pokušajte nekako učiniti sliku međusobno relabilnom kako stranice ne bi izgubile konzistentnost. Promjena pozadinske slike, posebno velike, može učiniti web mjesto nesretnim i učiniti da se korisnik osjeća kao da vas je čak potpuno napustio, pa zaista pokušajte izbjeći ovo iskušenje.

efekti

Učinci, što je najvažnije svjetlosni efekti, korisniku mogu učiniti da dizajn izvrsnih stranica uopće nema smisla. Na primjer, ako koristite žarulju na gumbu koja izgleda kao da iznad nje svijetli svjetlo, upotrijebite isti efekt osvjetljenja na kosom tekstu u gumbima ili urezanim unosom teksta.

Iskreno, ovo zaista nije prevelika zarada ili ne može pokvariti posao s korisnikom, ali probirljivi gledatelji mogu primijetiti nedosljednost vaših učinaka i odvratiti pažnju od onoga što bi trebali učiniti s vašom aplikacijom ili web-lokacijom.

Ne budi dosadna

Dizajniranje za dosljednost ponekad se može činiti dnevnim ili čak dosadnim, a možda samo želite baciti nešto u svoj dizajn kako biste korisnika iznenadili, i zaista je to sjajno.

Korisnike je dobro držati na nožnim prstima, jsut ne pretresaju stvari toliko da se toliko obeshrabre ili zbune da odlaze i odlaze negdje drugdje. Mala konzistencija može proći dug put.