Parte quarta: L usabilità Ingegneria del Software Interattivo Usabilità: I Principi di Nielsen Docente: Daniela Fogli 1. L ingegneria dell usabilità Nel Contesto - I principi Umano di Nielsen Calcolatore 2. I metodi di valutazione di usabilità dei sistemi interattivi - Valutazione euristica attraverso di dieci principi di Nielsen - Valutazione di usabilità attraverso il metodo del walkthrough cognitivo - Gli esperimenti Processo con gli di utenti Sviluppo - Altre tecniche oltre gli esperimenti 2 L usabilità secondo Nielsen Individua alcune caratteristiche base dei sistemi usabili Deriva dieci principi, da usare nell analisi, nel progetto e nella valutazione 3 I principi euristici di Nielsen 1. Far vedere lo stato del sistema (feedback) 2. Adeguare il sistema al mondo reale (parlare il linguaggio dell utente) 3. Controllo dell utente e libertà (uscite indicate chiaramente) 4. Assicurare consistenza (nell applicazione, sistema, ambiente) 5. Riconoscimento piuttosto che uso della memoria dell utente 6. Assicurare flessibilità ed efficienza d uso (acceleratori) 7. Visualizzare tutte e sole le informazioni necessarie 8. Prevenire gli errori 9. Permettere all utente di correggere gli errori e non solo di rilevarli 10. Help e documentazione percezione cognizione errori 4
1. Far vedere lo stato del sistema (feedback) Il sistema deve informare continuamente l utente di ciò che sta facendo e come sta interpretando gli input dell utente L utente deve poter capire l effetto dell azione passata sullo stato presente e individuare le possibili nuove azioni Fornire indicazioni sui malfunzionamenti (perchè) Ma feedback non solo quando c è un errore Segnalare ad esempio con cambio di cursore se il sistema sta facendo un elaborazione o sta aspettando un input Espresso in maniera concreta non astratta o in termini generali (es. copia file) Il feedback può avere differenti gradi di persistenza Il feedback è importante nel caso di operazioni che richiedono una lunga elaborazione (elevato tempo di risposta) 5 Esempio Copia di file con lo stesso nome su un altro disco Feeback peggiore: dire che si sta sovrascrivendo un file senza dire quale Feedback migliore: dire quale file si sta sovrascrivendo indicando altri dati (es. data di ultima modifica) 6 Feeback con diversi gradi di persistenza Persistenza breve: un messaggio che la stampante ha finito la carta, un tooltip che appare spostandosi su un pulsante Persistenza media: sta sullo schermo finché l utente esplicitamente non lo riconosce. Es. un messaggio che dice che una stampa è stata re-diretta su un altra stampante per indisponibilità di quella scelta Persistenza alta: rimane una parte permanente dello schermo. Es. lo stato della batteria nei portatili quando non collegati alla corrente elettrica 7 Un caso: sistema di automazione (cortesia CB&CJB automazione-brescia) La macchina originale: lo stato non è mostrato Il prototipo proposto: lo stato è evidente ed esplorabile 8
Segnalazione malfunzionamenti Nella macchina originale segnalazioni di difficile comprensione (con cattivo uso dello spazio) 2. Adeguare il sistema al mondo reale (parlare il linguaggio dell utente) Permettere all utente di sfruttare la sua esperienza nell interagire con il sistema Familiarità: adotta le notazioni di utente, convenzioni sui nomi Proiezione mondo reale schermo metafore (richiede di capire l utente e il contesto) I dialoghi se possibile devono essere nella lingua nativa dell utente, così come le icone devono rispettare la cultura Affordance percepita: legata alla cultura dell utente (le icone Microsoft sono poco suggestive per chi usa altri sistemi o nessun sistema) 9 10 Terminologia? Quale lingua? 11 12
Icone più o meno suggestive Esempio: le icone possono differire a seconda della cultura - il caso delle emoticons - Content West shape JPm shape JPw shape Disappointing Enjoyable? Surprising Not recommended 13 14 3. Controllo dell utente e libertà Gli utenti non si devono sentire intrappolati dal computer Devono sentire che sono loro che controllano il dialogo Predicibilità del sistema: supportare l utente nel prevedere l effetto delle azioni future in base alle interazioni passate Offrire sempre all utente un modo semplice per uscire dalla situazione corrente chiare vie di uscita Offrire sempre delle possibilità di undo Vie di uscita e undo permettono all utente di imparare esplorando il sistema Permettere di interrompere o cancellare operazioni che durano troppo (limite dei 10 secondi) Meccanismi ben visibili e comprensibili: l utente compie errori anche con strumenti perfetti Uscita - non ben individuata ma anche - non parla il linguaggio utente Chiare vie di uscita 15 16
Undo Premendo per sbaglio il bottone di chiusura in alto a destra L utente deve sempre, per quanto è possibile, poter ripristinare lo stato precedente e così via, all indietro, senza limitazioni non sempre si individuano gli errori immediatamente il numero di funzioni di UNDO possibili deve essere almeno pari a quello dei comandi presenti 17 18 Non tutte le azioni sono disfacibili Alcuni comandi sono molto difficili da recuperare: Es. nelle e-mail: dopo la scelta di INVIO per l'invio della posta elettronica, l'utente non può più recuperare lo stato precedente a tale comando i comandi tempo-dipendenti, in particolare, hanno SIDE EFFECTS (effetti collaterali): non si può tornare indietro nel tempo! Flip undo FLIP-UNDO: l'ultimo UNDO annulla l'effetto dell'undo precedentemente effettuato Un FLIP UNDO ha senso se "tutti i comandi devono essere trattati in maniera uguale : tutti i comandi devono essere recuperati compreso l'undo stesso La ragione perché UNDO venga trattato uniformemente è dovuta a scelte fatte da quei progettisti che ritengono sufficiente un UNDO relativo solamente all'ultimo comando immesso perché è facile da realizzare 19 20
Multiple step I meccanismi di UNDO del tipo MULTIPLE-STEP (al contrario del FLIP-UNDO) consentono di eseguire UNDO un numero indefinito di volte, o almeno fino a che il sistema ha informazioni disponibili sull interazione passata Per poter correggere eventuali errori nell utilizzo di UNDO viene inserito il comando REDO che consente di ripristinare l azione annullata dall ultimo comando di UNDO Es: 21 4. Assicurare consistenza Uno dei principi base dell usabilità Lo stesso comando o la stessa azione hanno sempre lo stesso effetto l utente acquista confidenza con il sistema ed è incoraggiato a esplorare Somiglianza in situazioni simili o perseguendo scopi simili nell ambito di una applicazione, tra applicazioni diverse nell ambito di un compito, tra le aspettative dell utente (modello mentale) e il modello concettuale del sistema Generalizzabilità: supportare gli utenti ad estendere la loro esperienza da situazioni note a situazioni mai incontrate Un tipo di consistenza: la stessa informazione presentata sempre nella stessa locazione in generale: mantenere consistenza nel layout dell interfaccia 22 Un classico: inconsistenza nella locazione del bottone di help Sito del Comune di Brescia (vecchia versione) Navigazione per eventi della vita e anche nel tipo di comando 23 24
Navigazione per settori comunali Navigazione per servizi online 25 26 Confrontiamo ora le barre di navigazione Nella navigazione per eventi della vita (e servizi online) Nella navigazione per settori comunali 27 Garantire la consistenza Nell ambito del gruppo di sviluppo adottare o definire gli standard di rappresentazione e di interazione con rigore e farli rispettare 28
Definire lo standard Ad esempio definire come si interagisce con i menu, come organizzarli, qual è il font usato per le voci di menu Es. applicazioni della suite MS Office Consistenza fra modello concettuale e compiti dell utente In questo caso si è definito un Linguaggio Visuale fondato sulla metafora dell officina ma non è solo questione di organizzazione dello schermo 29 30 5. Riconoscimento piuttosto che uso della memoria Rendere visibili gli elementi del processo Mostrare elementi del dialogo e permettere all utente di scegliere (menu) Facilitare la creazione di nuovi elementi mediante modifica di elementi esistenti (nomi, definizioni, programmi) Usare comandi generici (facilitano trasferimento conoscenza da un sistema ad un altro - facilitano consistenza fra applicazioni): es. il comando incolla funziona (quasi) allo stesso modo per testi e immagini Si basa sulla visibilità degli oggetti ma mostrare troppi oggetti offusca la scelta, dunque attenzione a mostrare ciò di cui l utente ha bisogno (vedi principio 7) Riconoscimento piuttosto che ricordo: Esempio 1 Obbliga l utente a ricordare dati che sono già stati inseriti o che sono calcolabili (i codici sono di solito noti, e potrebbero essere richiamati da un elenco) 31 32
Riconoscimento piuttosto che ricordo: esempio 2 Se si richiede all utente di fornire un dato, descrivergli il formato, magari anche con un esempio Sistema che chiede data: Enter date (DD-MM-YY, e.g 31-Mar-06) Oppure fornire un valore di default (es. la data di oggi) L utente non deve necessariamente conoscere l intervallo dei valori legali di ingresso, il sistema deve fornire questa informazione Left margin: points[0-128] 1) 2) 3) 4) Quattro modi diversi per richiedere la data di nascita Da Polillo R., il check-up dei siti Web, Apogeo, Milano 2004 33 34 6. Assicurare flessibilità ed efficienza d uso L utente esperto deve poter svolgere velocemente le operazioni più frequenti Uso di shortcuts (acceleratori): es. ctrl-c, ctrl-v Flessibilità nel senso che il sistema deve permettere di fare le stesse cose in maniere diverse (ad es. per utente novizio e per utente esperto) Altri esempi: segnalibri (bookmarks) uso della storia dell interazione (es. file usati di recente) definizione di templates e macro type-ahead (poter inserire il prossimo input prima che il computer sia pronto ad accettarlo) Personalizzazione ed Acceleratori fornire valori di default 35 36 Abilità d uso ed efficienza Sistema adattabile: Sistema adattivo: è l utente che adatta è il sistema che si adatta -Adattabile (adattivo) in base alla variabile capacità dell utente tempo
7. Visualizzare tutte e sole le informazioni necessarie Dove saranno gli stage che mi potrebbero interessare? L interfaccia deve essere semplice e rispecchiare nella maniera più naturale possibile i compiti dell utente Presentare solo l informazione che l utente vuole quando l utente la vuole, come l utente la vuole dove l utente la vuole quindi non accompagnata da informazioni non rilevanti, o fuorvianti Raggruppare le informazioni che vengono usate assieme Presentare le informazioni in modo da suggerire la sequenza di azioni (es. i campi di una finestra di dialogo dall alto in basso) 37 38 Perché mostrarli se non sono disponibili? Una credenza errata Più opzioni offro e più modi di fare le cose metto a disposizione, più utenti soddisfo Ogni volta che si aggiunge un opzione l utente ha una cosa in più da imparare (se la trova ) e da usare in maniera scorretta e inoltre i manuali diventano sempre più grandi e complicati Un alternativa: offrire diversi modi utente : es. per novizio ed esperto, per operatore di linea e manutentore, etc. 39 40
Solo le informazioni necessarie Raggruppare le informazioni Lo schermo è inflazionato da informazioni di cui molte utili solo per particolari categorie d'utenti Nella schermata riportata, per esempio, la parte evidenziata è utile solo per il manutentore (ricordare variabilità degli utenti) 41 42 Importanza della grafica, del layout e del colore Mettere prima le informazioni che vengono lette prima (da sinistra a destra per la lettura occidentale) Solo se necessario usare oggetti lampeggianti per attirare l attenzione (però sono fastidiosi) oppure USARE CARATTERI MAIUSCOLI, ma con parsimonia perché rallentano del 10% la velocità di lettura Non usare più di 5-7 colori, non usare colori brillanti per lo sfondo Assicurarsi che gli elementi dell interfaccia si distinguano anche senza i colori Non dedicare troppo spazio a titolo, nome del venditore, numero di versione, e informazioni simili 43 8. Prevenire gli errori Individuare le situazioni di possibile errore e cercare di aiutare l utente Creare meccanismi di prevenzione: es. selezionare un file da un menu piuttosto che richiedere di digitarne il nome permette di prevenire una digitazione errata Creare meccanismi di comunicazione utente progettista: errori dell utente rilevati nell uso portano al ri-progetto Riduzione errori tramite richiesta di conferma di un azione ( sei sicuro di voler cancellare il file ) Attenzione alle sequenze: se l utente è andato avanti premendo OK ma un click su un certo OK può essere fatale Evitare comandi troppo simili 44
8. Prevenire gli errori Tecniche di prevenzione 8. Prevenire gli errori Amodalità Amodalità Funzioni vincolate Avvertimenti e richieste di conferma Default inoffensivi Bypass sicuri Comportamento modale: il sistema si comporta diversamente a seconda dello stato (o modalità ) corrente evitare comportamenti modali (tradeoff con principio 7), oppure evidenziare chiaramente la modalità corrente 45 46 8. Prevenire gli errori Funzioni vincolate cursore modale : indica che sono in modalità matita Progettare le varie funzioni in modo da rendere impossibili le azioni non lecite nel contesto corrente Esempio: La portiera dell auto può essere chiusa solo con la chiave, non con la sicura in tal modo è impossibile restare chiusi fuori per errore 47 48
Azioni prive di senso nel contesto corrente sono disattivate Quasi tutte le voci selezionabili da insiemi predefiniti 49 Da Polillo R., il check-up dei siti Web, Apogeo, Milano 2004 50 Anche qui, ma è possibile inserire date inesistenti 8. Prevenire gli errori Avvertimenti e richieste di conferma Livelli di allerta: Tieni presente che E proprio questo che vuoi? Fermo! 51 52
Note alert box (Livello 1) 8. Prevenire gli errori Richieste di conferma Chiedere sempre conferma prima di effettuare azioni irreversibili o comunque pericolose ma senza esagerare! Caution alert box (Livello 2) Stop alert box (Livello 3) 53 54 8. Prevenire gli errori Avvertimenti e richieste di conferma 8. Prevenire gli errori Avvertimenti e richieste di conferma Poco usabile! ma serve per proteggere l utente da se stesso 55 Solution implica che c è un problema: quale? Da: Microsoft Access 95 56
8. Prevenire gli errori Avvertimenti e richieste di conferma Ed ora? Un po fuorviante 57 58 8. Prevenire gli errori Default inoffensivi Un valore, uno stato o un azione che un dispositivo o un programma seleziona automaticamente a meno che l utente non specifichi un valore sostitutivo Un default inoffensivo: data e ora corrente Esempi: Word processor stabilisce i margini e il formato della pagina Alcuni programmi creano copia di scorta (back up) Usare per quanto è possibile default inoffensivi 59 60
8. Prevenire gli errori Bypass sicuri Suggerire un azione sicura in alternativa ad azioni che possono condurre ad errori BYPASS SICURO 61 62 9. Permettere all utente di correggere gli errori e non solo di rilevarli Un messaggio poco chiaro e che usa codici Buoni messaggi di errore in linguaggio chiaro e senza codici indicazioni precise indicare come risolvere il problema essere gentili Recoverability: capacità di raggiungere il risultato voluto, dopo aver commesso l errore Azioni difficili da correggere dovrebbero essere difficili da fare 63 64
Messaggi precisi e costruttivi E chiaro cosa occorre fare? Invece di dire Dire non posso aprire questo documento non posso aprire Capitolo 5 perché non è sul disco Essere costruttivi anche tramite correttori ortografici Da Polillo R., il check-up dei siti Web, Apogeo, Milano 2004 65 66 Messaggi gentili Così è più chiaro e non intimidatori ILLEGAL USER ACTION, JOB ABORTED! Da Polillo R., il check-up dei siti Web, Apogeo, Milano 2004 67 Evitare l utilizzo di termini come fatale, illegale, 68
In caso di errore... 1. ALERT qualcosa non va 2. IDENTIFY è questo che non va 3. DIRECT ora devi fare questo ALERT IDENTIFY DIRECT 69 70 IDENTIFY ALERT DIRECT 71 72
Granularità dei messaggi di errore Un messaggio di errore alla volta Un messaggio di errore alla volta, appena ho commesso l errore. oppure tutti i messaggi di errore insieme, alla fine? 73 Da Polillo R., il check-up dei siti Web, Apogeo, Milano 2004 74 Tutti i messaggi di errore insieme Ma forse è meglio così 75 Da Polillo R., il check-up dei siti Web, Apogeo, Milano 2004 76
Cambiare atteggiamento verso l errore Progettare per l errore: in sintesi 1. Comprendere le cause di errore, e minimizzarle (prevenzione) 2. Facilitare la scoperta degli errori che comunque accadono, e facilitarne la correzione 3. Rendere ogni azione reversibile, o rendere difficili le azioni irreversibili (undo) 4. Cambiare atteggiamento verso l errore: non giusto/sbagliato, ma approssimazioni verso l obbiettivo 77 78 10. Fornire aiuto e documentazione Il sistema perfetto è così facile da usare che non ha bisogno di help e di manuali Siccome il sistema perfetto ancora non esiste è sempre bene prevedere help e manuali ( e per i sistemi walk-up-and-use?) Ma gli utenti non leggono i manuali, preferiscono provare a usare il sistema senza aver letto alcuna spiegazione Quindi Mai dire: è tutto scritto nel manuale d uso Fornire help in linea con documentazione raggiungibile in modo preciso Manuali necessari nel momento in cui l utente vuole diventare più esperto L help deve essere minimalista e contestuale (es. tooltip) Anche l help, visto come sistema a se stante, può presentare problemi di usabilità 79 Per i siti web una funzione di help è svolta ad es. dalla mappa del sito 80