Glosar de legi UX

Legea lui Fitts spune că timpul necesar pentru a atinge o țintă crește cu distanța până la ea și scade cu mărimea ei. Formulată de Paul Fitts în 1954, e cea mai folosită lege de UX pentru că se traduce direct în pixeli: un buton mic și departe de degetul mare costă timp și generează atingeri ratate.

Ce verificăm în audit

O verificăm măsurând programatic dimensiunea fiecărei ținte interactive și comparând-o cu pragul de 44×44 pixeli CSS. Sub acest prag, rata de atingeri ratate crește vizibil pe mobil, iar pentru utilizatorii cu mobilitate redusă ținta devine practic inaccesibilă.

Exemplu concret

Punctele de navigare ale unui carusel („dots") desenate la 8×8 pixeli. Sunt vizibile, dar practic imposibil de atins cu degetul de prima dată. Reparația nu e mărirea punctului colorat, ci mărirea zonei de atingere din jurul lui la 44×44.

Legea lui Hick spune că timpul de decizie crește logaritmic cu numărul de opțiuni prezentate simultan. Cu alte cuvinte, fiecare opțiune în plus dintr-un meniu nu ajută utilizatorul să aleagă mai bine, ci îl face să aleagă mai greu — sau să nu aleagă deloc.

Ce verificăm în audit

Numărăm opțiunile simultan vizibile în meniul principal, în listele de produse și în selectoarele din formulare. Peste șapte-opt intrări fără grupare, meniul devine o listă de scanat, nu o hartă de navigat.

Exemplu concret

Un meniu principal cu 11 intrări de nivel unu, fără dropdown-uri. Vizitatorul citește tot rândul înainte să decidă, iar pe mobil îl parcurge pe verticală. Reparația e gruparea în 4–5 categorii cu submeniu, nu ștergerea conținutului.

Legea lui Miller spune că memoria de lucru a unui om ține aproximativ 7±2 elemente simultan. E motivul pentru care listele lungi nememorabile trebuie grupate („chunking") în blocuri mai mici, cu sens propriu.

Ce verificăm în audit

Se aplică peste tot unde utilizatorul trebuie să țină minte ceva între doi pași: câmpuri de formular, pași de checkout, criterii de comparație între pachete. Dacă trebuie să derulezi înapoi ca să-ți amintești ce ai ales, structura depășește capacitatea reală de procesare.

Exemplu concret

Un formular de comandă cu 14 câmpuri pe un singur ecran, fără grupare vizuală. Aceleași 14 câmpuri, împărțite în trei blocuri etichetate — date de contact, livrare, plată — se completează mai repede și cu mai puține erori.

Legea lui Tesler, numită și legea conservării complexității, spune că orice proces are o cantitate ireductibilă de complexitate: ea nu dispare, ci doar se mută. Ori o preia sistemul printr-un design mai inteligent, ori o preia utilizatorul prin mai mulți pași și mai multe decizii.

Ce verificăm în audit

E criteriul cu care judecăm „simplificările" care de fapt mută munca în altă parte. Un formular cu mai puține câmpuri care apoi cere un telefon de clarificare nu e mai simplu, doar a mutat complexitatea în afara ecranului.

Exemplu concret

Un magazin care elimină câmpul de județ din adresă pentru a scurta formularul, dar apoi calculează greșit costul livrării. Reparația corectă e deducerea automată a județului din codul poștal — sistemul preia complexitatea, nu utilizatorul.

Efectul Von Restorff, sau efectul de izolare, spune că elementul vizual diferit de restul este cel observat și reținut primul. Descris de Hedwig von Restorff în 1933, e baza teoretică a oricărei ierarhii de acțiuni dintr-o pagină.

Ce verificăm în audit

E criteriul cu care verificăm dacă acțiunea principală a paginii chiar iese în evidență. Dacă butonul primar, cel secundar și linkurile din jur au aceeași greutate vizuală, pagina nu are o acțiune principală — are trei sugestii.

Exemplu concret

Trei butoane de aceeași mărime și aceeași culoare în hero: „Cere ofertă", „Vezi portofoliul", „Despre noi". Niciunul nu e izolat, deci niciunul nu e observat primul. Reparația e un singur buton plin, restul ca linkuri text.

Efectul de poziție serială spune că, dintr-o listă, oamenii rețin cel mai bine primul element (efect de primacy) și ultimul (efect de recency), iar cel mai prost pe cele de la mijloc. Se aplică la meniuri, liste de beneficii, pași de proces și tabele de prețuri.

Ce verificăm în audit

Verificăm ce elemente au fost plasate la mijlocul listelor importante. Un beneficiu decisiv sau o intrare de meniu care aduce venit, îngropate în poziția patru din șapte, sunt dezavantajate structural, indiferent cât de bine sunt scrise.

Exemplu concret

Un meniu în care „Prețuri" e al patrulea din șapte iteme. Mutat pe ultima poziție, înainte de butonul de contact, devine unul dintre cele două elemente reținute din tot rândul.

Efectul Goal-Gradient spune că motivația de a termina un proces crește pe măsură ce utilizatorul se apropie de final. Consecința practică: dacă oamenii văd cât mai au de parcurs, abandonează mai rar decât dacă parcurg un proces de lungime necunoscută.

Ce verificăm în audit

Căutăm indicatorul de progres în orice proces cu mai mult de doi pași: checkout, formular lung, configurator, înscriere. Lipsa lui nu e o problemă cosmetică, e o cauză directă de abandon la jumătatea drumului.

Exemplu concret

Un checkout în patru pași fără niciun indicator. Utilizatorul care a completat adresa nu știe dacă mai are un pas sau patru. Un simplu „Pasul 2 din 4" în antet schimbă calculul de abandon, fără să schimbe nimic altceva.

Efectul Aesthetic-Usability spune că un design perceput ca frumos e perceput și ca mai ușor de folosit, chiar dacă nu este. Documentat de Masaaki Kurosu și Kaori Kashimura în 1995, explică de ce un polish vizual bun poate masca probleme reale de structură.

Ce verificăm în audit

E motivul pentru care un audit nu se poate face doar din impresie vizuală. Separăm explicit nota de design vizual de cea de UX și navigare, tocmai ca un site frumos cu structură proastă să nu primească un scor umflat.

Exemplu concret

Un site cu tipografie excelentă și fotografie profesionistă, la care utilizatorii nu găsesc pagina de prețuri. În teste, oamenii își reproșează lor înșiși că nu au găsit-o — efectul estetic mută vina de la interfață la utilizator.

Principiile Gestalt sunt regulile după care ochiul grupează automat elementele izolate într-un întreg: proximitate, similaritate, continuitate, figură-fond, închidere și regiune comună. Formulate de psihologia germană a formei la începutul secolului XX, ele descriu gruparea vizuală înainte de orice interpretare conștientă.

Ce verificăm în audit

Le folosim ca să explicăm de ce o secțiune „arată aglomerat" în termeni verificabili. Cel mai des încălcat e principiul proximității: eticheta unui câmp e la fel de departe de câmpul ei ca de câmpul următor, deci gruparea percepută e greșită.

Exemplu concret

Un formular în care spațiul dintre etichetă și input e de 16 pixeli, iar spațiul dintre câmpuri e tot de 16 pixeli. Ochiul nu mai știe ce etichetă aparține cărui câmp. Reparația e 6 pixeli în interiorul grupului și 28 între grupuri.

F-pattern și Z-pattern sunt două tipare orientative de scanare vizuală. F descrie modul în care oamenii parcurg conținut dens și nestructurat — două treceri orizontale în partea de sus, apoi o coborâre pe marginea stângă. Z descrie parcurgerea unei pagini simple, cu puțin conținut, în diagonală.

Ce verificăm în audit

Le tratăm ca ipoteze de verificat, nu ca legi. Sunt utile ca să întrebăm dacă informația decisivă a fost pusă acolo unde ochiul chiar trece — nu ca să justificăm o anumită așezare în grilă.

Exemplu concret

Un beneficiu-cheie plasat în colțul din dreapta-jos al unui bloc de text lung. În tiparul F acea zonă e cea mai puțin parcursă. Mutat în primul rând al blocului, același text e citit de mult mai mulți oameni.

„Above the fold" este zona paginii vizibilă imediat, înainte de orice derulare. Termenul vine din presa tipărită, unde conta ce se vedea pe jumătatea de sus a ziarului împăturit, și e relevant și azi pentru că decide ce vede un vizitator în primele secunde.

Ce verificăm în audit

Aici aplicăm testul de cinci secunde: dacă, după cinci secunde, vizitatorul nu poate spune ce vinzi, cui și ce urmează să facă, zona nu își face treaba. Se verifică separat pe desktop la 1440 de pixeli și pe mobil la 375.

Exemplu concret

Un hero care ocupă tot ecranul cu o fotografie și un slogan abstract, iar propunerea de valoare reală apare abia după primul scroll. Pe mobil, unde zona vizibilă e mult mai mică, efectul e și mai puternic.

Contrastul WCAG AA este pragul minim de lizibilitate dintre text și fundalul lui, definit de Web Content Accessibility Guidelines: 4,5:1 pentru text normal și 3:1 pentru text mare (peste 24 de pixeli, sau 18,66 de pixeli îngroșat). Pentru componente de interfață și grafice esențiale, pragul este tot 3:1.

Ce verificăm în audit

Îl măsurăm programatic, nu îl estimăm din captură: extragem culoarea reală a textului și a fundalului efectiv și calculăm raportul. Un verdict de contrast fără cifră măsurată nu intră în raport.

Exemplu concret

Text gri deschis pe fundal alb, la un raport de 3,1:1. Arată elegant pe ecranul designerului și devine ilizibil pe un laptop cu luminozitate redusă sau afară, în soare. Reparația e o singură valoare de culoare schimbată.