Cum să rulezi un audit UX pentru o platformă EdTech majoră (studiu de caz)

Publicat: 2022-03-10
Rezumat rapid ↬ Acest articol este un studiu de caz despre modul în care un audit UX afectează o interfață de utilizare. Acesta explică modul în care o platformă educațională celebră poate fi analizată edX în raport cu ghidurile de utilizare ale lui Jakob Nielsen. Pentru a începe, Mark Lankmiller împărtășește toate criteriile și valorile pe care le-a folosit pentru auditul său UX.

Lumea afacerilor de astăzi este obsedată de designul experienței utilizatorului (UX). Și pentru un motiv întemeiat: fiecare dolar investit în UX aduce 100 USD în schimb. Așa că, având ceva timp liber în carantină, am decis să verific dacă una dintre industriile cele mai în evoluție în acest moment, tehnologia educației (EdTech), folosește acest potențial al UX.

Planul meu era să aleg o platformă EdTech, să-i auditez UX și, dacă este necesar, să o reproiectez. M-am uitat mai întâi la unele platforme EdTech majore (cum ar fi edX, Khan Academy și Udemy), am citit feedbackul utilizatorilor despre ele și apoi mi-am restrâns domeniul de aplicare la edX. De ce am ales edX? Pur și simplu pentru că:

  • este non-profit,
  • are peste 20 de milioane de utilizatori,
  • UX-ul său are o mulțime de recenzii negative.
Recenzii edX pe TrustPilot (previzualizare mare)

Chiar și din verificarea mea rapidă UX, am primit o prezentare generală a principiilor UX și a soluțiilor UI urmate de platformele EdTech globale chiar acum (în cazul meu, edX).

În general, acest concept de audit și reproiectare UX ar fi de mare folos pentru designerii UX, proprietarii de afaceri și oamenii de marketing, deoarece prezintă o modalitate de a audita și de a remedia cele mai evidente probleme de utilizare a unui produs. Deci, bun venit la auditul meu edX.

Mai multe după săritură! Continuați să citiți mai jos ↓

Structura de audit

  • Partea 1: Audit pentru nevoile utilizatorilor
  • Partea 2: Audit pentru 10 euristici de utilizare

Acest audit constă din două părți. În primul rând, am chestionat utilizatorii edX, am aflat nevoile acestora și am verificat dacă platforma le satisface. În a doua etapă, am cântărit site-ul edX cu cele 10 euristici de utilizare identificate de Jacob Nielsen. Aceste euristici sunt linii directoare UX bine-cunoscute - biblia, dacă vreți, pentru orice designer UX.

În mod ideal, un audit UX cu drepturi depline ar dura săptămâni. Aveam un domeniu fix, așa că am verificat pagina de pornire a platformei, profilul de utilizator și pagina de căutare . Acestea sunt cele mai importante pagini pentru utilizatori. Doar analiza acestor câteva pagini mi-a oferit o perspectivă mai mult decât suficientă pentru conceptul meu de reproiectare.

Partea 1: Audit pentru nevoile utilizatorilor

UX bun se traduce prin utilizatori mulțumiți.

De aici am început: identificarea nevoilor utilizatorilor. În primul rând, am analizat datele statistice despre platformă. Pentru aceasta, puteți folosi instrumente cunoscute precum Semrush și SimilarWeb și recenzii de la Trustpilot, Google Play și App Store de la Apple.

Luați SimilarWeb. Instrumentul analizează clasamentul edX, sursele de trafic, publicitatea și interesele publicului. „Electronică pentru computer” și „Tehnologie” par a fi cele mai populare categorii de curs printre studenții edX.

Analize web similare pentru platforma edX (previzualizare mare)

Pentru feedback-ul utilizatorilor despre edX, am mers la Trustpilot (Google Play și App Store sunt relevante doar pentru analiza aplicațiilor mobile). Am descoperit că majoritatea utilizatorilor laudă cursurile edX pentru conținutul lor util, dar se plâng de UX-ul platformei – cel mai adesea despre procesul de verificare greu și consumator de timp și asistența slabă pentru clienți.

Evaluarea utilizatorului edX pe Trustpilot (previzualizare mare)

