Influența comportamentului uman asupra deciziilor dvs. de proiectare - Jonas Arleth

Pentru a proiecta un aspect web bun, trebuie să înțelegem cum se comportă oamenii. Folosirea acestor cunoștințe pentru a planifica pașii următori cât mai confortabil este ceea ce face ca un design să fie eficient.
Dar ce o influențează? Cum înțeleg oamenii un site web? Există comportamente cunoscute pe care le putem adopta din viața reală?

comportamentului

În acest articol vă voi spune:

  • Cum să îi faci pe oameni să înțeleagă un aspect atunci când nu l-au mai folosit până acum
  • Ce culori atrag în mod specific mai multă atenție și de ce le percepem așa
  • Cât de larg ar trebui să fie un bloc de text și de ce
  • Ce animații ne ajută pe un site web
  • Cum vă puteți asigura că informațiile importante sunt văzute cu siguranță
  • Și cum puteți crește șansele ca un buton să fie cu siguranță făcut clic

Ascultați această postare ca podcast!

Cât de reușit are un produs sau serviciu depinde de cât de bine înțelegeți grupul dvs. țintă

Pentru a obține o utilizare ușoară, aspectul trebuie să vă mulțumească în primul rând pe utilizator, nu pe dvs. Trebuie să fie ușor de utilizat și vizitatorul trebuie să ajungă de la A la B fără să se gândească prea mult.

Când știm cine este utilizatorul și ce vrea, este și mai ușor pentru noi să declanșăm emoții. Pentru a face acest lucru, trebuie să înțelegem cum anumite lucruri sunt resimțite de oameni și de ce fac așa cum fac. În cel mai bun caz, un aspect este conceput atât de intuitiv încât utilizatorul poate rezolva sarcini fără întreruperi. O sarcină poate fi navigarea, dar și un proces de comandă într-un magazin online.

De îndată ce un utilizator începe să fie nevoit să gândească mai mult, el începe să nu mai rezolve sarcinile intuitiv. Apoi îl încordează. Cu cât se confruntă mai mulți, cu atât conexiunea lor cu produsul și, prin urmare, cu site-ul web devine mai frustrantă.

În calitate de designeri, depinde de noi să introducem vizitatorii în sarcini sau să îi îndrumăm conștient într-o singură direcție. Pentru a face acest lucru, trebuie să știți cum se comportă utilizatorii și să lucreze în consecință cu lucruri familiare. Masele știu cum funcționează un site web sau o aplicație. Cu toate acestea, există încă un număr mare de oameni care nu știu cum arată o interfață cu utilizatorul sau cum să o folosească. Prin urmare, cunoașterea grupului țintă este esențială!

Este foarte dificil să luați decizii de proiectare care nu se aplică doar maselor, dar sunt simțite și individual pentru fiecare utilizator.

Dar cum puteți face un utilizator să înțeleagă o pagină, deși nu a mai avut experiență în această direcție?

O interfață grafică de utilizator este operată de diferite persoane. Să presupunem că este un magazin online. Mulți știu cum să cumpere pe Internet, alții s-ar putea să nu știe încă. Dar cum îi faci pe toți să înțeleagă site-ul rapid și ușor?

Trebuie să încercați să le introduceți în cea mai apropiată experiență posibilă pe care o cunosc din viața lor. Chiar dacă nu știu cum să cumpere produse online, au o idee despre cum funcționează în viața reală. Trebuie să folosiți aceste cunoștințe. De aceea, este bine să transferați experiențele reale ale unui cumpărător pe site.
De exemplu, suntem obișnuiți să plasăm o achiziție în coșul de cumpărături. Prin urmare, ar trebui să folosim ceva similar într-un magazin online. Pentru utilizator, aceasta este o conexiune familiară pe care o înțelege imediat.

Iată câteva exemple despre modul în care puteți utiliza designul pentru a influența elementele în așa fel încât utilizatorul să le înțeleagă în modul dorit.

Folosiți culorile potrivite

Culorile îl ajută pe vizitator să se orienteze pe site. Mai ales atunci când vrem să încurajăm o acțiune, acestea sunt perfecte pentru a atrage atenția. Le putem folosi pentru a declanșa acțiuni și pentru a ne direcționa în mod conștient privirea într-o singură direcție.

