Per usabilità si intende generalmente la facilità con cui è possibile utilizzare un oggetto (nel caso di Nielsen e della user experience, ci si riferisce in particolare alle user interface) anche senza conoscenze pregresse.
La ISO, o International Organisation for Standardization, la definisce come “l'efficacia, l'efficienza e la soddisfazione con le quali determinati utenti raggiungono determinati obiettivi in determinati contesti”.
Si tratta di un attributo complesso da misurare nell’ambito della UX poiché tiene conto di tutti i seguenti fattori:
· La learnability (potremmo tradurla maccheronicamente come “apprendibilità”), ovvero la facilità con cui gli utenti sono in grado di portare a termine i compiti base richiesti dall’interfaccia, anche la prima volta che la utilizzano;
· L’efficienza di utilizzo, cioè la velocità e la semplicità con cui gli utenti possono completare le operazioni richieste dopo avere appreso come eseguirle;
· La memorability (“memorabilità”), ossia la facilità con cui l’utente è in grado di ricordare le funzioni principali dell’interfaccia in seguito a un periodo di tempo in cui non la utilizza;
· La frequenza e la gravità degli errori d’esecuzione;
· L’appagamento, vale a dire la soddisfazione dal punto di vista emotivo suscitata dall’utilizzo di dell’interfaccia stessa.
La ISO, o International Organisation for Standardization, la definisce come “l'efficacia, l'efficienza e la soddisfazione con le quali determinati utenti raggiungono determinati obiettivi in determinati contesti”.
Si tratta di un attributo complesso da misurare nell’ambito della UX poiché tiene conto di tutti i seguenti fattori:
· La learnability (potremmo tradurla maccheronicamente come “apprendibilità”), ovvero la facilità con cui gli utenti sono in grado di portare a termine i compiti base richiesti dall’interfaccia, anche la prima volta che la utilizzano;
· L’efficienza di utilizzo, cioè la velocità e la semplicità con cui gli utenti possono completare le operazioni richieste dopo avere appreso come eseguirle;
· La memorability (“memorabilità”), ossia la facilità con cui l’utente è in grado di ricordare le funzioni principali dell’interfaccia in seguito a un periodo di tempo in cui non la utilizza;
· La frequenza e la gravità degli errori d’esecuzione;
· L’appagamento, vale a dire la soddisfazione dal punto di vista emotivo suscitata dall’utilizzo di dell’interfaccia stessa.
Le euristiche proposte da Nielsen permettono quindi di misurare quanto più oggettivamente possibile l’usabilità di un sistema. Sono normalmente alla base delle cosiddette analisi euristiche condotte dai professionisti della user experience, talvolta in combinazione con altri principi.
Perché parliamo di euristiche e non di norme o regole?
Per la natura stessa dell’attributo “usabilità”, strettamente influenzato dall’esperienza e dalle conoscenze dell’individuo oltre che dal contesto d’uso, non è possibile definire delle leggi oggettive d’analisi. Le euristiche ci offrono quindi delle linee guida pratiche e veloci per arrivare alla risoluzione di un problema (in questo caso, determinare il grado di usabilità di un’interfaccia) tramite step concreti.
Per la natura stessa dell’attributo “usabilità”, strettamente influenzato dall’esperienza e dalle conoscenze dell’individuo oltre che dal contesto d’uso, non è possibile definire delle leggi oggettive d’analisi. Le euristiche ci offrono quindi delle linee guida pratiche e veloci per arrivare alla risoluzione di un problema (in questo caso, determinare il grado di usabilità di un’interfaccia) tramite step concreti.
Per illustrare le dieci euristiche prenderò ad esempio il sito di Amazon.it, non tanto perché lo consideri un modello dal punto di vista dell’usabilità, ma perché si tratta di un’interfaccia nota a molte persone.
#1: Visibilità dello stato di sistema
Con questo primo principio si intende che l’interfaccia dovrebbe fornire all’utente informazioni e feedback tempestivi in risposta alle sue azioni, oltre che tenerlo costantemente aggiornato sul punto in cui si trova nel contesto di un processo.
Non appena si passa dal carrello al checkout su Amazon, l’interfaccia viene completata da uno stepper nella parte superiore della pagina. Gli stepper sono utili a visualizzare i vari passi, appunto gli step, necessari alla conclusione di un processo.
Grazie a questo componente l’utente ha una chiara visione degli step precedenti e di quali saranno i successivi. Venendo aggiornato non appena si passa alla schermata successiva, lo stepper fornisce un feedback immediato e consente di limitare l’ansia da acquisto.
#2: Corrispondenza tra il sistema e il mondo reale
L’interfaccia deve impiegare elementi comuni e riconoscibili dagli utenti, in altre parole “parlarne lo stesso linguaggio”. Non ci riferisce solo al copy, che dovrebbe comunque risultare comprensibile ed essere privo di termini troppo tecnici, ma anche ai componenti e alle funzioni utilizzate. È importante seguire le convenzioni già esistenti e riportare le informazioni in ordine logico e naturale.
Il design è più efficace quando non cerca di “reinventare la ruota” ma si adatta alle convenzioni e alle modalità a cui gli utenti sono già abituati.
Tornando ad Amazon e in particolare alla schermata del carrello, possiamo notare come venga fatto uso dei checkbox per selezionare gli articoli che si intende effettivamente acquistare procedendo al checkout.
Il checkbox è un componente universalmente utilizzato e conosciuto nel mondo del web, e dovrebbe risultare noto anche agli utenti meno esperti. Ci sarebbero potuti essere modi più creativi per effettuare la stessa operazione, ad esempio trascinare l’articolo in questione sopra il pulsante “Procedi all’acquisto” o dentro un carrello illustrato, ma non sarebbero risultati naturali e per la maggior parte degli utenti.
Il checkbox ha anche un altro vantaggio, ovvero riproduce virtualmente un’azione proveniente dal mondo reale, cioè quella di spuntare con una penna o una matita un elemento da una lista su carta.
Il checkbox ha anche un altro vantaggio, ovvero riproduce virtualmente un’azione proveniente dal mondo reale, cioè quella di spuntare con una penna o una matita un elemento da una lista su carta.
#3: Fornire all’utente controllo del sistema e libertà d’azione
L’utente non dovrebbe mai sentirsi “in trappola” nel momento in cui commette un errore. Oltre alla possibilità di navigare liberamente tra le schermate, è ideale fornire delle “vie d’uscita”, sotto forma di link o pulsanti, per interrompere determinate operazioni. Come per il primo principio, questo fornisce un senso di sicurezza e di controllo all’utente e permette di limitare la frustrazione che si può provare nell’interazione con un’interfaccia.
Ad esempio, dopo aver premuto il pulsante “Crea una lista” all’interno della pagina profilo su Amazon, si ha la possibilità di annullare l’operazione tramite il tasto “Annulla” o tramite la “X” in alto a destra. Se non esistessero queste “vie d’uscita”, l’utente sarebbe costretto a dare un nome alla lista, crearla, aprire la pagina con tutte le liste, localizzarla e cancellarla. Come potete immaginare, questo ipotetico processo sarebbe tedioso e scoraggiante.
#4: Coerenza e adattamento agli standard
Le interfacce di un sistema dovrebbero mantenere coerenza non solo all’interno del sistema stesso, ma anche rispetto alle convenzioni dell’industria.
A scopo di limitare il carico cognitivo degli utenti, sarebbe bene costruire e mantenere un design system che regoli l’utilizzo di componenti, colori e messaggi per tutto il sistema. Allo stesso tempo, questi componenti, colori e messaggi non dovrebbero discostarsi troppo dai pattern a cui gli utenti sono già abituati grazie all’utilizzo di altri sistemi. Non a caso, la legge di Jakob ci ricorda che gli utenti passano la maggior parte del tempo su altri siti; questo genera un’aspettativa di coerenza rispetto agli schemi a cui sono già abituati.
Nel caso di Amazon, vediamo l’applicazione della quarta euristica anche solo dall’header. Quest’ultimo infatti presenta una struttura conosciuta alla maggior parte degli utenti, con il logo a sinistra, una barra di ricerca prominente e il carrello sulla destra. L’icona stessa del carrello è universalmente riconosciuta e utilizzata con la stessa funzione nel mondo dell’e-commerce.
Sempre nell’header notiamo una coerenza interna al sito grazie nell’utilizzo dello stesso font e nella formattazione del pulsante cerca, rappresentato in giallo come tutti gli altri pulsanti.
#5: Prevenzione degli errori
La quinta euristica di Nielsen non si riferisce solamente alla visualizzazione di messaggi d’errore efficaci, ma incentiva la creazione di interfacce intelligenti che puntino a prevenire errori ancor prima che si verifichino. Per realizzare interfacce di questo tipo è necessario evitare situazioni che potrebbero trarre gli utenti in inganno e concedere opzioni di conferma o smentita prima di concludere determinate operazioni.
Prima di eliminare una lista definitivamente, Amazon chiede conferma dell’operazione tramite un pop-up. Le liste della spesa potrebbero essere state composte nel giro di mesi o anni e raccogliere i prodotti preferiti dell’utente; eliminarle definitivamente per via di un clic errato costituirebbe motivo di grande frustrazione.
#6: Il riconoscimento è più efficace della memoria
Anche la sesta euristica ha lo scopo di ridurre il carico cognitivo per gli utenti, in particolare lo sforzo mnemonico. All’interno del sistema stesso, il design dovrebbe garantire che tutte le informazioni necessarie all’esecuzione di un’operazione siano disponibili in pagina o facilmente recuperabili.
Nella compilazione di un form, in questo caso per aggiungere un nuovo indirizzo al Checkout, Amazon non si affida solo al placeholder all’interno dei campi, ma mantiene una label in corrispondenza di ogni text field. Immaginando infatti di iniziare a scrivere all’interno di un campo senza etichetta, il placeholder scomparirebbe e lascerebbe all’utente il compito di ricordarsi quale informazione inserire nel campo stesso. Questo non potrebbe sembrare problematico nel caso di campi brevi e veloci da compilare (per esempio Nome e Cognome), ma estremamente fastidioso per field più lunghi e articolati come quelli dell’indirizzo.
#7: Flessibilità ed efficienza nell’utilizzo
Le user interface dovrebbero tenere in considerazione i bisogni di tutti gli utenti, dai meno esperti ai più tech-savvy. Il fatto che un sito possa essere semplice da utilizzare per principianti non dovrebbe escludere la presenza di shortcut (scorciatoie) che possano rendere la navigazione più veloce ed efficiente.
Offrire diverse possibilità di esecuzione della stessa operazione permetterà al sistema di essere adattabile alle capacità di un’utenza più ampia e varia.
Le user interface dovrebbero tenere in considerazione i bisogni di tutti gli utenti, dai meno esperti ai più tech-savvy. Il fatto che un sito possa essere semplice da utilizzare per principianti non dovrebbe escludere la presenza di shortcut (scorciatoie) che possano rendere la navigazione più veloce ed efficiente.
Offrire diverse possibilità di esecuzione della stessa operazione permetterà al sistema di essere adattabile alle capacità di un’utenza più ampia e varia.
Prendendo in considerazione un elemento fondamentale per ogni sito e-commerce, ovvero la barra di ricerca, notiamo come Amazon consenta di avviare la ricerca sia tramite il pulsante con l’icona “lente di ingrandimento”, sia premendo “Invio” sulla tastiera. Nonostante sia un comando tra i più comuni e conosciuti dalla maggior parte degli utenti, è bene tenere conto di chi è alle prime armi o non è abituato agli shortcut.
#8: Estetica e design minimalistici
Le interfacce non dovrebbero riportare informazioni irrilevanti e/o inutili. Ogni messaggio che si aggiunge a quelli già presenti grava sul carico cognitivo dell’utente ed entra in competizione con i contenuti effettivamente necessari all’espletazione delle operazioni richieste dall’interfaccia. In poche parole, e prendendo in prestito la celebre affermazione di Mies van der Rohe: “less is more”!
Tra le 10 euristiche di Nielsen, l’ottava sembra essere presa poco in considerazione da Amazon. Succede spesso che i requisiti di business finiscano per sovrastare l’esperienza utente, e nelle schermate di Amazon è evidente. Affollatissime di banner pubblicitari, carousel di upselling, prodotti in evidenza, sono talvolta difficilmente navigabili e fonte di continua distrazione. L’unica sezione del sito che mantiene un design pulito è il Checkout. Per focalizzare l’attenzione dell’utente sul processo di acquisto, spariscono l’header, il footer del sito e tutti i banner che solitamente tappezzano le interfacce. Rimangono solo gli elementi essenziali: i dati dell’utente, le informazioni relative alla spedizione, il riepilogo dell’ordine sulla destra.
#9: Aiutare gli utenti a riconoscere gli errori e a porvi rimedio
Anche se le interfacce dovrebbero essere progettate per prevenire errori, è inevitabile che talvolta si verifichino durante la navigazione o l’esecuzione di determinate operazioni. Quando questo accade, all’utente dovrebbe essere reso noto sia che cosa ha causato l’errore, sia come porvi rimedio.
La formattazione stessa degli errori è fondamentale. Il rosso trasmette universalmente un significato d’allerta (basti pensare ai cartelli stradali), per cui è una buona scelta cromatica per i messaggi d’errore. Immaginando di riportare gli errori in verde, che generalmente è riconosciuto come colore di “via libera” o di successo, si creerebbe una dissonanza cognitiva che potrebbe causare confusione nell’utente.
Inserendo un codice promozionale errato al checkout su Amazon, viene comunicato chiaramente che qualcosa è andato storto. Prima di tutto il messaggio d’errore è semplice e chiaro: “Il codice promozionale inserito non è valido”. La frase è preceduta da un punto esclamativo, segno abbastanza noto per comunicare una richiesta d’attenzione. Oltre a questo viene anche evidenziato il campo dove è stato inserito il codice errato, in modo che l’utente sappia esattamente dove intervenire per rimediare all’errore.
#10: Aiuto e documentazione
È importante fornire pagine di documentazione per risolvere problemi d’esecuzione o fornire dettagli ulteriori che occuperebbero troppo spazio se inseriti direttamente in pagina. Ci si riferisce alle classiche F.A.Q., Frequently Asked Questions, oppure a vere e proprie guide strutturate, tipicamente per siti più complessi. Talvolta dei messaggi d’aiuto possono anche essere contestuali a determinate operazioni da svolgere, tramite tooltip o link di rimando a documenti della guida.
All’interno delle schede prodotto, Amazon fa grande uso di link contestuali (“Maggiori informazioni”) che rimandano a pagine con tutte le informazioni necessarie sulle modalità di consegna.