Terminat cu verificarea analitică, am trecut la interviurile utilizatorilor. Am fost la comunități de design pe Facebook și LinkedIn, căutând studenți la cursuri online, cerându-le să răspundă la câteva dintre întrebările mele rapide. Tuturor celor care au răspuns, le-am trimis un formular Google simplu pentru a surprinde nevoile lor de bază și ceea ce apreciază cel mai mult atunci când aleg o platformă de educație.

După ce am primit răspunsurile, am creat două profiluri de utilizator pentru edX: utilizator potențial și utilizator de lungă durată. Iată o ilustrare rapidă a acestor două tipuri:

Două profiluri de utilizator pentru edX (previzualizare mare)

Am identificat aceste două tipuri de utilizatori pe baza sondajului meu. Conform constatărilor mele, există două scenarii comune pentru modul în care utilizatorii selectează un curs educațional.

Studentul 1 se concentrează în principal pe alegerea între diferite platforme educaționale. Acest tip de utilizator nu are nevoie de un anumit curs. Ei vizitează diverse site-uri web, în ​​căutarea unui curs care să le atragă atenția.

Al doilea tip de cursant știe exact ce curs doresc să urmeze. Presupunând că au ales edX, ar avea nevoie de o funcție de căutare eficientă care să îi ajute să găsească cursul de care au nevoie și ar avea nevoie de o pagină de profil convenabilă pentru a-și urmări progresul.

Pe baza profilurilor de utilizatori edX, a nevoilor acestora și a datelor statistice pe care le-am adunat, am subliniat cele mai frecvente cinci probleme cu care s-ar putea confrunta clienții platformei.

Problema 1: „Pot avea încredere în acest site web?”

Numeroși factori determină credibilitatea și încrederea unui site web: logo-ul, recenziile, feedback-ul, prețurile afișate etc. Nielsen Norman Group acoperă teoria acestuia. Să ne concentrăm pe practică.

Deci, ce avem aici? Pagina de pornire actuală a edX afișează siglele partenerilor săi din universități, care sunt vizibile la prima vedere și adaugă credibilitate platformei.

În același timp, pagina de pornire nu evidențiază beneficiile platformei sau feedbackul utilizatorilor. Acesta este adesea un factor decisiv pentru utilizatori în alegerea unei platforme.

Pagina de pornire edX (previzualizare mare)

Alte abordări

E bine să înveți de la concurenți. O altă platformă EdTech, Khan Academy, demonstrează o abordare destul de diferită a designului site-ului web. Pagina sa de pornire prezintă platforma, vorbește despre beneficiile acesteia și arată feedbackul utilizatorilor:

Ecranele paginii de pornire a Academiei Khan (previzualizare mare)

Problema 2: „Am toate informațiile de care am nevoie pentru a alege un curs?

De multe ori, utilizatorii doresc doar să scaneze rapid lista de cursuri și apoi să aleagă pe cel mai bun pe baza descrierii.

Cardurile de curs ale edX afișează numele cursului, instituția și nivelul de certificat. Cu toate acestea, ar putea oferi și elemente esențiale, cum ar fi prețul, evaluarea cursurilor, câți studenți sunt înscriși, data de începere etc.

Descrierea corectă a elementelor este o parte esențială a UX, așa cum este menționat în a șasea euristică a lui Jacob Nielsen. Euristica afirmă că toate informațiile valoroase pentru un utilizator ar trebui să fie întotdeauna disponibile.

Alte abordări

Privind o altă platformă EdTech, cardurile de curs Udemy afișează numele cursului, instructorul, evaluarea, numărul de recenzii și prețul.

Carduri de curs edX și Udemy (previzualizare mare)

Problema 3: „Ma pot înscrie cu ușurință?”

Potrivit unui studiu realizat de Mirjam Seckler, timpul de finalizare scade semnificativ dacă un formular de înscriere urmează regulile de bază privind utilizarea. Utilizatorii sunt aproape de două ori mai probabil să se înscrie la prima încercare dacă nu există erori.