Următorul exemplu vă arată, cât de conștient se poate cere un spectator să aleagă un buton.

De ce buton te atrage? Un exemplu despre modul în care îi putem ghida în mod conștient pe utilizatori să ia o decizie.

Doar folosind o zonă colorată putem aduce unul din cele două butoane în prim-plan. Butonul incolor cu un cadru gri pare discret și secundar. Putem folosi cu siguranță această variantă pentru a face o decizie mai ușoară pentru utilizatori.

De cele mai multe ori, dorim ca butoanele care pot fi făcute clic să fie descoperite și operate. Acesta este singurul mod în care putem conduce utilizatorul la pasul următor sau să declanșăm o funcție. Pentru a fi perceput deloc, butonul trebuie să atragă atenția și să fie diferit de alte obiecte. Ajută la creșterea contrastului cu elementele din jur. În cazul următor, acest lucru se face prin culoarea roșie.

Culoarea roșie atrage atenția, este o culoare de avertizare pentru noi și, prin urmare, este greu de ignorat. Putem folosi acest lucru pentru a pune în mod conștient o acțiune în prim plan:

Direcționați în mod conștient orientarea utilizatorului către un buton, ca în acest exemplu cu culoarea roșie. Atrage privirea și este greu de ignorat ca o culoare de avertizare.

Să luăm principiul semaforului, unde stăm când sunt roșii și ni se permite să mergem când sunt verzi. Mulți oameni au interiorizat deja acest principiu. În acest caz, știm că atunci când vine vorba de verde, oamenii fac următorul pas. Putem, de asemenea, să transferăm acest sentiment într-un buton în care dorim ca o acțiune să se desfășoare pozitiv.

Ca la un semafor sau dacă răspunzi la un telefon: verde semnalizează și ne însoțește pentru a face pasul următor.

Interfața cu utilizatorul unui apel telefonic prezintă, de asemenea, un comportament similar. Închideți în roșu și verde este folosit pentru a accepta. Dar această atenție se aplică tuturor?

Publicul țintă este crucial!

Chiar dacă cele două exemple de mai sus ne par plauzibile, ele nu sunt în general aplicabile. O funcție de culoare a semaforului ar putea funcționa în Germania, dar există încă mulți oameni din alte culturi care percep culorile diferit. În China de ex. B. site-urile web sunt complet colorate. Dacă ar fi să servim un magazin online acolo, probabil că ar avea un impact total negativ asupra comportamentului nostru de navigare.

Pentru a ghida conștient comportamentul vizitatorilor, aspectul trebuie testat pe grupul țintă. Doar prin analize puteți afla cu adevărat dacă o anumită decizie de culoare a dus la mai mult succes.

Actualizați:

Interesant, la scurt timp după ce am scris acest articol, am citit o postare în care HubSpot a examinat exact aceste două culori într-un test de utilizator. A fost vorba dacă un buton roșu sau verde provoacă o rată de conversie mai mare. Întregul aspect a fost același, doar un singur buton este diferit. În mod surprinzător, roșul a câștigat cu 21% mai multe clicuri. Dar era mai mult despre un fel de buton „cumpără-mă”, care pur și simplu a atras mai multă atenție datorită culorii sale roșii.

Următoarele se aplică culorilor în general

Există mai multă atenție și, prin urmare, mai multă acțiune atunci când contrastul cu elementele înconjurătoare este crescut. Nu numai la persoanele care pot percepe culorile, ci și la cei care sunt daltonici.

ÎNSCRIEȚI-VĂ LA NEWSLETTERUL MEU

Articole noi, episoade de podcast și resurse valoroase de proiectare direct în căsuța de e-mail!

Pe lângă actualizările blogului meu, veți primi linkuri și conținut interesant pentru designerii de web o dată pe săptămână, pe care îl voi împărtăși numai în acest buletin informativ!

Măriți șansele și oferiți două căi către obiectiv

Aveți sarcina de a face vizitatorul să efectueze o acțiune specifică? Atunci dublează-ți șansele!

Toată lumea privește un site diferit, motiv pentru care elementele care sunt plasate proeminent pentru dvs. pot fi observate doar la a doua vedere. Asigurați-vă că anumite solicitări apar de mai multe ori și astfel creșteți șansa efectului dorit.

