Share
Proiectarea mesajelor eficiente și prietenoase cu interfața cu utilizatorul este o formă de artă în sine. În timp ce designerii petrec mult timp realizând cea mai mare parte a interfeței cu utilizatorul principal, proiectarea mesajelor poate părea o idee ulterioară. Feedback-ul este de fapt lipici între utilizator și interfață; fără ea, utilizatorii pot deveni confuzi.
Înainte de a continua, ar trebui să aruncăm o privire la exemplele de feedback din UI din viața reală:
Cel mai obișnuit mesaj de eroare pe care îl veți întâlni este mesajul care nu a fost găsit în 404 de pagini. Acest lucru se întâmplă atunci când un utilizator a introdus greșit adresa URL greșită sau adresa URL anterioară nu mai este accesibilă.
Conturile de downtime ale site-ului apar atunci când serverul coboară literalmente, uneori neașteptat:
Există situații în care este programată:
Aceste mesaje sunt destinate să notifice utilizatorul unui rezultat după ce au efectuat o acțiune:
În acest caz, versiunile indică utilizatorului că descărcarea a început și poate fi găsită în dosarul descărcărilor:
Un mesaj obișnuit în cutia de sus a site-ului, care le reamintește utilizatorilor să-și verifice e-mailurile:
Zootool folosește o întreagă pagină pentru a le spune utilizatorului să-și verifice e-mailurile înainte de a le permite să continue:
Și aceasta îi mulțumește pe utilizatori pentru verificarea:
Mesajele formate sunt de asemenea întâlnite regulat. Cele mai frecvente exemple sunt experimentate în timpul validării, care apare atunci când un utilizator trimite un formular, după care un script verifică dacă au apărut erori:
Pot exista o utilizare creativă a mesajelor de formular, acestea nu pot să apară neapărat doar pentru erori. Acestea ar putea fi utilizate ca un ghid minunat care ajută utilizatorul să completeze un formular:
Acesta este un exemplu de mesaj care apare după ce un formular a fost completat cu succes:
Liniile dintre aplicațiile web și aplicațiile native devin din ce în ce mai încețoșate. O mulțime de aplicații web sunt concepute să se comporte ca o aplicație nativă. De exemplu, 750words.com are un mesaj de tip pop-up la fel ca atunci când utilizați o comandă rapidă de la tastatură pentru a salva o intrare:
De asemenea, puteți crea mesaje pentru a apărea în zone bine poziționate pentru a încuraja utilizatorii să efectueze acțiuni suplimentare. Twitter.com informează utilizatorii că au actualizări:
Proiectarea mesajelor pentru interfețele mobile reprezintă o altă provocare din cauza factorului de formă redusă; mesajele trebuie să fie evidente.
Din nou, dacă este bine programat, un mesaj poate fi proiectat pentru a acționa ca un sfat:
Acesta poate fi, de asemenea, utilizat ca o formă de încurajare a utilizatorului pentru îndeplinirea unei sarcini:
Trebuie să ne punem în picioare utilizatorilor noștri. Ce doriți să se simtă când vizitează site-ul dvs. web sau utilizează aplicația dvs.? Ați dori ca aceștia să simtă că au încredere în dvs. și că ar fi un bonus suplimentar dacă s-ar putea simți de fapt încântați în timp ce utilizează site-ul dvs. Web. Dacă nu vă gândiți suficient la proiectarea mesajelor dvs., aceasta ar putea provoca o mulțime de frustrare și dezamăgire.
Cei mai mulți utilizatori vizitează un site Web sau utilizează o aplicație pentru a îndeplini un obiectiv definit. Pentru a afla mai multe despre o companie, pentru a achiziționa un produs, pentru a realiza o sarcină utilizând o aplicație etc. De exemplu, imaginați-vă ca pe un utilizator care încearcă să cumpere ceva pe un site Web. Vă puteți imagina cum ar simți utilizatorul dacă nu sa întâmplat nimic după ce ați făcut clic pe "adăugați în coș"? Trebuie să existe indicatoare adecvate care să indice unde a intervenit o acțiune:
Un alt scenariu ar fi un utilizator care încearcă să realizeze o sarcină importantă pe site-ul dvs. web. Poate că utilizatorul ar putea încerca să plătească chiria printr-un site web financiar online pe care îl ocupați. Vă puteți imagina frica, frustrarea și griji dacă site-ul nu mai lucrează dintr-o dată în mijlocul unei tranzacții financiare?
Mesajul de eroare de mai sus nu reușește să identifice sursa erorii - potențial frustrant pentru utilizatorul care încearcă să finalizeze o tranzacție.
Să luăm în considerare câteva bune practici în care se referă feedback-ul și mesajele.
Acest mesaj Dealotto este o demonstrație bună a faptului că este simplu și totuși specific:
Nimeni nu va pierde aceste erori de validare la acest formular de înscriere pe Vimeo:
37signals-ul a creat acest mesaj artistic de tip "blank", pentru a oferi utilizatorilor o idee despre ce să facă atunci când nu au niciun element:
Ați întâlnit vreodată o interfață care încearcă să obțineți fiecare centimetru din atenția dvs.? Utilizează fiecare convenție UI disponibilă, ferestre modale, mesagerie inline, mesaje de ultimă oră, pentru a încerca să te facă să faci ceva.
Fiind prea evidentă sau neîncetată poate avea efectul opus; utilizatorul renunțând la interfață.
Această fereastră modală a apărut atunci când ați încercat să citiți pentru prima dată un articol de știri Huffington Post. Ar putea fi confuz pentru utilizatorii care ar fi crezut că Twitter este necesar pentru a citi articolul.
La afișarea unui mesaj, fie pentru o eroare sau pentru o notificare, va fi întotdeauna util să oferiți sfaturi suplimentare sau ajutor utilizatorului. Acest lucru este valabil mai ales în contextul erorilor site-ului, de multe ori ele sunt inevitabile, dar putem face experiența cât mai nedureroasă posibil.
Vimeo oferă ghiduri utile altor secțiuni, completează cu un link de ajutor în partea de jos:
Icoanele puțin de ajutor din formularul dvs. pot fi utile:
Acest sfat de ajutor merge mai departe, inclusiv un link pe care utilizatorul poate face clic pentru a obține mai multe informații:
Invisionapp oferă un sfat util în timp ce afișează imaginea de încărcare:
Proiectarea unor mesaje bune de feedback se referă la anticiparea. Aceasta include anticiparea:
Kicksend a observat că unii dintre utilizatorii lor nu verificau e-mailurile. Ei și-au analizat datele și au constatat că ei pur și simplu introduc adresele de e-mail greșite prin erori tipo comune. Prin urmare, au proiectat un plugin jquery, mailcheck.js pentru a verifica greșelile tipo comune când utilizatorii își completează adresele de e-mail. Cu o astfel de verificare simplă, numărul redus de e-mailuri de verificare scade cu 50%:
Fab.com a anticipat că unii dintre utilizatorii lor își vor anula conturile. Aici încearcă să salveze o cauză pierdută furnizând acest mesaj atunci când încercați să anulați un cont:
Uneori scenariile anticipate pot fi un salvator de viață:
Sau poate fi de ajutor recuperarea unei vânzări potențial pierdute:
E vorba de micile detalii. Acest ecran de conectare din Gmail anticipează că este posibil să fi uitat faptul că ți-ai schimbat parola:
Mai multă inspirație din Gmail; Sunt sigur că acest lucru a fost util pentru nenumărați oameni prin anticiparea simplă a unei erori comune a utilizatorului, cum ar fi uitarea atașării fișierelor:
Indicatorii de progres sunt o formă importantă a mesageriei UI. Foursquare a creat un mesaj subtil pentru a informa utilizatorii că își găsesc locația și găsesc locuri interesante în timp ce datele se încarcă. Aceasta realizează un obiectiv dublu.
.
TeuxDeux anticipează că sincronizarea este importantă pentru o listă de sarcini și avertizează un utilizator că conexiunea la internet este pierdută cu o notificare plină de umor:
Există o mulțime de alte exemple despre cum să anticipați și să construiți "defensiv" pentru interfața dvs. de utilizator.
Am menționat mai devreme că este important să gândim în numele utilizatorului. Minimizarea frustrării lor este crucială și putem face chiar și un pas înainte. O mulțime de utilizatori se confruntă cu un ecran pentru ore lungi. Prin manifestarea empatiei sau prin injectarea unui anumit umor, se transformă într-un scenariu frustrant sau luminos într-un scenariu potențial amuzant.
Acest robot rupt vă face să zâmbiți, corect?
Pentru alte exemple bune pentru 404 de pagini, vă puteți referi la această colecție Pinterest. În afară de erori, chiar și notificările simple vă pot face să zâmbiți în timpul unei zile lungi:
Mulți dintre noi se luptă cu intrarea zero, dar poate merită efortul pentru Gmail:
Acest mesaj din Buffer folosește un pic de lingușire și umor pentru a obține mai multe înscrieri:
Un alt mesaj de notificare care va aduce probabil un zâmbet pe față prin intermediul copywriting-ului inteligent:
Această punte excelentă de la Aaron Walter, designer de plumb din Mailchimp, este un bun primer pentru designul emoțional pentru cei interesați să învețe mai mult.
Sper că acest deranjament privind elaborarea mesajelor pentru interfața dvs. de utilizator a fost de ajutor. Am inclus mai jos resurse suplimentare pentru citirea și explorarea ulterioară. Nu există nici un negru sau alb în proiectarea mesajelor, ci mai degrabă este nevoie de o mulțime de empatie, experiență și, desigur, feedback de la utilizatori înșiși.
Nu vă fie frică să treceți printr-o serie de iterații pentru a vă simți bine mesajele. Întrebați-i pe oameni pentru feedback, începeți să comunicați mesajul destinat utilizatorului și, dacă acesta funcționează, aruncați puțin umor sau emoție pentru a îmbunătăți experiența de ansamblu. Întotdeauna încercați să fiți de ajutor!
Simțiți-vă liber să puneți întrebări în zona de comentarii. Feedback-ul este întotdeauna binevenit pentru a ne ajuta să scriem articole și mai bune pentru dvs. de la Webdesigntuts+.
Accentsconagua