Set 7 di 7
Bastien & Scapin
Quando usare questo set
Quando serve granularità diagnostica: documentare i problemi in modo che reggano una revisione, e separare difetti che gli altri set trattano come uno solo. È il set per chi analizza, non per chi inventa.
I criteri più “chirurgici”
J.M. Christian Bastien e Dominique L. Scapin sono due ricercatori dell’INRIA (l’istituto nazionale francese per la ricerca in informatica). Nel 1993 pubblicano un rapporto tecnico destinato a diventare un classico europeo della valutazione dell’usabilità: Ergonomic Criteria for the Evaluation of Human-Computer Interfaces.
La loro idea è semplice e potente. Le euristiche “generaliste” — pensa a Nielsen — sono ottime per farsi un’idea rapida, ma sono anche un po’ vaghe: dove finisce “coerenza” e dove comincia “standard”? Bastien e Scapin fanno l’operazione opposta. Prendono decine di raccomandazioni sparse nella letteratura ergonomica e le ordinano in un albero preciso: 8 criteri principali, alcuni dei quali si ramificano in sotto-criteri, per un totale di 18 criteri elementari.
Il risultato è lo strumento più chirurgico di questo libro. Dove Nielsen ti dà una torcia per esplorare in fretta una stanza, Bastien & Scapin ti danno un bisturi per capire esattamente quale parte dell’interfaccia sta creando il problema. Non a caso questi criteri sono nati per la valutazione: sono pensati per classificare i difetti d’usabilità nel modo più granulare e univoco possibile. E sono tra i pochi validati sperimentalmente: gli studi degli stessi autori mostrano che valutare con i criteri porta a individuare più problemi, e a classificarli in modo più uniforme, rispetto alla valutazione libera (Bastien & Scapin, 1995). Un avvertimento però: la variabilità tra valutatori resta il tallone d’Achille di ogni ispezione — è il cosiddetto evaluator effect (Jacobsen, Hertzum & John, 1998) — e i criteri la riducono, non la eliminano.
[!insight] Quando usarle Usa Bastien & Scapin quando devi documentare i problemi di un prodotto in modo rigoroso e ripetibile: un audit formale, una perizia, il confronto “prima/dopo” di un redesign, o quando più persone valutano lo stesso sistema e vuoi che parlino la stessa lingua. Per un’ispezione veloce di 30 minuti, Nielsen resta più agile.
Come per gli altri set, le definizioni dei criteri seguono la fonte originale; i commenti e gli esempi sono miei, tradotti e adattati per un pubblico non tecnico.
L’albero degli 8 criteri
- Guida → Incitazione · Raggruppamento/Distinzione tra elementi (per localizzazione e per formato) · Feedback immediato · Leggibilità
- Carico di lavoro → Brevità (concisione + azioni minime) · Densità informativa
- Controllo esplicito → Azioni esplicite · Controllo dell’utente
- Adattabilità → Flessibilità · Considerazione dell’esperienza dell’utente
- Gestione degli errori → Protezione dagli errori · Qualità dei messaggi d’errore · Correzione degli errori
- Coerenza (Omogeneità)
- Significato di codici e denominazioni
- Compatibilità
(Nella mappa “Aggregato” a fine capitolo, i criteri Bastien & Scapin sono contrassegnati dal colore viola, il nuovo colore-autore introdotto in questa edizione.)
1. Guida
Il sistema deve consigliare, orientare, informare e guidare l’utente durante l’interazione. È il criterio-ombrello che raccoglie tutto ciò che aiuta la persona a sapere dove si trova, cosa può fare e cosa è appena successo. Si divide in quattro sotto-criteri.
1.1 Incitazione
Sono tutti i mezzi che inducono l’utente a compiere azioni specifiche e lo informano su ciò che il sistema si aspetta: etichette, istruzioni, esempi di formato, indicatori di stato, campi obbligatori segnalati.
- Esempio digitale: un campo data che mostra il formato atteso gg/mm/aaaa come testo-guida, oppure un campo password che elenca in tempo reale i requisiti ancora mancanti.
- Esempio dal mondo reale: il segnavia all’imbocco di un sentiero che indica direzione, tempo di percorrenza e difficoltà. Ti mette nelle condizioni di partire senza esitare.
1.2 Raggruppamento e distinzione tra elementi
L’organizzazione visiva delle informazioni deve riflettere le loro relazioni. Elementi che appartengono alla stessa categoria vanno insieme; elementi diversi devono sembrare diversi. Si articola su due dimensioni:
- Per localizzazione: dove metti le cose. Voci correlate vicine, separatori tra gruppi distinti.
- Per formato: come le mostri. Colore, forma, dimensione e stile comunicano l’appartenenza a una categoria.
Esempio digitale: in un modulo, i campi “indirizzo di spedizione” e “indirizzo di fatturazione” sono raccolti in due blocchi visivamente separati (localizzazione); i pulsanti distruttivi sono rossi e quelli di conferma verdi (formato). Esempio dal mondo reale: lo scaffale del supermercato che tiene insieme le passate di pomodoro e le divide con un cartello dal reparto dello scatolame.
1.3 Feedback immediato
A ogni azione dell’utente deve corrispondere una risposta del sistema, rapida e adeguata. È il cugino stretto della “Visibilità dello stato del sistema” di Nielsen, ma qui l’accento è sull’immediatezza e sulla proporzione della risposta.
- Esempio digitale: il pulsante che si “abbassa” e cambia colore nel momento del tap; la spunta verde accanto a un campo compilato correttamente; la barra di avanzamento in un upload.
- Esempio dal mondo reale: il “clic” tattile dell’interruttore della luce. Anche prima che la stanza si illumini, il polpastrello sa di aver agito.
1.4 Leggibilità
Le caratteristiche lessicali e tipografiche che facilitano la lettura: contrasto testo/sfondo, dimensione dei caratteri, spaziatura, lunghezza delle righe, allineamento. È il livello basilare — ma se manca, tutto il resto crolla.
- Esempio digitale: testo scuro su fondo chiaro, corpo sufficiente, righe non troppo lunghe; i dati importanti (un totale, un codice) più grandi delle etichette.
- Nota: Tognazzini ricorda di testare sempre sulla popolazione più anziana — la presbiopia colpisce la maggior parte delle persone dopo i 45 anni.
2. Carico di lavoro
Tutto ciò che riduce il carico percettivo e cognitivo e aumenta l’efficienza. Meno cose l’utente deve leggere, ricordare e fare, meglio è. Due sotto-criteri.
2.1 Brevità
Limitare il lavoro di lettura, immissione e memorizzazione. Si scompone a sua volta in due parti:
- Concisione: ridurre il carico per singolo elemento. Etichette brevi, niente ridondanze inutili, valori di default (come le unità di misura) già inseriti dove possibile.
- Azioni minime: ridurre il numero di passaggi per raggiungere l’obiettivo. Ogni clic in più, moltiplicato per migliaia di volte, è tempo e frustrazione.
Esempio digitale: il numero di carta di credito accettato con o senza spazi (il sistema li rimuove da solo); il checkout “in un tocco” che non richiede di reinserire indirizzo e pagamento. Esempio dal mondo reale: al bar, “il solito” al posto di “cappuccio con poca schiuma, in tazza grande e fredda”. Un’azione minima costruita sulla memoria condivisa.
2.2 Densità informativa
Il carico complessivo di informazioni presenti sullo schermo. Non troppo (sovraccarico, rumore), ma nemmeno troppo poco (schermate quasi vuote che costringono a navigare avanti e indietro). L’obiettivo è mostrare ciò che serve al compito attuale, né più né meno.
- Esempio digitale: una dashboard che sintetizza i 4 indicatori chiave in alto e nasconde il dettaglio dietro un clic, invece di vomitare 40 metriche insieme.
- Attenzione: questo criterio è in tensione naturale con la “Ridondanza giudiziosa” di Gerhardt-Powals. La densità giusta non è la densità minima: è quella che minimizza il carico totale del compito.
3. Controllo esplicito
L’utente deve guidare il sistema, non subirlo. Il sistema deve fare esattamente ciò che l’utente ha chiesto, quando l’ha chiesto — e nient’altro. Due sotto-criteri.
3.1 Azioni esplicite
Il sistema deve eseguire solo le operazioni richieste dall’utente, e solo nel momento in cui le richiede. Niente azioni “a sorpresa” innescate senza un comando chiaro.
- Esempio digitale: un modulo si invia quando premi “Invia”, non quando esci dall’ultimo campo; un video parte quando lo avvii tu, con l’audio inizialmente disattivato.
- Esempio dal mondo reale: l’ascensore che parte quando premi il piano, non appena entri. L’iniziativa resta tua.
3.2 Controllo dell’utente
L’utente deve poter interrompere, annullare, mettere in pausa, riprendere qualsiasi processo. Deve sentirsi padrone della sequenza e del ritmo.
- Esempio digitale: il pulsante “Stop” sempre disponibile durante una scansione antivirus; l‘“Annulla invio” per qualche secondo dopo aver spedito un messaggio o una email.
- Ponte con Nielsen: è la “Libertà e controllo dell’utente” e il famoso CTRL+Z, visti però come requisito strutturale e non solo come cortesia.
4. Adattabilità
La capacità del sistema di comportarsi secondo il contesto e secondo i bisogni e le preferenze dell’utente. Un sistema adattabile non impone un’unica strada. Due sotto-criteri.
4.1 Flessibilità
I mezzi a disposizione dell’utente per personalizzare l’interfaccia e adattarla ai propri compiti: scorciatoie configurabili, layout riorganizzabili, più modi per compiere la stessa azione. Se sono presenti più modi per compiere una determinata azione, è più probabile che l’utente diventi esperto durante il processo di apprendimento.
- Esempio digitale: un’app di produttività che lascia scegliere quali widget mostrare in dashboard; un editor foto che offre sia i preset sia le regolazioni manuali di dettaglio.
- Esempio dal mondo reale: la sedia da ufficio regolabile in altezza, schienale e braccioli. Lo stesso oggetto serve corpi e situazioni diverse.
4.2 Livelli di competenza dell’utente
Il sistema deve rispettare i diversi livelli di competenza, dal principiante assoluto all’esperto. Non è “flessibilità di configurazione”, ma la capacità di far crescere l’utente: interfaccia guidata all’inizio, acceleratori quando si diventa esperti.
- Esempio digitale: menu con scorciatoie da tastiera invisibili al novizio ma preziose per l’esperto (Ctrl+B per il grassetto); la “rivelazione progressiva” delle funzioni avanzate solo quando l’utente è pronto (l’Active Discovery di Tognazzini).
- Ponte con Tognazzini: è il suo “software che si schiude come un fiore” man mano che l’utente diventa più capace.
5. Gestione degli errori
Tutti i mezzi per evitare gli errori, ridurne la portata e favorire il recupero. Tre sotto-criteri, che coprono le tre fasi del ciclo di vita di un errore.
5.1 Protezione dagli errori
Prevenire gli errori prima che accadano, mettendo dei vincoli utili. È “meglio prevenire che curare” reso strutturale.
- Esempio digitale: il calendario grafico che impedisce di scrivere una data inesistente;
- l’impossibilità di scegliere un orario di ritiro quando un l’ufficio è chiuso.
- Esempio dal mondo reale: la presa elettrica industriale che è sagomata e quindi entra in un solo verso. Non puoi sbagliare la polarità perché la forma non te lo permette.
5.2 Qualità dei messaggi d’errore
Quando l’errore accade comunque, il messaggio deve essere pertinente, leggibile ed esatto: dire cosa è successo, perché, e come rimediare — in linguaggio umano, non in codice.
- Non costruttivo: “Errore 0a45”.
- Costruttivo: “La data di ritiro (16 dic) non può essere successiva alla data di riconsegna (13 dic). Scegli una data di ritiro precedente.”
- Regola pratica (da ISO): immagina il messaggio scritto da un essere umano cordiale e competente. Sarebbe educato, preciso, comprensibile e visibile.
5.3 Correzione degli errori
I mezzi messi a disposizione per correggere ciò che è andato storto: annulla/ripeti, ripristino della sessione, tolleranza a input imperfetti quando l’intenzione è chiara.
- Esempio digitale: l‘“Annulla” di un’app di disegno; il file eliminato che resta recuperabile per 30 giorni; la data “15 maggio 2020” convertita automaticamente nel formato ufficiale senza infastidire l’utente.
- Ponte con le Chiavi: insieme, 5.1–5.3 sono l’esatta scomposizione della Chiave “Prevenzione e gestione degli errori”.
6. Coerenza (Omogeneità)
Le scelte di progettazione — codici, denominazioni, formati, procedure — devono essere mantenute identiche in contesti identici e diverse in contesti diversi. È forse il criterio più predittivo della qualità percepita: l’incoerenza costringe la mente a reimparare in continuazione.
- Esempio digitale: la stessa icona “matita” per “modifica” in tutte le schermate; i pulsanti d’azione sempre nella stessa posizione; il tono di voce uniforme.
- Contro-esempio classico (Tognazzini): passare da Photoshop a Illustrator a InDesign e trovare scorciatoie da tastiera diverse per la stessa azione. Ogni cambio di app costringe a “riprogrammare il cervello”.
- Sfumatura importante: coerenza non è uniformità. Oggetti che si comportano in modo diverso devono sembrare diversi (vedi l‘“incoerenza indotta” di Tognazzini): se un cestino non permette di recuperare, non chiamarlo cestino.
7. Significato di codici e denominazioni
La relazione tra un termine/segno e ciò che rappresenta deve essere forte e ovvia. Codici, sigle, icone ed etichette significativi vengono ricordati e riconosciuti meglio; quelli arbitrari costringono alla memorizzazione.
- Esempio digitale: “Trasferisci denaro” invece di “Esegui SEPA”; “Risparmi” e “Spese” invece di “Attivo” e “Passivo” in un’app per il grande pubblico; l’icona del carrello per il paniere della spesa.
- Esempio dal mondo reale: il simbolo ♻ per il riciclo: chiunque lo interpreta senza istruzioni.
- Ponte con Gerhardt-Powals: è il suo “Usa termini legati concettualmente alle funzioni”. Un buon nome è metà del lavoro di apprendimento già fatto.
8. Compatibilità
L’accordo tra le caratteristiche dell’utente (memoria, percezione, abitudini, competenze, aspettative) e l’organizzazione dei compiti, degli output e dell’interfaccia. Ma anche la coerenza tra ambienti e applicazioni diverse. In breve: l’interfaccia deve parlare la lingua del mondo dell’utente, non quella della macchina.
- Esempio digitale: un’app di e-commerce che ordina i prodotti come li cercherebbe l’utente in un negozio, usa il carrello, il checkout familiare; un software di contabilità che rispetta il gergo del commercialista, ma lo abbandona per un’app di finanza personale rivolta a tutti.
- Esempio dal mondo reale: i pedali dell’automobile nello stesso ordine in qualunque vettura del mondo. La compatibilità con l’abitudine consolidata è ciò che ti fa guidare un’auto a noleggio senza pensarci.
- Ponte con le Chiavi: è la sintesi tra “Corrispondenza con le aspettative” e “Coerenza e Standard”.
Come si integrano con le 13 Chiavi
Bastien & Scapin non aggiungono principi nuovi rispetto agli altri maestri: aggiungono precisione. Ogni criterio elementare si aggancia a una o più delle 13 Chiavi, ma con un livello di dettaglio maggiore. Ecco la mappa di corrispondenza (la trovi anche nella versione grafica “Aggregato”, colore viola):
| Criterio Bastien & Scapin | Chiave/i di UX DeCode |
|---|---|
| 1.1 Incitazione | Aiuto e Documentazione · Visibilità e Feedback |
| 1.2 Raggruppamento/Distinzione | Gestione dell’Informazione · Design efficace e chiaro |
| 1.3 Feedback immediato | Visibilità delle informazioni e Feedback |
| 1.4 Leggibilità | Accessibilità · Design efficace e chiaro |
| 2.1 Brevità (concisione + azioni minime) | Efficienza ed efficacia · Progetta per i limiti |
| 2.2 Densità informativa | Progetta per i limiti · Gestione dell’Informazione |
| 3.1 Azioni esplicite | Libertà e Regole · Prevenzione errori |
| 3.2 Controllo dell’utente | Libertà e Regole |
| 4.1 Flessibilità | Flessibilità ed Efficienza |
| 4.2 Livelli di competenza dell’utente | Flessibilità ed Efficienza · Esplorazione e Mappatura |
| 5.1 Protezione dagli errori | Prevenzione e gestione degli errori |
| 5.2 Qualità dei messaggi d’errore | Prevenzione e gestione degli errori |
| 5.3 Correzione degli errori | Prevenzione errori · Libertà e Regole |
| 6. Coerenza | Coerenza e Standard |
| 7. Significato di codici e denominazioni | Corrispondenza con le aspettative |
| 8. Compatibilità | Corrispondenza con le aspettative · Coerenza e Standard |
[!note] La conferma della “scoperta” Che anche il set più granulare e indipendente — nato in Francia, per la valutazione, trent’anni fa — converga sulle stesse 13 Chiavi è l’ennesima prova della tesi centrale di questo libro: le buone pratiche, da qualunque parte arrivino, puntano tutte nella stessa direzione.
⏱ In 30 secondi Se le euristiche di Nielsen sono la bussola, quelle di Bastien & Scapin sono il microscopio: 8 criteri, 18 criteri elementari, nati per la valutazione e validati sperimentalmente. Le prime ti dicono in fretta che qualcosa non va; le seconde ti dicono con esattezza cosa e dove. Tienile per quando devi passare dall’intuizione al referto: un audit che regge in una riunione, una perizia, un confronto rigoroso tra due versioni di un prodotto.
Fonti: Bastien, J.M.C. & Scapin, D.L. (1993), «Ergonomic Criteria for the Evaluation of Human-Computer Interfaces», INRIA, Rapport technique n°156 · Bastien, J.M.C. & Scapin, D.L. (1995), «Evaluating a user interface with ergonomic criteria», International Journal of Human-Computer Interaction, 7(2).
Dove si aggancia alle Chiavi
15 euristiche di questo set confluiscono in 13 Chiavi.
| Chiave | Euristiche |
|---|---|
| 01 · Accessibilità | Leggibilità (1.4) |
| 02 · Aiuto e Documentazione | Incitazione (1.1) |
| 03 · Coerenza e Standard | Coerenza / Omogeneità (6) · Compatibilità (8) |
| 04 · Corrispondenza con le aspettative (dell'utente) | Significato di codici e denominazioni (7) · Compatibilità (8) |
| 05 · Design efficace e chiaro | Raggruppamento/Distinzione (1.2) · Leggibilità (1.4) |
| 06 · Esplorazione e Mappatura | Livelli di competenza dell'utente (4.2) |
| 07 · Flessibilità ed Efficienza | Flessibilità (4.1) · Livelli di competenza (4.2) |
| 08 · Visibilità delle informazioni e Feedback | Feedback immediato (1.3) · Incitazione (1.1) |
| 09 · Progetta per i limiti | Brevità (2.1) · Densità informativa (2.2) |
| 10 · Gestione dell'Informazione | Raggruppamento/Distinzione (1.2) · Densità informativa (2.2) |
| 11 · Prevenzione e gestione degli errori | Protezione (5.1) · Qualità dei messaggi (5.2) · Correzione (5.3) |
| 12 · Efficienza ed efficacia (dell'utente e del sistema) | Brevità / Azioni minime (2.1) |
| 13 · Libertà e Regole | Azioni esplicite (3.1) · Controllo dell'utente (3.2) |