Deci, să aruncăm o privire mai profundă asupra formelor edX:

  1. Nu vă permit să introduceți numele țării sau data nașterii. În schimb, trebuie să parcurgeți toate opțiunile. (Sunt în Ucraina, care este destul de departe pe listă.)
  2. Nu afișează parola pe care ați introdus-o, nici măcar la cerere.
  3. Ei nu trimit un e-mail pentru a verifica adresa pe care ați introdus-o.
  4. Ele nu indică cu un asterisc ce câmpuri sunt obligatorii.

Accelerarea procesului de înregistrare este încă un alt principiu crucial UX. Pentru a citi mai multe despre aceasta, consultați ghidurile de utilizare ale Nielsen Norman Group pentru formularele site-ului web.

Ecrane de înscriere la edX
Ecrane de înscriere la edX (previzualizare mare)
Ecrane de înscriere la edX
Ecrane de înscriere la edX (previzualizare mare)
Ecrane de înscriere la edX
Ecrane de înscriere la edX (previzualizare mare)

Alte abordări

Multe site-uri web permit utilizatorilor să introducă datele manual pentru a accelera procesul de aplicare. Un alt site web EdTech, Udemy, are o opțiune de a afișa și a ascunde parola introdusă la cerere:

Înscrierea Udemy
Înscrierea Udemy (previzualizare mare)

Problema 4: „Este utilă căutarea pe site?”

Căutarea este una dintre cele mai utilizate funcții ale site-ului. Astfel, ar trebui să fie util, simplu de utilizat și rapid. Numeroase studii de utilizare arată importanța căutării utile pentru cursuri masive online deschise (MOOC).

În acest sens, am analizat căutarea edX. Am început de la încărcarea paginii. Mai jos este o captură de ecran de la Google PageSpeed, care arată că viteza de căutare a platformei are nota 12 din 100.

Analiza edX pe Google PageSpeed
Analiza edX pe Google PageSpeed ​​(previzualizare mare)

Să trecem acum la căutarea într-o anumită categorie. În designul său actual, edX nu are filtrare. După ce au ales o categorie (de exemplu, cursuri de electronică), utilizatorii trebuie să parcurgă lista pentru a găsi ceea ce doresc. Și unele categorii au mai mult de 100 de articole.

Pagina de categorii pentru cursurile de electronică pe edX
Pagina de categorii pentru cursurile de electronică pe edX (previzualizare mare)

Alte abordări

Platforma EdTech Coursera are filtrare vizibilă pe site-ul său web, afișând toate opțiunile de filtrare dintr-o categorie:

Pagina categoriei de afaceri pe Coursera
Pagina categoriei de afaceri pe Coursera (previzualizare mare)

Problema 5: „Ar trebui să termin acest curs?”

Cercetătorii nu încetează să sublinieze că platformele EdTech au, în medie, rate de retenție mai mari decât alte site-uri web. Prin urmare, urmărirea progresului și a motivației utilizatorilor este esențială pentru cursurile online. Aceste principii sunt destul de simple, dar eficiente.

Așa arată profilul de utilizator al edX:

profilul de utilizator al edX
Profilul utilizatorului edX (previzualizare mare)

Alte abordări

Profilul de utilizator al Academiei Khan afișează diverse statistici, cum ar fi data aderării, punctele câștigate și cea mai lungă serie de învățare. Poate motiva utilizatorul să continue să învețe și să-și urmărească succesul.

Profilul de utilizator al Khan Academy
Profilul de utilizator al Academiei Khan (previzualizare mare)

Partea 2: Audit pentru 10 euristici de utilizare

Am terminat de analizat cele mai comune nevoi ale utilizatorilor pe edX. Este timpul să trecem la cele 10 criterii de utilizare identificate de Nielsen Norman Group, o firmă de cercetare și consultanță UX în care au încredere organizațiile de top din întreaga lume.

Puteți face o verificare de bază UX a site-ului dvs. folosind cele 10 euristici chiar dacă nu sunteți un designer UX. Site-ul web al Nielsen Norman Group oferă o mulțime de exemple, videoclipuri și instrucțiuni pentru fiecare euristică. Această listă de verificare a noțiunii o face și mai convenabilă. Include criterii vitale de utilizare necesare pentru orice site web. Este un instrument folosit intern la Fulcrum (unde lucrez), dar m-am gândit că ar fi bine să îl împărtășesc cu publicul Smashing Magazine. Include peste o sută de criterii și, deoarece este în Notion, îl puteți edita și personaliza după cum doriți.