Citibilitatea textelor

Există un comportament uman pe care îl învățăm de la o vârstă fragedă și care, prin urmare, a devenit o parte integrantă a vieții noastre. Când am început să conectăm litere și să citim cuvinte ca propoziții, am făcut-o de la stânga la dreapta de la început. Schimbarea acestui comportament pe un site web ar fi fatală. Nimeni nu putea citi corect paragrafele și nu s-ar vorbi despre o experiență plăcută a utilizatorului. Acest argument se aplică cel puțin majorității regiunilor (unele citesc și de la dreapta la stânga).

Dar nu doar direcția de citire joacă un rol. Pentru noi, un text este mai ușor de citit, chiar dacă lățimea paragrafelor nu este prea largă. În acest fel, ajutăm ochiul să nu alunece la schimbarea liniilor, ceea ce asigură un flux de citire plăcut.

Această metodă este clar vizibilă într-o broșură. Pentru a nu exista prea multe cuvinte una lângă alta, fiecare pagină are o anumită lățime și este separată de guler. Acest lucru creează două zone care sunt la fel de largi.

Dacă aplicăm acest principiu din viața noastră reală unui site web, s-ar putea spune că blocurile de text nu ar trebui să fie mai largi de 700px - 800px. Cu cât câmpul de text este mai larg și cu cât este mai mic fontul, cu atât ne este mai dificil să găsim un flux de citire confortabil. Dacă această lățime nu este suficientă, puteți plasa textul unul lângă celălalt în blocuri de text mai mici.

Exemplu de flux slab de citire: intrări Wikipedia pe dimensiuni mai mari ale ecranului

Un exemplu negativ în acest sens este Wikipedia. Dacă priviți un articol aici pe un ecran mai mare, devine aproape imposibil să treceți la următoarea linie. Fiecare schimbare de linie devine un efort.

Amplasarea corectă a informațiilor importante

Dacă dorim să fie văzute informații importante, atunci plasarea joacă un rol crucial. Arătarea ultimelor lucruri importante nu are sens. Știm că un site web este privit de sus în jos. Numai atunci când cineva dorește mai multe informații, el pătrunde mai adânc în pagină.

De aceea, informațiile din partea de sus sunt mai importante decât informațiile de mai jos, deoarece apar mai întâi după ce pagina a fost încărcată. Această metodă o găsim și în alte domenii:

  • Un tabel cu diagrame arată mai întâi cel mai popular artist, nu la mijloc sau la sfârșit
  • Cele mai relevante rezultate ale căutării sunt întotdeauna pe primul loc
  • De obicei, în partea din stânga sus este plasat un logo sau un nume de site

Este posibil ca acest lucru să nu pară cunoștințe noi pentru unii, dar ar trebui totuși să vă dați seama că, dacă aveți informații pe care vizitatorul ar trebui să le vadă cu siguranță, ar trebui să le plasați mai sus. Acesta este singurul mod de a-l convinge. În funcție de ce fereastră are un dispozitiv, acest câmp vizibil poate fi, desigur, diferit!

Atrage atenția prin mișcare

Animațiile dau viață unei interfețe cu utilizatorul. Tot ceea ce se mișcă automat ne atrage atenția. Dar atenție! Devine repede prea mult!

Dacă animațiile sunt folosite cu pricepere, ele fac un aspect plin de viață și de înțeles. Apoi, puteți arăta în mod specific relațiile și determina ierarhiile.

Folosiți designul eficient

Crearea unui aspect ușor de înțeles și plăcut nu este ușoară. Este nevoie de multă experiență, cercetare și cunoștințe.

Înțelegerea și aplicarea elementelor de bază este esențială dacă doriți să utilizați designul în mod eficient. Exemplele de mai sus vă vor ajuta în acest sens. Dacă doriți să aflați mai multe despre aceasta, vă puteți abona la newsletter-ul meu aici. Vă voi anunța apoi despre o nouă postare.

Distribuiți postarea:

Aflați mai multe despre web și UI/UX design și cum să lucrați ca independent

Buletinul meu săptămânal este cel mai bun mod de a obține acces la cele mai recente postări de blog, episoade podcast și resurse valoroase de proiectare.