Conţinut
- 1. Nu marcați câmpurile obligatorii
- 2. Nu utilizați filatori
- 3. Aveți un singur tip de buton sau mai bine doar un singur buton pe formular
- 4. Câmpuri de bucăți
- 5. Gândiți-vă de ce întrebați ceva și cum se simte pentru utilizator
- 6. Datele sunt băieți mici
- 7. Formulare ca ambarcațiuni pentru dezvoltatori
- 8. Nu utilizați coloane în formulare
- 9. Nu utilizați două câmpuri atunci când unul va face acest lucru
- 10. Fii drăguț
Forme, mulți designeri nu urăsc decât formele. Nu scot neapărat creativitatea sau nu? Poate că este timpul să analizăm din nou formularele și să înțelegem că un formular, cel mai de bază, este o conversație între utilizator și software.
Uitați de punct și faceți clic, formularele reprezintă cea mai bogată interacțiune cu care ne vom confrunta, în calitate de designeri digitali. Data viitoare când vine un formular, nu credeți că este doar o chestiune de a aplica câteva efecte CSS frumoase sau de a adăuga un jQuery înfloritor frumos. Există mult mai multă profunzime în proiectarea formularelor.
Utilizatorii am testat sute de formulare și am conceput câteva formulare complexe pentru companiile de asigurări, interacțiuni de rezervare de vacanță și multe altele. Sunt șanse să fi folosit unul dintre formularele mele în ultimele luni.
Iată lecțiile pe care mi-aș fi dorit să le învăț înainte de a începe să proiectez formulare.
1. Nu marcați câmpurile obligatorii
Știți micul asterisc care denotă un câmp obligatoriu? Am văzut că eșuează de multe ori la testarea utilizatorilor. Ca concept, câmpurile obligatorii nu au prea mult sens, nu au echivalent offline. Sunt minunate pentru dezvoltatori, deoarece oferă o abordare frumoasă alb-negru până la finalizare. Asteriscul și câmpul obligatoriu eșuează deoarece este un comportament învățat. Comportamentul tipic pe care l-am văzut în testarea utilizatorului este ca utilizatorul să completeze formularul din partea de sus și să termine fie când există ceva care să îi oprească, fie să apese un buton.
Soluția este simplă, marcați câmpurile opționale, marcați locul în care drăguțul nostru utilizator trebuie să se oprească și gândiți-vă dacă trebuie să completeze acel câmp.
2. Nu utilizați filatori
HTML5 este genial, nu-i așa? Oferă o mulțime de noi instrumente strălucitoare și interesante pentru a vă juca. Trebuie să ne gândim la adecvarea noilor noastre jucării. Câmpul numeric include acum săgeți în sus și în jos pentru a permite utilizatorului să parcurgă numerele.
Există două probleme aici. În primul rând, afișarea implicită a săgeților în browser le face foarte mici. Foarte greu de făcut clic și grăsimea degetelor dintre noi se va lupta pe un iPhone. Se numește Legea lui Fitt, cu cât este mai mic ceva, cu atât este mai greu să dai clic pe el.
Dar te aud strigând, poți doar să tastați numărul direct în câmpul numeric. Da, puteți, dar să vedem ecranul browserului, săgețile rotative sus / jos seamănă cu prietenul nostru de încredere în caseta de selectare. Un utilizator prezentat cu un filator pentru prima dată va presupune, întrucât seamănă cu o casetă de selectare, că nu poate introduce în el.
Sfatul meu este să vă îndreptați până când devin un loc mai obișnuit sau când dezvoltatorii de browsere sortează designul implicit.
3. Aveți un singur tip de buton sau mai bine doar un singur buton pe formular
Există un principiu de psihologie puțin cunoscut numit Legea lui Hick. Legea lui Hick afirmă că cu cât ni se oferă mai multe opțiuni, cu atât este mai greu să alegem. Știu nu știința rachetelor, ci o regulă demnă de reținut.
Îți poți ajuta drăguțul utilizator ajutându-l să facă o alegere. Făcând toate butoanele principale o culoare și având doar unul dintre ele pe pagină, alegerea este mai ușoară. Care este butonul pe care ar trebui să-l lovesc? Oh, este ușor, este cel mare colorat.
4. Câmpuri de bucăți
Am studiat neuroștiința într-o viață anterioară și așa am studiat psihologia memoriei - în special pe termen scurt sau memoria de lucru. Acum, înainte de a o spune; nu, capacitatea de memorie pe termen scurt nu este de 7 +/- 2, 4 +/- 1 sau la om vorbesc trei până la cinci bucăți. Noi, ca oameni, suntem buni la evaluarea stimulilor vizuali, constrângerea este că suntem mai buni atunci când numărul este mai mic. Distribuirea unui formular în grupuri mai mici face evaluarea mai ușoară, deoarece deseori ceea ce utilizatorul trebuie să introducă în formular provine din memoria sa.
Asigurați-vă că grupurile dvs. de câmpuri au o lungime de aproximativ patru.
5. Gândiți-vă de ce întrebați ceva și cum se simte pentru utilizator
Acesta este probabil cel mai drept sfat pe care îl dau, dar este adesea cel mai puțin utilizat.
Să luăm următoarele:
Întrebați fiecare întrebare pe care o puneți Este necesar? Cum te simți când ți se cere asta?
De cele mai multe ori există o nevoie de afaceri de a pune o întrebare și noi, ca designeri, putem argumenta despre necesitate până când suntem albaștri la față. Întrebarea trebuie pusă. Înțelegând nevoia de afaceri pentru aceste date, putem face adesea compromisuri.
Vă putem ajuta spunându-i prietenului nostru utilizator de ce trebuie să punem această întrebare. Liniștește-te cu privire la utilizarea și partajarea acestor date și fii în general frumos.
Luând din nou exemplul nostru:
Este încă o întrebare dificilă, dar sperăm că am îndulcit pastila.
6. Datele sunt băieți mici
Introducerea datelor poate fi o adevărată provocare și există câteva capcane pe care le puteți evita. Cea mai mare problemă este tratarea erorilor.
Cea mai ușoară abordare este lansarea unui calendar. Este demn de remarcat faptul că săptămânile încep într-o zi de luni în Marea Britanie și duminică în SUA. Dacă utilizatorul dvs. nu se concentrează, poate selecta o duminică atunci când înseamnă o luni.
De asemenea, merită menționat formatele de date internaționale. SUA ocupă prima lună, în Japonia este primul an. Deci, o dată precum 4/5/12 ar putea fi interpretată în trei moduri.
De aceea, cel mai bine este să folosiți casete selectate.
7. Formulare ca ambarcațiuni pentru dezvoltatori
Formularele sunt realizate atât pentru dezvoltatori, cât și pentru designeri. Înțelegerea posibilelor greșeli care ar putea fi făcute cu introducerea datelor și proiectarea codului dvs. back-end pentru a face față este o provocare.
Iată una simplă. Introducerea unei valori valutare. Posibilele greșeli pe care le-ar putea comite utilizatorul sunt uriașe. Forțarea formatelor de date pe care utilizatorii trebuie să le îndeplinească este frustrant pentru utilizatorul dvs. și, să recunoaștem, este puțin leneș din partea dezvoltatorilor.
Ce provocare mai bună pentru un dezvoltator decât crearea unui formular antiglonț.
8. Nu utilizați coloane în formulare
Marea problemă în utilizarea coloanelor în formulare este fluxul. Începem un formular în partea de sus și terminăm în partea de jos. În introducerea coloanelor fluxul formularului poate fi întrerupt.
Nu presupuneți fila utilizatorilor prin intermediul formularelor și, prin urmare, focalizarea este o modalitate de navigare a formularelor în coloane. Este rar că am văzut asta la testarea utilizatorilor. De cele mai multe ori vedem introduceți detalii, faceți clic pe câmpul următor cu mouse-ul / trackpad-ul / degetul, apoi introduceți detaliile și așa mai departe.
9. Nu utilizați două câmpuri atunci când unul va face acest lucru
Majoritatea oamenilor nu sunt dactilografi tactili. În testarea utilizatorilor, vedem oameni care privesc tastatura în timp ce scriu.
Când introduceți un număr de telefon împărțind câmpul formularului, spuneți că pentru a adăuga prefixul și numărul, cauzează probleme reale. Utilizatorii nu văd sau chiar își amintesc că există două câmpuri, așa că introduceți numărul complet în primul câmp, mai rău dacă câmpul este limitat la un anumit număr de caractere.
Folosiți doar un câmp pentru numărul de telefon, același lucru este valabil și pentru numărul de casă / stradă - utilizați doar o singură casetă de introducere a textului.
10. Fii drăguț
Ați fi surprins de câte mesaje de eroare destul de nepoliticoase există acolo.
Iată un exemplu cu unul pe care l-am întâlnit recent.
Faptul în care vă sugerează că veți introduce de bunăvoie o întâlnire în viitor și apoi un răspuns destul de plăcut, ei bine, nu este foarte frumos.
Puneți-vă din nou în locul utilizatorului, cum v-ați simți văzând această eroare? Enervat? Poate și mai rău. A fi drăguț este ușor.
Am produs un pătuț descărcabil / foaie de trucuri pentru a vă ajuta să proiectați formulare mai bune. Include mai multe modalități de bune practici pentru a proiecta formulare mai bune.