Euristica 1: Vizibilitatea stării sistemului

Prima euristică este de a menține întotdeauna utilizatorii informați. Mai simplu spus, un site web ar trebui să ofere utilizatorilor feedback ori de câte ori este finalizată o acțiune. De exemplu, veți vedea adesea un mesaj „Succes” atunci când descărcați un fișier pe un site web.

În acest sens, cardurile de curs curente ale edX ar putea fi îmbunătățite. În acest moment, un card nu le spune utilizatorilor dacă cursul este disponibil. Utilizatorii trebuie să facă clic pe card pentru a afla.

Pagina edX pentru cursuri de inginerie mecanică.
Pagina edX pentru cursuri de inginerie mecanică. (Previzualizare mare)

Posibila abordare

Dacă unele cursuri nu sunt disponibile, indicați asta de la început. Puteți utiliza etichete luminoase cu mesaje „disponibil”/„nu este disponibil”.

Euristica 2: Potrivire între sistem și lumea reală

Sistemul ar trebui să vorbească limba utilizatorului. Ar trebui să folosească cuvinte, expresii și simboluri care sunt familiare vizitatorului obișnuit. Și informațiile ar trebui să apară într-o ordine logică.

Acesta este al doilea criteriu al lui Jacob Nielsen. Site-ul web al edX urmează aproape acest principiu, folosind limbaj comun, simboluri general acceptate și semne familiare.

Pagina edX pentru cursuri de electronică
Pagina edX pentru cursuri de electronică (previzualizare mare)

Posibila abordare

O altă practică bună ar fi împărțirea cursurilor pe secțiuni și adăugarea pictogramelor ușor de înțeles.

Euristica 3: Controlul utilizatorului și libertatea

Această euristică subliniază că utilizatorii ar trebui să aibă întotdeauna o cale de ieșire clară atunci când fac ceva din greșeală, ceva de genul o opțiune de anulare sau returnare.

edX face imposibilă schimbarea numelui de utilizator odată ce a fost configurat. Multe site-uri web limitează opțiunile de schimbare a unui nume de utilizator din motive de securitate. Cu toate acestea, ar putea fi mai ușor de utilizat să-l faceți schimbător.

setările contului edX
Setările contului edX (previzualizare mare)

Posibila abordare

Unele site-uri web permit utilizatorilor să salveze date, o stare sau o modificare oricând doresc. O bună practică ar fi să le oferi clienților opțiuni alternative, cum ar fi adăugarea sau eliminarea unui curs sau salvarea sau editarea profilului lor.

Euristică 4: consistență și standarde

Conform acestui al patrulea criteriu UX, elementele de design ar trebui să fie consistente și previzibile. De exemplu, simbolurile și imaginile ar trebui să fie unificate în designul UI al unei platforme.

În linii mari, există două tipuri de consistențe: interne și externe. Consecvența internă se referă la menținerea în sincronizare cu un produs (sau o familie de produse). Consecvența externă se referă la respectarea standardelor dintr-o industrie (de exemplu, coșuri de cumpărături având aceeași logică pe site-urile de comerț electronic).

edX rupe uneori consistența internă. Caz de mai jos: butonul „Explorare” arată diferit. Două butoane cu aspect diferit (sau orice alte elemente) care îndeplinesc aceeași funcție ar putea adăuga zgomot vizual și înrăutăți experiența utilizatorului. Este posibil ca această problemă să nu fie critică, dar contribuie la UX-ul general al site-ului.

Butoanele „Explorați cursuri” de pe edX
Butoanele „Explorați cursuri” de pe edX (previzualizare mare)

Euristica 5: Prevenirea erorilor

Designul bun previne erorile utilizatorului. Ajutând utilizatorii să evite erorile, designerii le economisesc timp și previn frustrarea.

De exemplu, pe edX, dacă faceți o greșeală de tipar în adresa dvs. de e-mail, aceasta este vizibilă numai după ce încercați să o verificați.

Crearea unui cont edX
Crearea unui cont edX (previzualizare mare)

Posibila abordare

Desigur, validarea live nu este întotdeauna bună pentru UX. Unii designeri îl consideră problematic, argumentând că distrage atenția utilizatorilor și provoacă confuzie. Alții cred că validarea live are un loc în designul UX.

În orice caz, indiferent dacă validați în direct sau după ce ați făcut clic pe butonul „Trimite”, țineți cont de utilizatorii și de obiectivele lor. Sarcina ta este să le faci experiența cât mai plăcută.

Euristica 6: Recunoaștere, mai degrabă decât reamintire

Utilizatorii nu ar trebui să fie nevoiți să memoreze informațiile pe care le-ați arătat înainte. Acesta este un alt ghid UX de la Nielsen Norman Group. Culorile și pictogramele (cum ar fi săgețile) ajută utilizatorii să proceseze mai bine informațiile.

Pagina principală a edX afișează siglele universităților, dar nu și numele complete ale universităților, ceea ce ilustrează acest punct. De asemenea, pagina de profil de utilizator nu vă spune ce cursuri ați urmat.

profilul utilizatorului edX
Profil de utilizator edX (previzualizare mare)

Posibila abordare

UX-ul platformei ar putea fi îmbunătățit arătând cursuri pe care utilizatorii le-au făcut deja și recomandând altele similare.

Euristica 7: Flexibilitatea și eficiența utilizării

Conform acestui principiu UX, accelerați interacțiunea ori de câte ori este posibil, folosind elemente numite acceleratoare. Practic, utilizați orice opțiuni sau acțiuni care accelerează întregul proces.

edX nu oferă filtrare atunci când utilizatorii caută un curs. Absența acestuia ar putea crește timpul și efortul depus de utilizatori pentru a găsi cursul de care au nevoie.

Pagina de căutare edX
Pagina de căutare edX (previzualizare mare)

Posibila abordare

Căutarea este una dintre etapele critice ale conversiei utilizatorilor. Dacă utilizatorii pot găsi ceea ce își doresc, vor fi mult mai aproape de a deveni clienți. Prin urmare, utilizați filtre pentru a ajuta utilizatorii să găsească cursuri mai rapid și mai ușor.

Euristica 8: Design estetic și minimalist

Această euristică ne spune să „eliminăm elementele inutile din interfața cu utilizatorul și să maximizăm raportul semnal-zgomot al designului” (semnalul fiind informații relevante pentru utilizator, iar zgomotul fiind informații irelevante).

Mai simplu spus, fiecare element ar trebui să spună o poveste, ca un mozaic. Designerii comunică, nu decorează.

Comparând designul actual al paginii de start a edX cu cel precedent, putem observa o îmbunătățire uriașă. Fotografia principală este acum mult mai relevantă pentru misiunea platformei. edX a adăugat, de asemenea, informații despre câți utilizatori și cursuri are.

Fotografiile anterioare și actuale ale paginii de pornire ale edX
Fotografiile anterioare și actuale ale paginii de pornire ale edX (previzualizare mare)

Euristica 9: Ajută utilizatorii să recunoască, să diagnosticheze și să se recupereze de erori

Această euristică afirmă că erorile ar trebui să fie exprimate într-un limbaj simplu, explicativ pentru utilizator. De asemenea, este bine să explici clar de ce a apărut o eroare în primul rând.

Pagina 404 a edX își servește scopul în general. În primul rând, îi explică utilizatorului problema („Se pare că nu putem găsi pagina pe care o cauți”) și sugerează o soluție (oferind link-uri către pagina de pornire, funcția de căutare și lista de cursuri). De asemenea, recomandă cursuri populare.

edX 404 pagina
Pagina edX 404 (previzualizare mare)

Euristica 10: Ajutor și documentare

Această ultimă euristică este despre necesitatea suportului și a documentării pe orice site web. Există multe forme de ajutor și documentație, cum ar fi pagini de încorporare, explicații, sfaturi cu instrumente, chat-uri și chatbot.

edX are linkuri către un centru de ajutor ascuns în subsol. Este împărțit în secțiuni, iar utilizatorii pot folosi o bară de căutare pentru a găsi informații. Căutarea face o treabă bună de a sugera automat subiecte care ar putea fi utile.

Din păcate, utilizatorii nu pot reveni la pagina de pornire din centrul de ajutor făcând clic pe siglă. Nu există nicio modalitate directă de a reveni la pagina de pornire de acolo.

Centrul de ajutor edX
Centrul de ajutor edX (previzualizare mare)

Posibila abordare

Permiteți utilizatorilor să revină la pagina de pornire oriunde doresc pe site.

Conceptul de reproiectare eDX

Pe baza constatărilor mele UX, am reproiectat platforma, concentrându-mă pe pagina de pornire, profilurile utilizatorilor și pagina cu rezultatele căutării. Puteți vedea imagini complete ale reproiectării în Figma.

Pagina principala

1. Raportul semnal-zgomot

În primul rând, pentru a îndeplini euristica de utilizare 8, am făcut întreaga pagină mai minimalistă și am adăugat spațiu între elementele sale.

edX are marea misiune de „educație pentru toată lumea, pretutindeni”, așa că am decis să pun asta pe pagina principală, simplu și îndrăzneț.

misiunea edX
Misiunea edX (previzualizare mare)

De asemenea, am schimbat imaginile pentru a reflecta mai bine povestea prezentată în text. Mi-am exprimat misiunea cu aceste noi ilustrații:

Misiunea edX a fost reproiectată
Misiunea edX a fost reproiectată (previzualizare mare)

2. Carduri de curs

Secțiunea „Cursuri noi” de mai jos evidențiază cele mai recente cursuri.

Am adăugat și câteva detalii pe care cardurile edX nu le afișează momentan. Acest lucru a făcut cardurile mai descriptive, arătând informații esențiale despre fiecare curs.

redesign edX: cursuri noi și subiecte populare
Reproiectare edX: cursuri noi și subiecte populare (previzualizare mare)

De asemenea, am folosit pictograme pentru a afișa cele mai populare subiecte.

3. Credibilitate și încredere

Am adăugat o fișă informativă pentru a arăta credibilitatea și autoritatea platformei:

redesign edX: fișă informativă
reproiectare edX: fișă informativă (previzualizare mare)

În plus, am împrospătat subsolul, remodelând bara de limbi pentru a fi mai vizibilă pentru utilizatori.

Căutare utilă

1. Procesul de căutare

În designul actual al edX, utilizatorii nu văd opțiunile disponibile în timpul căutării. Așadar, am conceput o funcție de căutare cu sugestie automată. Acum, utilizatorii trebuie doar să introducă un cuvânt cheie și să aleagă cea mai relevantă opțiune.

reproiectare edX: căutare
reproiectare edX: căutare (previzualizare mare)

2. Filtre de căutare

Am adăugat o bară laterală din stânga pentru a facilita filtrarea rezultatelor. De asemenea, am actualizat interfața de utilizare și am făcut cardurile de curs mai descriptive.

edX redesign: filtre de căutare
reproiectare edX: filtre de căutare (previzualizare mare)

Profil utilizator

După cum sa menționat în secțiunea de audit, este esențial să motivați utilizatorii să continue să studieze. Inspirat de Khan Academy, am adăugat o bară de progres la profilurile utilizatorilor. Acum, un profil arată câte lecții au mai rămas înainte ca utilizatorul să finalizeze un curs.

edX redesign: profil de utilizator cu bară de progres
reproiectare edX: profil de utilizator cu bară de progres (previzualizare mare)

Am pus navigarea mai sus ca sa se vada usor. De asemenea, am actualizat setările profilului utilizatorului, lăsând funcționalitatea, dar modificând culorile.

Concluzie

Un audit UX este o modalitate simplă și eficientă de a verifica dacă elementele de design își îndeplinesc funcția. Este, de asemenea, o modalitate bună de a privi un design existent dintr-o perspectivă nouă.

Acest caz mi-a oferit câteva lecții. În primul rând, văd că site-urile web dintr-una dintre cele mai actuale industrii în acest moment ar putea avea UX actualizat. Este greu să înveți ceva nou, dar fără un design UX adecvat, este și mai greu.

Auditul a arătat, de asemenea, de ce este esențial să înțelegem, să analizăm și să răspundem nevoilor utilizatorilor. Utilizatorii fericiți sunt utilizatori devotați.