La User Experience e l’usabilità sono antrambi indicatori di qualità di un’interfaccia o di un prodotto. Più precisamente, l’usabilità ci dice quanto è necessario per imparare ad usare una cosa, con quanta efficienza la si usa poi, quanto si riesce a ricordare il funzionamento, quanto è alta la probabilità di fare errori e la soddisfazione risultante  quando la si usa.

La User Experience aggiunge a tutto questo i sentimenti. L’obbiettivo è il far sentire bene, immergere l’utente in un’esperienza gradevole e memorabile. Lo scopo è raggiungere la felicità.

[caption id="attachment_1572" align="alignnone" width="1000"]UX and emotions UX and emotions[/caption]

Conoscenza nel mondo e conoscenza nella testa

Usare la conoscenza nel mondo e conoscenza nella testa.

E’ uno dei principi di Norman dell’usabilità e lo ritengo uno dei principi più importanti della psicologia cognitiva.

Come uomini siamo limitati in termini cognitivi. La nostra memoria di lavoro è limitata (7+2), le emozioni condizionano le nostre valutazioni e le tecnologie i dispositivi e servizi aumentano ogni giorno e con loro lo sforzo cognitivo per utilizzali.

Abbiamo già affrontato queste tematiche in post precedenti e sappiamo che non dobbiamo scoraggiarci perchè ce la sappiamo, sempre e comunque, cavare.

Ma come ci riusciamo? combinando la conoscenza nel mondo esterno con la conoscenza che abbiamo in testa; una combinazione che ognuno di noi usa da quando è nato senza neanche saperlo.

Senza andare a pensare cose strane e astruse basta pensare a quanti di noi organizzano la propria scrivania, la libreria, il tavolo di lavoro nel modo più congeniale alle proprie necessità e gusti.

Nel suo piccolo “questa tecnica” è un modo per “trasferire” conoscenza dalla nostra testa al mondo esterno.

La semplice dislocazione dei singoli degli oggetti ci dà ad esempio un’infinita serie di indicazioni: il foglio messo sopra è l’ultimo utilizzato, il raccoglitore sulla scrivania è quello maggiormente utilizzato mentre quelli nell’armadio sono usati meno spesso, i documenti importanti sono nelle cartelline “di pregio” mentre quelli quotidiani sono in cartelline semplici di plastica.

Per capire il principio dobbiamo pensare all’incontrario, ovvero pensare ad esempio: se dovessi recuperare il documento del più importante contratto mai stipulato, dove lo cercherei?

La logica mi direbbe che sarebbe nella librerie dei documenti importanti, magari chiuso sotto chiave, nella cartellina di pelle. Andrei li senza esitazioni.

Questo semplice esempio fa capire come spostare un’informazione dalla nostra testa al mondo esterno sia un processo naturale e quotidiano e che per quanto sia semplice abbia un potenziale enorme che è un peccato non sfruttare.

Un’altro esempio della sua applicazione pratica è quando ci vogliamo ricordare di prendere qualcosa prima di uscire di casa. Se devo prendere qualcosa di non consueto lo metto vicino alla porta di uscita (gli impongo cioè un vincolo), così la sua semplice vista mi suggerisce “portami con te”.

O mettere le cose vicino alle chiavi della macchina (magari sopra altrimenti potrei prendere le chiavi e non l’oggetto) così mi sarà “impossibile” uscire senza prenderle.

Un altro esempio banale di questo concetto è lo scriversi le cose. Lavagnette, post-it, quaderni, fogli ecc da sempre sono utilizzati per ricordarci le cose, per organizzarle, per classificarle e per riportarle alla mente con una semplice lettura.

I preferiti nelle pagine di navigazione sui browser, l’organizzazione in cartelle dei files sul proprio computer, la dislocazione delle cartelle e degli applicativi sul desktop… tutti esempi di come ogni giorno trasferiamo informazioni su soggetti terzi esterni alla nostra mente.

Nel corso degli anni non ho più vivi i ricordi di molti corsi universitari o corsi di formazione ma so dove trovare i libri e gli appunti di ogni corso. La conoscenza non è annullata del tutto, si è “compressa” nel ricordo di quale contenitore contiene quel determinato corso (o meglio basta che legga l’etichetta del contenitore). Ecco appunto quel libro, quel quaderno sono prolungamenti della mia memoria e dei miei pensieri.

La stessa cosa non vale ad esempio per i libri che non ho letto e che si trovano comunque nella mia libreria. Non so cosa c’è scritto o di cosa parlino. Non mi dicono niente o meglio in quest’ottica sono ancora “slot” di memoria non utilizzati.

 

Tecnologia e conoscenza dal mondo esterno

Il più semplice esempio di conoscenza nel mondo esterno applicata alla tecnologia è la semplice calcolatrice.

Personalmente non credo sia importante ne necessario saper fare calcoli complessi con foglio e penna. L’utilizzo della calcolatrice sposta problemi computazionali dalla nostra testa ad un oggetto esterno, la calcolatrice appunto.

In un certo senso è uno strumento che migliora le nostre prestazioni mentali facendoci risparmiare tempo e fatica che possiamo impiegare nella soluzione di altri tipi di problemi.

Un altro esempio sono le notifiche che impostiamo per ricordarci di fare qualcosa in un certo momento.

Le notifiche ottimali sono composte da due componenti, l’alert ovvero il segnale sonoro, visivo, tattile ecc e il messaggio, ovvero l’informazione che trasmettono.

Pensiamo al nodo sul fazzoletto. Questo è composto solo da un alert, ovvero notifica qualcosa, ma non specifica che cosa voglia significare né il momento in cui la notifica sarebbe rilevante.

Potrei vedere il nodo troppo tardi o troppo presto o neanche vederlo, ed ecco che perderei la sua utilità.

Oppure pur vedendolo nel momento opportuno potrei essermi scordato cosa avrebbe dovuto ricordarmi.

Le notifiche più appropiate sono quelle impostabili ad un certo orario e contenenti un messaggio chiaro ed esplicito.

Ecco che negli ultimi anni sono nati numerosi servizio di questo tipo e oggi è un mercato in forte espansione.

Frigoriferi smart, lavatrici smart, lavastoviglie smart ecc sono esempi lampanti. Possono essere impostati varie tipi di notifiche (es operazione completata) e anche queste, nel loro modo, ci aiutano a scaricare la nostra mente e a liberare risorse cognitive preziose .

Qualche tempo fa mi sono imbattuto in un servizio interessante , IFTTT , (if this than that, se (accade) Questo Allora (fa’) Quello) che in soldoni permette di legare eventi provenienti dalle più disparate sorgenti per attuare certi azioni su altre. Ad esempio è possibile legare un servizio meteo a degli scenari luci (es philips hue) o un evento su un canale social ad una notifica personalizzata, generare eventi in date prefissate e mille altre possibilità e combinazioni.

A me piace questo servizio perchè è gratuito e secondo può essere utile per “distribuire conoscenza” nel mondo esterno.

Faccio un esempio. Ho impostato le luci di cucina in modo che la sera alle 9 abbiano un colore a seconda del meteo del giorno successivo: verdi=bel tempo, gialle=così e così, rosse= pioggia, bianche=freddo.

In questo modo è il colore delle luci che mi da un’informazione diretta e mi evita di dover andare sul sito dedicato al meteo o guardare le previsioni alla televisione.

Sfrutto la tecnologia (luci intelligenti ed API servizio meteo) per reperire e rappresentare un’ informazione “innestandola” in un ambiente quotidiano in maniera naturale e trasparente.

Mondo esterno ed intelligenza

Ogni volta che per eseguire un compito possiamo recuperare un’informazione  dal mondo esterno la necessità di apprendimento e lo sforzo mnemonico si riduce.

Ecco che mapping naturale, vincoli (come d esempio imbattersi per forza con l’oggetto da portar via perchè posizionato davanti alla porta), affordance e significanti sono tecniche potenti per rendere estremamente efficiente questa collaborazione tra cervello e mondo esterno.

Può essere dannoso contare troppo sulla conoscenza esterna intesa sia come conoscenza nel mondo,  quella fornita dalla tecnologia o quella dei nostri amici? Il troppo in questo senso non esiste; più riusciamo a sfruttare tali risorse tanto migliori saranno le nostre prestazioni.

La conoscenza esterna ci rende più intelligenti e più adatti a questo mondo in continua evoluzione.

conoscenza nel mondo e conoscenza nella testa

conoscenza nel mondo e conoscenza nella testa

Basta saperla conoscere ed interpretare correttamente e per fare questo basta una buona dose di esperienza e molto spirito di osservazione.

 

 

 

Esperienza utente e livelli di elaborazione

L’esperienza utente come è legata ai livelli di elaborazione cognitivi – emozionali?

La soddisfazione dei tre livelli di elaborazione viscerale, comportamentale e riflessiva non sempre è verificata negli oggetti o in generale in un qualsiasi soggetto con cui abbiamo che fare.

Ci possono essere oggetti che soddisfano soltanto uno di questi ambiti, ma lo fanno così bene da essere comunque considerati importanti nella nostra vita.

Faccio un esempio per chiarire il concetto.

Design viscerale, comportamentale e riflessivo

Possiedo tre borse porta documenti/PC.

 

La prima è completamente di pelle, è liscia, levigata e diffonde l’odore di pelle nell’ambiente in cui si trova. Ha delle bellissime cuciture, curate nei dettagli e nella fattura.

Mi piace vederla quando entro nel mio studio, e passarci una mano sopra per il gusto di sentirne la superficie.

Per quanto riguardo l’utilizzo pratico perde invece punti in quanto non è adatta a portare un portatile al suo interno, ha le tasche troppo piccole, ma non della dimensione giusta per i modelli tablet.

In conclusione è impossibile trasportarci un portatile ed è scomodo per un tablet… è perfetto per fogli e documenti, ma non per il resto. Non ha neanche la tracolla.

Risultato? Se decido di usare questa borsa sono costretto o a lasciare pc e tablet a casa o conpensare in un altro modo.

Data la sua scarsa utilità pratica l’avrò utilizzata penso i tutto 3 volte. Di conseguenza non porta con se alcuna storia da raccontare, nessun ricordo o avventura da condividere con gli amici.

E’ bella, mi piace vederla, toccarla ed annusarla. Ma stop nient’altro.

Esperienza d'uso: livello viscerale

Esperienza utente: livello viscerale

Votazione:

  1. 100% viscerale
  2. 10%  comportamentale
  3. 10%  riflessivo

La seconda è la classica borsa a tracolla per portatile, di plastica e tessuto nero. Il suo design è essenziale e adatto al suo scopo: essere una borsa per tutti i giorni. Ha tutti gli scompartimenti sia per documenti, portatile, tablet (standard e mini) e perfino per smartphone con tutte le imbottiture del caso per prevenire gli urti.

Ha una tracolla imbottita in maniera intelligente, solo nei punti di contatto con la spalla; ha un sistema di ammortizzamento per l’impugnatura e volendo si può anche mettere sulle spalle (con una particolare cinghia data in dotazione) a mo’ di cartella.

La praticità e usabilità è il suo punto di forza ma anche la sua croce. Usandola tutti i giorni è la borsa “del quotidiano” quando non c’è nessun evento particolare; insomma la classica borsa da giornata standard da ufficio.

Ce ne sono decine di similari in qualsiasi ambiente di lavoro, e la sua presenza non genera alcuna curiosità o motivo di chiacchiere.

Esperienza d'uso: livello comportamentale

Esperienza utente: livello comportamentale

Votazione:

  1. 10% viscerale
  2. 100% comportamentale
  3. 10% riflessivo

 

La terza borsa è una storia più che una borsa. Potrei scriverci una decina di post e non avere ancora concluso tutto quello che ho da raccontare a riguardo.

L’ho presa su internet e mi è arrivata con un mese di ritardo… era stata persa dal corriere. Era nata predestinata.

E’ di un misto tessuto marroncino e finta pelle con la tracolla e manico anch’esse di tessuto. E’ gradevole alla vista ma per il resto è una borsa comune.

Lo scompartimento per il portatile è misero misero, nel senso che ci metto il portatile non ci sta altro se non un foglio. Non ha imbottiture interne e quando ci metto il mio tablet ho sempre paura di arrivare a casa e trovarne due  (di tablet).

Una volta l’ho lasciata sul treno e sono andato a recuperarla la mattina seguente alla stazione di la Spezia. Dentro c’era ancora il pc. Era stata vista dagli uomini delle pulizie e portata alla polizia ferroviaria.

Un’altra volta ci avevo messo a forza un portatile più grande della media e al momento della riunione, davanti al manager, non mi veniva più fuori. Tira tira tira alla fine ce l’ho fatta non senza conseguenze per la tasca interna.

E’ vissuta nonostante l’utilizzo saltuario.

Si perchè è molto probabile che se la uso capiti qualcosa. Qualcuno direbbe che è una borsa porta sfiga, ma in realtà poverina ha sempre fatto il suo dovere e se l’è sempre cavata.

Solo guardandola mi si aprono in testa un milione di ricordi e situazioni che sono “fiero” di raccontare a chiunque mi capiti sotto tiro.

Quando la porto in ufficio capita che qualcuno notandola mi chieda: “e questa?”

E io parto a chiacchierare finchè non noto cenni di cedimento sul viso dell’interlocutore.

E’ pure capitato di un collega che, talmente coinvolto dalla storia, mi ha chiesto se gliela prestavo perchè voleva farla vedere alla moglie… In conclusione

Esperienza d'uso: livello riflessivo

Esperienza utente: livello riflessivo

Votazione:

  1. 10%  viscerale
  2. 10%  comportamentale
  3. 100%  riflessivo

 

Ho riportato questo esempio per cercare di far capire come l’esperienza complessiva nei confronti di un soggetto terzo (sia un oggetto, un servizio, una persona) possa essere sfaccettata e interpretata su diversi livelli.

Affinchè l’ oggetto sia ritenuto “importante” è sufficiente che soddisfi almeno uno dei tre stadi, ma la sfida è cercare di creare prodotti “completi” che coinvolgano ed abbraccino tutti e tre.

L’impresa non è semplice in quanto ogni esperienza concreta li comprenderà tutti e tre e non sempre la distinzione è così chiara in quanto possono giocare brutti scherzi come ad esempio entrare il conflitto fra loro.

I tre livelli in conflitto

Qualche tempo fà ero in compagnia di un compagno di liceo. Eravamo a casa mia ed ad un certo punto ho aperto un cassetto per prendere una cosa. In quel momento ho intravisto la calcolatrice che usavo al liceo. La prendo e la porto di là. “Ti ricordi questa?” Gli chiedo. “Sii grande!” fu la risposta.

Quella calcolatrice l’avevamo comprata il primo anno del liceo per il corso di fisica. Ci era stata consigliata dal professore e la maggior parte di noi aveva seguito il consiglio.

La prima reazione alla vista della calcolatrice “sii grande” è stata quindi estremamente positiva. Ed infatti anche a me la prima sensazione che generava era positiva.

Positiva perchè in primis la calcolatrice dopo quasi 20 anni era ancora bella nonostante il tempo. Schermo LCD multilinea, un bel colore nero, angoli leggermente stondati su una design serio, custodia in pelle. Positiva perchè ricordava “i bei tempi andati” di quando eravamo ragazzini alla prime prese con la fisica.

Durante la conversazione si sono sono toccati diversi tematiche, come ad esempio l’utilità di una piccola taschina nera nella parte interna della custodia che TUTTI usavamo per metterci i “fogliettini” per le formule o i compiti (mi chiedo ora se il professore era stato complice di questo “utilizzo furbetto” avendocela direttamente consigliata lui… come per dire “nella vita esistono le cose serie e noiose ma esiste sempre un modo per girargli intorno”… o almeno a me piace vederla così).

Con lei ho fatto la prima esperienza di programmazione in quanto si potevano definire delle funzioni, anche molto complesse, e richiamarle al momento opportuno.

Li’ ho capito l’utilità di definire le funzioni nella programmazione; me l’ha fatto capire meglio lei che il professore di informatica all’università.

Sono poi venuti alla mente vari episodi come ad esempio la maturità, il primo esame universitario di fisica ecc ecc.

Ed infine la “bella favola “si è rotta ricordando il difetto: non segnalava il livello di batteria (pile).

Il problema è che con tutte quelle funzionalità la batteria durava qualche settimana e ti ritrovavi all’improvviso che non si accendeva o si spengeva di botto.

Sembra una cosa da niente ma per me è stata fonte di non poche preoccupazioni.

“Domattina durante il compito mi pianterà in asso?”. Ero costretto quindi a portarmi dietro sempre una pila nel caso in cui si spengesse.

Una volta mi capitò proprio che nel bel mezzo di un compito si spense. Cambiai la pila ma una volta riaccesa (e dopo più di 10 minuti di tempo perso tra apri sostituisci e chiudi … aprirla non era facile per niente) aveva cancellato la storia delle operazioni che avevo compiuto quella mattina e non potevo richiamarle o rivederle. Risultato: fatto poco più di metà del compito in classe…

Mi incavolai talmente tanto che per anni non l’ho più voluta vedere.

La cosa sorprendente fu scoprire che una cosa analoga accadde anche al mio amico.

Ecco che un errore di progettazione (la mancanza di visibilità dello stato del sistema ,cit. Nielsen, che in questo caso era il livello di batteria) si era trasformato in fonte di emozioni negative durante l’utilizzo “reale” della calcolatrice.

La chiacchierata aveva scaturito apprezzamento per il bel design estetico che si era mantenuto immutato nel tempo, l’apprezzamento per le enormi funzionalità per un apparecchio di vent’anni prima, la buona usabilità e l’estrema efficienza con cui risolveva i compiti per i quali era stata progettata. Erano ritornati molti ricordi, ma quello riguardo “l’angoscia della batteria” aveva spazzato via tutto.

Ecco un esempio di conflitto dei tre livelli emozionali: la risposta riflessiva che entra in conflitto con quella viscerale e comportamentale.

All’immediatezza della risposta viscerale e comportamentale (calcolatrice  molto bella e funzionale) si scontra sulla riflessione del passato e le esperienze negative.

Da qui si capisce come i tre livelli abbiano un ulteriore elemento di distinzione, ovvero il tempo. Il tempo è un’aspetto cruciale nello studio della User Experience come analizzeremo nei prossimi post.

I livelli viscerali e comportamentale riguardano il momento stesso, l’adesso, ovvero tutto quello che si prova mentre si usa il prodotto. Il livello riflessivo non ha limiti di tempo; questo può spaziare dai ricordi passati alle aspettative future, esso concerne quindi le relazioni a lungo termine.

I tre livelli: chi vince?

Per rispondere a questa domanda mi aggancio agli studi di Barbara Fredrickson e Daniel Kahneman secondo cui l’esperienza non viene giudicata e ricordata in maniera continua, ma attraverso gli “snapshot” più significativi che l’hanno caratterizzata.

Cioè di una qualsiasi esperienza vengono ricordati solo certe “immagini” e sono quelli che determinano il valore dell’intera esperienza.

Ogni immagine è da considerarsi come una sorta di “media” dei momenti  che hanno caratterizzato l’esperienza;

ma i singoli snapshot se vengono ripresi e riorganizzati in ordine cronologico non hanno lo stesso valore:

lo snapshot finale è quello più importate di tutti.

 

Esperienza utente: snapshots significativi

Esperienza utente: snapshots significativi

Non importa la durata dell’esperienza e quindi il numero di immagini-ricordo, quello che conta veramente è l’esperienza finale.

Detto questo è chiaro che se il livello viscerale riguarda essenzialmente il primo impatto (estetica, bellezza, apparenza) dell’oggetto è sicuro che sia associato ai primi snapshot; il livello comportamentale riguarda le funzioni e le prestazioni durante l’utilizzo e quindi avrà una lunga serie di snapshot intermedi.

Il pensiero che ricade sull’oggetto, la riflessione personale, quella è l’ultima immagine che rimane impressa. E’ quindi il livello riflessivo a guadagnarsi l’ultimo più importante snapshot?

Con la mia calcolatrice sembra proprio andata così. L’immagine di io che la chiudo in un cassetto è quella più forte dell’intera esperienza d’uso.

Ecco perchè è sul livello riflessivo che spesso si concentra il marketing e quindi di conseguenza quello che vi è dietro come ad esempio il customer care, l’assistenza tecnica, ecc

C’è chi sostiene che alcuni grandi brand facciano apposta nel file andare qualcosa storto, come ad esempio un l’acquisto online. Il primo impatto “negativo” viene piano piano soppiantato da un customer care disponibile, puntuale e preciso. Quando tutto è risolto che cosa si ricorderà dell’intera esperienza? Il fatto di aver trovato dall’altra parte una soluzione rapida ed efficiente che ha risolto il problema.

Il brand riesce a farsi sentire e stamparsi maggiormente nella testa dopo un’ esperienza negativa risolta piuttosto che se tutto fosse filato liscio.

A me è capitato e sono rimasto colpito di come questa esperienza si sposasse perfettamente con la “teoria dello snapshot finale”  come quello determinante nella valutazione globale.

Ne riparleremo….

Il processore umano

Il “processore umano” è costituito da tre sottosistemi distinti:

  1. il sistema percettivo
  2. il sistema cognitivo
  3. il sistema motorio

Il sistema percettivo comprende l’acquisizione dell’informazione dal mondo intorno a noi, acquisizione che avviene attraverso i nostri sensi (vista, udito, tatto ecc).

L’informazione acquisita viene elaborata dal sistema cognitivo che la interpreta e la passa al sistema motorio.

Ecco infatti che un rumore forte come ad esempio un’esplosione viene percepito dall’udito, elaborato dal sistema cognitivo che lo trasforma in una istruzione di criticità e i muscoli si muovono per allontanarsi da quella percezione di pericolo rilevata.

Entrando più nel dettaglio il sistema cognitivo si può scomporre in tre macro sezioni (per fortuna è tutto diviso in 3 come se fosse fatto per essere ricordato meglio):

  1. memoria sensoriale
  2. memoria di lavoro (o a breve termine)
  3. memoria a lungo termine
Modello processore umano

Modello processore umano

La memoria sensoriale è quella direttamente legata all’acquisizione delle informazioni dal mondo esterno.

Ha una durata breve che varia tra i 0.5 e i 5 secondi. Ad esempio la “sensazione di pressione” di un dito su una supeficie rimane attiva ancora per un istante dopo che il dito è stato sollevato.

Queste informazioni vengono poi passate alla memoria di lavoro che ha lo scopo di tenere viva l’informazione durante le operazioni di lavoro. Mi viene in mente l’operazione di copia ed incolla dei files che quotidianamente facciamo decine di volte al giorno. Per quei pochi secondi “sappiamo” quali file abbiamo selezionato ma poco dopo questa informazione sparisce. La durata tipica della memoria di lavoro è tra i due e i 20 secondi.

Molti esperimenti (Miller) suggeriscono che tale memoria abbia un buffer molto limitato. Si parla di 7 più o meno 2 elementi trattenuti vividi durante tali operazioni.

La memoria a lungo termine è quella dove le informazioni risiedono per intervalli molto lunghi (anche tutta la vita).

L’informazione viene qui trasferita da quella a breve termine e salvata in questa memoria in 3 modi:

  1. associazione: la nuova informazione viene in qualche modo associata a materiale già presente in memoria o tramite la creazione di un mapping  di identità (es pensare di mettere una nuova informazione in un cassetto la fa ricordare meglio)
  2. reiterazione: il classico ripetere (a voce alta, scrivendola o ripetendola solo mentalmente) più volte fa immagazzinare l’informazione
  3. ripresentazione: per esempio quando impariamo una canzone perchè la risentiamo più volte alla radio o ci ricordiamo la battuta di una pubblicità perchè vista e rivista svariate volte

Tutto questo è esaustivo al fine di capire come funziona il cervello umano? Questa classificazione “verticale” del sistema cognitivo basta per spiegare tutto?

Proprio non direi; se fossimo macchine, anche complesse, si. Ci sarebbero protocolli di acquisizione di dati dal campo, un database relazionale per archiviare i dati storici e cancellarli dopo un certo periodo di tempo se ritenuti sotto una certa soglia di importanza. Ci sarebbero segnali trattati in maniera specializzata (gli allarmi) che metterebbero in moto altri apparati.

Tutto questo si riesce a fare, e lo faccio quotidianamente nel mio lavoro; ma tutto questo non tiene conto della cosa più importante che distingue l’uomo dalla macchina, ovvero le emozioni e degli stati affettivi che le determinano.

Il sistema emozionale

Il sistema emozionale è un sistema parallelo al sistema cognitivo (in fatti spesso si parla di sistema cognitivo-emozionale) nel senso che il tutto stà ancora nella nostra testa (per essere brutali).

Qua mi aggancio alle definizioni date da Don Norman nel suo Emotional Design: perchè amiamo (o odiamo) gli oggetti della vita quotidiana che cerca di identificare quali caratteristiche debba avere un oggetto dal punto di vista del design per essere “desiderato ed appetibile”.

Naturalmente queste caratteristiche sono direttamente collegate al modo in cui l’uomo interpreta quell’oggetto, ai mille modi con cui ci si relaziona e ne fa tema centrale di comunicazione con altre persone.

Norman distingue tre diversi gradi di elaborazione che vanno a braccetto con tre livelli di design emotivo.

  1. Il livello viscerale
  2. il livello comportamentale
  3. il livello riflessivo

Livello viscerale

Riguarda il primo impatto con un prodotto o un soggetto, ed  è quindi strettamente collegato all’apparenza.

La vista di un ragno dà i brividi, un rumore stridulo dà fastidio e ci spinge ad andare via velocemente.

Al contrario la vista di gattino o di un bambino ci spinge ad avvicinarci ed assumere un atteggiamento rilassato e protettivo.

Per le forme o i colori di un oggetto è la stessa cosa: oggetti appuntati o taglienti suggeriscono pericolo mentre oggetti lisci e ben levigate danno sicurezza.

Le emozioni viscerali sono inconsce, automatiche ed immediate e derivano dalla nostra evoluzione come uomini; la discriminazione tra buono e non è pesata a livello di sopravvivenza.

Il design viscerale si concentra sull’evocare emozioni al primo impatto con un prodotto: l’apparenza, il tatto, il gusto.

Livello comportamentale

Il livello comportamentale si basa sull’utilizzo di un oggetto, sul piacere di utilizzarlo e sulla soddisfazione pratica derivante dall’efficacia ed efficienza con cui adoperando l’oggetto si raggiunge lo scopo per cui è stato creato.

Un buon coltello da cucina ne è un buon esempio: una lama perfettamente affilata, un bilanciamento perfetto, un manico ergonomico ecc ecc. Che differenza a lungo andare fra usare un buon coltello e uno di bassa qualità…

Il livello comportamentale prende piede nelle azioni abituali e in quelle ripetute.

Dato che si concentra sulla funzione specifica e sulla prestazione è il  livello associato all’usabilità.

Anche questo come il livello viscerale è ad un livello inconscio.

Livello riflessivo

Questo è l’unico livello cosciente dove l’interpretazione, la comprensione e il ragionamento fanno da padrone.

Qua noi interpretiamo l’oggetto mettendolo in relazione con noi e con gli altri.

Evoca un ricordo? mi da uno spunto per raccontare una storia? Mi rende orgoglioso? possederlo esprime prestigio?

Il livello riflessivo è quello del super ego, è l’immagine di noi che proponiamo agli altri e riproponiamo a noi stessi.

A questo livello lavora spesso il marketing, cercando di “innestare” nel prodotto qualcosa che lo renda speciale per chi lo possiede.

Il sistema emozionale e gli altri sistemi

Come sono collegati fra loro il mondo esterno e il nostro apparato motorio?

Qual’ è la catena degli eventi che ad esempio ci fa correre se avvertiamo un pericolo?

L’apparato percettivo è direttamente collegato sia al livello di elaborazione viscerale che comportamentale. Entrambi questi livelli sono in diretta comunicazione con l’apparato motorio.

Se una cosa è pericolosa (o viceversa sicura) il livello viscerale veloce ed immediato emette rapidi giudizi (la sopravvivenza vince) che si trasformano in segnali che vengono passati sia all’apparato motorio che in alto al livello comportamentale.

Il livello riflessivo non ha accesso diretto ai due apparati percettivo e motorio ma passa dagli altri due livelli.

Il livello riflessivo fa da controllore per il livello comportamentale inferiore dando sollecitazioni di inibizione o amplificazione; quello comportamentale fa lo stesso con il livello viscerale. Sembra un pò il modello ISO/OSI per le reti di comunicazione.

Ecco ad esempio che una prima sensazione di paura avvertita sulle montagne russe (livello viscerale) può essere reinterpretata a livello riflessivo e diventare piacere. Cosi come tante altre cose come ad esempio il bungee jumpin, il lancio con paracadute, ecc Il livello riflessivo, la nostra più profonda rappresentazione di evoluzione, può completamente sovvertire “l’istinto” e farci apprezzare situazioni (ed amare oggetti) a primo avviso ritenute da evitare.

Il processore umano approccio emozionale

Il processore umano approccio emozionale

I tre livelli di elaborazione insieme

Quale dei tre livelli è più importante?

E’ una domanda da un milione di dollari. Mentre è facile capire che una buona usabilità sia sempre da desiderare (quindi sappiamo come coprire il livello comportamentale) gli altri due livelli sono molto soggettivi.

Si capisce come anche l’usabilità abbia un ruolo limitato nello schema complessivo delle cose (diciamo il 33%), ma da sola non basta.

Magari ad un gruppo di persone il prodotto attrae ed ad un’altro no, a qualcuno suscita ricordi e prestigio ad altri meno.

Creare un prodotto (o un servizio) che copra tutte e tre gli aspetti è molto difficile o impossibile.

Non è neanche possibile pensare che l’esperienza coinvolga solamente uno dei tre livelli; l’esperienza reale li coinvolgerà tutti e tre e spesso saranno in conflitto fra loro.

Cosa si può fare allora? cercare di avvicinarsi il più possibile al pubblico a cui è diretto il prodotto e cercare di rendere il prodotto straordinario per loro.

In soldoni? creare un’esperienza positiva che parta prima, duri nel mentre e si mantenga dopo.

Ci stiamo spingendo sempre più in fondo… nei prossimi post troveremo alcune risposte.

Intanto vi riporto un video in cui direttamente Don Norman espone questo approccio all’emotional design.

Buona visione.

 

Usabilità: Tecniche di valutazione

Abbiamo già visto nel post testare l’usabilità è costoso? alcune tecniche per la valutazione dell’usabilità ma di recente ho avuto una richiesta di un lettore che mi richiedeva una visione sintetica a riguardo dato che sul web c’è molta poca chiarezza.

Partiamo col suddividere le tipologie di valutazione in due grandi macrocategorie in base al coinvolgimento o meno dell’utente finale (utilizzatore):

Utenti coinvolti:

  • Valutazione basata su test utenti
  • Valutazione basata su Feedback dell’utente

 

Utenti non coinvolti:

  • Valutazione basata su ispezione
  • Valutazione basata su modelli

Valutazione basata su test utenti

Come dice il nome stesso questa tipologia di valutazione è quella che mette al centro dell’analisi l’utilizzatore (magari meglio se si avvicina “all’archetipo” dell’utilizzatore finale reale = personas).

Vengono dati dei task, ovvero dei compiti da eseguire, e viene osservato (e registrato tramite telecamere e registratori vocali) l’utente mentre svolge questi task.

Durante la sessione di test viene richiesto di “pensare ad alta voce” think aloud perchè aiuterà molto poi nella discriminazione delle problematiche riscontrate e dei “sentimenti” provati.

Sono richiesti un numero di utenti relativamente limitato per individuare la maggior parte delle problematiche. Già 5 persone potrebbero essere sufficienti.

In quale fase del progetto è bene effettuare questo tipo di valutazione? quante volte va effettuata?

Le risposte sono : da subito e spesso. E’ bene partire dalla fase prototipale, per esempio dal wireframe e su su continuare per tutto il ciclo di vita del prodotto.

Personalmente ritengo che questo tipo di valutazione la prima volta sia da accodare a quella basata su ispezione per evitare di sottoporre all’utente comune una versione “buggata” o incompleta della soluzione condizionando l’esito dei task.

L’output può essere una matrice come quella riportata (a mappa di calore) utile per determinare le aree problematiche calde e dare una precedenza alla risoluzione dei problemi più gravi.

valutazione usabilità output test utente

valutazione usabilità output test utente

Questo tipo di valutazione può essere fatta da remoto attraverso software che permettano la registrazione (come ad esempio camstasia) delle interazioni, in laboratorio o sul campo.

Personalmente credo che quella sul campo sia la più efficace in quanto si tolgono condizionamenti fisici e mentali e si può osservare l’utente nel suo “habitat naturale” mentre svolge i compiti come farebbe quotidianamente.

Questo naturalmente non è sempre possibile farlo (costi, distanze, organizzazione) ed è possibile optare per una delle altre possibilità.

Valutazione basata su feedback dell’utente

In questo tipo di valutazione si chiede all’utente di descrivere l’esperienza col prodotto attraverso questionari, focus group, diari, colloqui informali.

valutazione usabilità Feedback utente; questionario

valutazione usabilità Feedback utente; questionario

Per quanto riguarda i questionari vi è la possibilità di utilizzare domanade a risposta multipla, si o no, su scala di valori (di numero pari o dispari a seconda se si voglia spingere o meno verso una presa di posizione), domande a risposte aperta.

Ci sono molti tools a disposizione primo fa tutti googleForm.

A mio avviso questo tipo di valutazione con l’utente non è la migliore per l’usabilità in quanto chiedere prevede un ragionamento, una riflessione e quando si entra in questo ambito non si tratta più di usabilità ma stiamo sforando nella User Experience.

L’usabilità fa parte del livello cognitivo comportamentale che è incosciente.

Non sappiamo perchè una cosa funzioni bene, la usiamo punto e basta. Questo vale in ogni ambito, sia un coltello, uno spremi agrumi o una pagina web.

A riprova di questo è il fatto che ad esempio su un sito o una app non ci accorgiamo quando tutto fila liscio, ma ci accorgiamo solo quando qualcosa non va.

Viceversa questo tipo di valutazione è molto importante a livello di User Experience.

L’esperienza utente riguarda le emozioni e i sentimenti prima dell’utilizzo, durante e dopo. Questo è diverso dall’usabilità in quanto coinvolge l’aspetto riflessivo e cosciente dell’esperienza e non solo l’aspetto pragmatico e pratico.

Chiedere su “come lo useresti?” , “come lo preferiresti?” non è la strada migliore. Le persone non lo sanno, se ne accorgono solamente mentre lo usano.

Quando fare questo tipo di valutazione? In qualsiasi momento; in fase prototipale per avere un rapido feedback e indicazioni, in fase di implementazione e dopo il rilascio per ulteriori miglioramenti e features.

Valutazione basata su ispezione

In questa categoria rientra la valutazione euristica.

Uno o più esperti di usabilità si siedono a tavolino ed in maniera indipendente fanno una loro valutazione in base e proprie “regole”.

Vi sono diversi livelli di astrazione di queste regole;  partendo dal livello più astratto e andando verso quello più pragmatico troviamo:

  • principi
  • euristiche
  • linee guida
  • regole di stile

Tra le più usate sono le 10 euristiche di Nielsen ma niente vieta di usare delle linee guida più specifiche.

Per ogni problema viene data l’indicazione della regola violata, una spiegazione, una gravità e una possibile soluzione. L’output è quindi un rapporto di usabilità che potrebbe avere la forma di quello riportato nell’immagine seguente.

valutazione euristica: rapporto di usabilità

valutazione euristica: rapporto di usabilità

Anche questo tipo di valutazione può essere effettuato a qualsiasi livello di maturità del progetto (prototipo, mockup, sistema completo).

Personalmente ritengo importantissimo questo tipo di valutazione sia per testare il prodotto in maniera verticale (ovvero testare la singola funzionalità nel dettaglio fino in fondo) sia in maniera orizzontale (testare tutte le funzionalità in maniera sufficiente).

Naturalmente nel momento del rilascio ogni funzionalità dovrà essere valutata in maniera esaustiva.

Valutazione basata su modelli

Fa parte di questa categoria la cosiddetta GOMS (Goals, Operators, Methods, Selection rules) che cerca di stimare i tempi per svolgere un determinato compito dati alcuni vincoli di lavoro (es capacità motorie dell’utilizzatore, il tempo di risposta del sistema). Il task completo viene suddiviso in molteplici task elementari e per ognuno di esso viene fatta una stima del tempo necessario a completarlo basandosi ad esempio sulla legge di Fitts per il puntamento, e il tempo per digitare un carattere (sull’ordine del decimo di secondo),il tempo di controllo sul mouse (circa 0.5 sec), il tempo di elaborazione mentale per passare da un’azione all’altra (circa 1 sec).

Questa tecnica è molto utile per scegliere fra diverse soluzioni previste quella “più veloce”. Essendo però una procedura automatica non tiene conto degli errori degli utenti, le possibili interruzioni e necessità di una sequenzialità delle azioni. Sono quindi tecniche poco valide per applicazioni web in cui è l’utente deve essere messo al centro del confronto.

 

Spero di aver fatto un po’ di chiarezza sui metodi utilizzati per la valutazione completa dell’usabilità di un prodotto ed in particolare un sito web.

L’analisi dell’usabilità per un progetto che ho personalmente seguito è scaricabile da parrucchiere.online valutazione dell’usabilità.

L’estetica migliora l’usabilità?

L’estetica migliora l’usabilità? Gli oggetti attraenti funzionano meglio?

La risposta sembrerebbe scontata ed ovvia: “cosa c’entra l’estetica con la buona usabilità di un prodotto, sono due cose completamente separate.”

Infatti la nostra esperienza ci insegna che ci sono oggetti “brutti” ma comodi e funzionali ed oggetti “belli” ma inutilizzabili. Ma non è questo il punto di vista giusto per rispondere a questa domanda.

La domanda va affrontata in un altro modo. Dato un problema, un compito (che può essere ad esempio la procedura di un reso sul un sito web, il noleggio di un film in streaming, ecc) quanto può influire l’aspetto estetico sul compimento corretto di tale task?

L’attrazione “viscerale” può condizionare il nostro approccio al problem solving? se si in che modo?

Emozioni e razionalità

Nel post Il ruolo delle emozioni nella User Experience riportando i risultati di Antonio Damasio abbiamo visto come le emozioni abbiamo un ruolo fondamentale per il nostro sistema cognitivo. Esse ci aiutano a prendere le decisioni, fungono da “segnali di fumo” in tutte le piccole-grandi decisioni quotidiane. Prendiamo infinite decisioni su tutto ciò che accompagna la nostra vita, ma se ci chiediamo il motivo raramente ne conosciamo una risposta. “Mi è sembrata la scelta migliore” ci troviamo a rispondere. Ce la sentiamo dentro che è stata la scelta giusta ma non riusciamo a spiegarcelo. Questa è un’espressione di emotività.

Le emozioni spesso arrivano prima del ragionamento, poichè la sopravvivenza è più importante della comprensione.

Esse fanno da primo rapido filtro decisionale col mondo che ci circonda; poi tutti gli input vengono passati al sistema cognitivo.

Ma è anche vero il contrario, ovvero le emozioni nascono dal pensiero e dal processo cognitivo.

Basta guardare una fotografia o sentire una canzone per farci commuovere oppure sentirci meglio per tutto il giorno.

La nostra mente è complessa. C’è l’istinto alla sopravvivenza, ci sono i sogni, le aspettative, il futuro, le esperienze passate, ecc.

 

Esistono altri interessanti esperimenti, tra i quali quelli condotti da Alice Isen che cercano di dimostrare in ruolo delle emozioni per il sistema cognitivo.

Nei suoi “esperimenti” ha diviso le persone in due gruppi e ha dato loro il medesimo problema da risolvere. Ad un gruppo però prima di ogni prova è stato fatto un piccono dono, una caramella od un dolce e la prova è stata presentata con un tono amichevole cordiale. All’altro gruppo non è stato dato nessun regalo e la presentazione è stata fredda e distaccata.

Ebbene, il primo gruppo, ovvero quello che “viveva” in uno stato d’animo tranquillo e rilassato, riusciva a risolvere molti più problemi rispetto al secondo.

La contentezza e la rilassatezza espandono i processi intellettivi e spingono il pensiero verso la creatività, la curiosità, ad ampliare i suoi confini di immaginazione, a trovare strade alternative ad un problema.

Sarà un caso ma personalmente dopo una bella corsa vedo tutto in maniera diversa. Riesco a trovare alternative e soluzioni ai problemi della giornata che magari sono ore che mi assillano.

E gli stati d’animo negativi allora non servono a niente? sono da evitare sempre?

Assolutamente no. Gli stati d’animo negativi aiutano a concentrarsi, ad organizzarsi e focalizzarsi sul problema contingente.

Non per niente ogni progetto di gruppo dovrebbe alternare fasi di spensieratezza ed informalità (es brainstorming) con fasi di concentrazione puntuale (es scadenze programmate).

Lo stato d’animo negativo non deve essere nè troppo elevato nè troppo duraturo nel tempo, altrimenti si rischia l’effetto tunnel ovvero quella condizione in cui ci comportiamo con il paraocchi e la strada diventa una sola e sempre più piccola.

L’asticella è bene che sia posizionata solo un poco sopra le proprie capacità. Ad esempio anticipare di una settimana la scadenza di un progetto di 3 mesi. Questo fa concentrare e portare a termine un lavoro.

Emozioni ed usabilità

Gli esperimenti sopra riportati dimostrano come le emozioni positive riescano ad espandere il processo cognitivo. Da qui il passo per il miglioramento dell’usabilità è breve: un cervello in uno stato più aperto è molto più reattivo di fronte ad un qualsiasi problema, sia anche un problema di usabilità. Se “stiamo bene” troviamo soluzioni migliori o semplicemente neanche ci accorgiamo del problema perchè lo abbiamo già risolto trovando strade alternative.

L’estetica migliora l’usabilità

Ora che sappiamo le emozioni positive migliorano l’usabilità per chiudere la catena estetica-usabilità resta da vedere come una buona estetica genera emozioni positive.

E’ sulla bocca di tutti che gli oggetti gradevoli producano emozioni positive, ma noi che non ci fidiamo delle parole, vogliamo qualcosa di più, una dimostrazione “scientifica”.

Non posso quindi che rimandare al post emozioni nel web in cui sono stati determinati delle caratteristiche che un sito web deve avere per generare emozioni positive come serenità ed amore.

Estetica e grafica attraente, interazione e navigazione facile, buona formattazione testo ecc sono le caratteristiche affinchè un’interfaccia generi reazione di amore e serenità.

Siamo riusciti a chiudere la catena e “dimostrare” effettivamente che un buon “look and fell” migliora l’usabilità di un’interfaccia Web (o di qualsiasi altro prodotto in generale).

Gli oggetti attraenti funzionano meglio: il loro aspetto gradevole produce emozioni positive che a loro volta rendono la nostra mente più creativa e pronta a superare le difficoltà di usabilità.

 

L'estetica migliora l'usabilità

L’estetica migliora l’usabilità

Ho appena aperto il vaso di Pandora sulle relazioni fra design ed emozioni. Nel prossimo post affronterò una della tematiche più importanti dell’ emotional design… ovvero i 3 livelli di elaborazione cognitiva e le corrispondenti forme di design: viscerale, comportamentale e riflessivo.

Tools di validazione di accessibilità

Per trovare una lista completa ed aggiornata ai tools di validazione di accessibilità basta visitare il sito http://www.w3.org/WAI/ER/tools/#Evaluation.

 

Lista tools validatori di accessibilità

Lista tools validatori di accessibilità

Nella colonna di sinistra è possibile selezionare fra le linee guida di interesse, la lingua, la tipologia di tool (servizio online, plugin browser, linea di comando ecc) ed altre opzioni.

Una tecnica valida è quello di testare il sito con più di un tool perchè i risultati (anche se si sceglie il medesimo criterio di validazione es WCAG 2.0) potrebbero non essere perfettamente gli stessi e soprattutto i “consigli” per superare eventuali problematiche riscontrate potrebbero essere diversi.

Prendiamo in considerazione tre tools:

e mettiamo sotto torchio il sito del comune di Lucca http://www.comune.lucca.it/home .

 

Validatore accessibilità Wave

L’output di Wave è il seguente:

alidazione accessibilità wave

validazione accessibilità wave

Dal box di sinistra sotto summary si notano 6 errori e 68 alert. Tali notifiche vengono rappresentate con delle etichettine colorate (rosse, gialle ecc) direttamente sulla pagina analizzata dando un rapido feedback su dove si presenta il problema e fornendo un rapido strumento per “navigare a video sulle singole notifiche” aprendo un popup descrittivo.

validazione accessibilità wave: popup notifica

validazione accessibilità wave: popup notifica

Basta premere su more information affinchè il tool mostri nel menu di sinistra alcune info descrittive sulla tipologia di errore, sul come risolverlo e l’indicazione di quali linee guida si stà violando.

validazione accessibilità wave: info descrittive

validazione accessibilità wave: info descrittive

Cliccando sulla bandierina sul menu di sinistra compaiono i dettagli dell’intera all’analisi:

validazione accessibilità wave: dettagli

validazione accessibilità wave: dettagli

Infine il tool segnala direttamente sul codice dove si presenta il problema. Basta premere il bottone in basso “code”.

 

validazione accessibilità wave: analisi codice

validazione accessibilità wave: analisi codice

 

Sempre sul menu di sinistra è possibile “switchare” all’analisi dei contrasti (sfondo-testo).

validazione accessibilità wave analisi dei contrasti

validazione accessibilità wave analisi dei contrasti

Anche per questa analisi sono valide le modalità di navigazione direttamente sulla pagina e sul codice.

Wave è un tool veramente semplice da usare, molto descrittivo e veloce.

Purtroppo ha due limitazioni:

  • non permette la validazione per la legge Stanca (permette la scelta fra WCAG 2.0 AA ed A e Section 508)
  • non contempla problematiche sui contenuti dinamici (es ajax)

Validatore accessibilità AChecker

Passiamo all’analisi col tool AChecker; le immagini e le relative didascalie che seguono sono autoesplicative per la loro semplicità:

validazione achecker settaggi

validazione achecker settaggi

validazione accessibilità achecker

validazione accessibilità achecker

 

validazione achecker potenziali problemi

validazione achecker potenziali problemi

 

validazione achecker validatore HTML

validazione achecker validatore HTML

 

Pro:

  • contempla anche legge Stanca
  • è anche un validatore Html e CSS

Contro:

  • non contempla problematiche sui contenuti dinamici

Validatore accessibilità MAUVE

Come terzo validatore ho preso in considerazione Mauve per due motivi:

  • il primo: perchè è italiano (CNR di Pisa)
  • il secondo: fa quello che solo pochi fanno ovvero la valutazione sui contenuti dinamici

Anche per questo tool è possibile scegliere il tipo di linea guida a cui sottoporre il sito con l’opzione di poter scegliere anche lo User Agent (iPad, iPhone, Desktop PC).

validatore accessibilità Mauve

validatore accessibilità Mauve

Il suo output per la medesima pagina è il seguente:

validatore accessibilità Mauve

validatore accessibilità Mauve

Come si nota l’output è molto meno “visual” rispetto agli altri due e le notifiche vengono riportati direttamente sul codice, o meglio non vengono segnati gli errori veri e propri ma le guidelines violate.

Validatori di accessibilità: un confronto

Personalmente ritengo questi tre tool esaustivi al fine di check sull’accessibilità di un sito web.

Ognuno in maniera propria riesce a dare indicazioni preziose che necessitano sicuramente di un po’ di esperienza dall’altra parte per poter essere interpretate ed intervenire adeguatamente.

Poi alla fine è una questione di gusti e di pratica su uno o l’altro tool.

Quello che veramente ritengo discriminante è la capacità di Mauve di valutare (tramite plugin) i contenuti dinamici , ovvero parti di codice generati da script (es jquery) e chiamate Ajax.

Senza entrare nei dettagli riesce a far questo sfruttando il DOM (il DOM è una rappresentazione di documenti strutturati nel nostro caso HTML e CSS) gestito dal browser che a sua volta contiene un interprete javascript. Cioè dato che l’interprete javascript presente nel browser riesce a modificare il DOM di una pagina a seguito di un qualsiasi evento (input bottone, compilazione form, caricamento pagina), agganciandosi a questo è possibile validare la pagina soggetta a questi variazioni.

 

Bellezza ed accessibilità

Purtroppo spesso le specifiche di accessibilità vengono ignorate e passano in secondo piano rispetto ad altri aspetti quali ad esempio la piacevolezza grafica.

Penso sia un errore, perchè bastano poche accortezze (e alcuni cicli di controllo) per creare siti belli ed accessibili allo stesso tempo.

Per curiosità vediamo come si comporta il sito Apple di fronte a questi check. Sicuramente l’azienda portabandiera di concetti di estetica e usabilità non cadrà in fallo…

Vediamo …

sito Apple.it validazione accessibilità

sito Apple.it validazione accessibilità

e per i contrasti …

Apple.it validazione accessibilità analisi contrasto

Apple.it validazione accessibilità analisi contrasto

ahiaiaiaiii …. 🙂 troppe notifiche rosse! forse è anche per questo che le rare volte che ho acquistato sul sito ho sempre trovato dei problemi nel trovare tutte le informazioni necessarie??

Sicuramente è colpa mia … ma poi mi viene in mente Don Norman che scrive (non saranno proprio le sue parole precise precise) la seguente frase: “non sono gli utenti a sbagliare ma è il cattivo design che induce all’errore e alla frustrazione”.

E mi sento sollevato.

Aggiornamento agosto 2017

Con il rilascio della versione 1.4.0 di MAUVE, oltre ad alcuni bug fix, è stato introdotto il supporto alle media queries:

grazie alla selezione del dispositivo (e s. iPhone 6) tramite quale simulare l’accesso, vengono applicate le relative media queries. Un’ utile feature per l’analisi puntuale dei siti che adottano un design responsive.

Inoltre è stato anche introdotto il supporto ai siti che utilizzano l’ https con protocollo di crittografia TLS 1.0, 1.1 e 1.2.

Importanti passi avanti per un tool tutto italiano.

Accessibilità ed usabilità

L’accessibilità e l’usabilità sono la stessa cosa?

Le tematiche che affrontano accessibilità e l’usabilità sono le medesime?

Con questo ed il prossimo post cercherò di fare un po’ di chiarezza su questi due aspetti che spesso vengono confusi o comunque mal interpretati anche dagli addetti ai lavori.

Accessibilità ed usabilità: facciamo distinzione

La definizione ISO dell’usabilità prende in esame l’efficacia, l’ efficienza e soddisfazione di utenti specifici in determinati contesti che devono raggiungere determinate obiettivi.

Per capirci l’usabilità cerca di ottimizzare un’interfaccia focalizzandosi sul chi, come e quando utilizzerà il prodotto. Per assurdo una stessa interfaccia potrebbe essere “usabile” per una classe di utenti (es bambini) e assolutamente “non usabile” per un’altra classe (es anziani).

Un sistema è invece accessibile quando può essere utilizzato efficacemente da qualsiasi utente in qualsiasi contesto indipendentemente dalla cultura, dalla lingua, dalle abilità fisiche o mentali, dalla periferica di input o output, da computer usato, dagli strumenti hardware/software, dal browser ecc.

Quindi l’accessibilità punta sull’universalità del sistema intesa come sua capacità di essere fruito dal maggior numero di persone possibili. L’accessibilità si concentra ad allargare il numero degli utenti mentre l’usabilità tende a rendere particolari utenti più efficienti e soddisfatti.

Accessibilità ed usabilità sono incompatibili?

Assolutamente no, o meglio al di là delle definizioni formali non devono esserlo.

Usabilità senza accessibilità implica che vi siano fasce di utenti che non possono accedere al servizio (che è un male per qualunque business in qualunque settore).

Viceversa accessibilità senza usabilità vuol dire che tutti possono accedere ma con fatica e con un retrogusto amaro in bocca (che è un male per qualunque business in qualunque settore).

Si capisce che sono due visioni che devono andare di pari passo fin dai primi passi della progettazione e nessuno delle due può essere lasciata indietro e trascurata.

Per chi lavora nel mondo web (e ci lavora seriamente) devono essere interpretate come due facce di una stessa medaglia.

Se infatti  è vero che rendere i siti accessibili li rende più usabili per tutti è altrettanto vero il contrario: rendere i siti più usabili alla maggior parte delle persone è il modo più efficace per renderli più accessibili a persone con disabilità.

Se un elemento disorienta le persone senza problemi di accessibilità molto probabilmente disorienterà anche coloro con una qualche disabilità.

Teniamo anche conto che spesso non si opera in contesti sempre favorevoli. Rumori, ambienti poco/troppo luminosi, mentre camminiamo, mentre siamo sul tram o in treno (dove le vibrazioni non certo favoriscono le selezioni). Pensiamo inoltre agli anziani, o a situazioni di temporanea disabilità (mano ingessata).

Infatti OMS (Organizzazione Mondiale della Sanità) nel documento International Classification of Functioning, Disabilities and Health (ICF) include nel termine disabilità anche una persona normodotata che agisce in ambiente (psico-fisico) non ottimale.

Come dire che in fondo in fondo l’accessibilità può riguardare chiunque. Ecco perchè è così importante.

L’accessibilità è obbligatoria?

E’ obbligo di legge per qualsiasi sito web essere accessibile (ovvero non violare principi di accessibilità, tradotto: superare i test di un validatore)?

Per rispondere a questa domanda prima è bene fare distinzione fra organismi internazionali e italiani.

Per quanto riguarda l’internazionalità esiste il WAI (Web Accessible Initiative) di W3C che si suddivide in :

  • Web Content Accessibility Guidelines (WCAG): riguarda i siti
  • User Agent Accessibility Guidelines (UAAG): riguarda i browser
  • Authoring Tools Accessibility Guidelines (ATAG): riguarda l’authoring

Noi ci concentreremo sulla WCAG (attualmente alla sua versione WCAG 2.0 del 2008).

Essa si articola su 4 principi (che si suddividono in 12 linee guida che a loro volta si suddividono ulteriormente) che i contenuti e i componenti dell’interfaccia devono rispettare:

1.percepibilità

Le informazioni e i componenti dell’interfaccia utente devono essere presentati agli utenti in modo che possano essere percepiti

Linee guida:

  • 1.1 Alternative testuali
  • 1.2 Alternative per i tipi di media temporizzati
  • 1.3 Adattabile: Creare contenuti che possano essere rappresentati in modalità differenti (ad esempio, con layout più semplici), senza perdere informazioni o la struttura.
  • 1.4 Distinguibile: Rendere più semplice agli utenti la visione e l’ascolto dei contenuti, separando i contenuti in primo piano dallo sfondo

2.utilizzabilità

I componenti e la navigazione dell’interfaccia utente devono essere utilizzabili

Linee guida:

  • 2.1 Accessibile da tastiera: rendere disponibili tutte le funzionalità tramite tastiera
  • 2.2 Adeguata disponibilità di tempo: fornire agli utenti tempo sufficiente per leggere ed utilizzare i contenuti
  • 2.3 Convulsioni: non sviluppare contenuti che possano causare attacchi epilettici
  • 2.4 Navigabile: fornire funzionalità di supporto all’utente per navigare, trovare contenuti e determinare la propria posizione

3.comprensibilità

Le informazioni e le operazioni dell’interfaccia utente devono essere comprensibili

Linee guida:

  • 3.1 Leggibile: rendere il testo leggibile e comprensibile
  • 3.2 Prevedibile: creare pagine Web che appaiano e che siano prevedibili
  • 3.3 Assistenza nell’inserimento: aiutare gli utenti ad evitare gli errori ed agevolarli nella loro correzione

4.robustezza

Il contenuto deve essere abbastanza robusto per essere interpretato in maniera affidabile mediante una vasta gamma di programmi utente, comprese le tecnologie assistive

Linee guida:

  • 4.1 Compatibile: garantire la massima compatibilità con i programmi utente attuali e futuri, comprese le tecnologie assistive

Esistono 3 livelli di conformità (non è un ON/OFF o bianco/nero) in ordine di qualità crescente A = “deve”, AA=”dovrebbe”, AAA=”potrebbe” e i validatori danno un riscontro di successo su questa scala.

Si considerano infine i criteri di successo, ovvero della affermazioni la cui lettura serve alla comprensione ed implementazione della linea guida specifica.

L’Europa dal 2001 stabilisce che le linee guida WAI siano adotatte come standard per tutti i siti di interesse pubblico.

Per l’Italia esiste la Legge Stanca 2004 (poi adeguata alla WCAG2 nel 2013 ) che obbliga tutte le pubbliche amministrazioni alla realizzazione di siti web che rispettino le 22 linee guida della legge stessa.

Le 22 linee guida della legge Stanca

Giusto perchè personalmente faccio sempre difficoltà a trovarle su internet ecco che le riporto per completezza.

Requisito 1
Realizzare le pagine e gli oggetti al loro interno utilizzando tecnologie definite da grammatiche formali pubblicate nelle versioni più recenti disponibili quando sono supportate dai programmi utente. Utilizzare elementi ed attributi in modo conforme alle specifiche, rispettandone l’aspetto semantico.

Requisito 2
Non è consentito l’uso dei frame nella realizzazione di nuovi siti.

Requisito 3
Fornire una alternativa testuale equivalente per ogni oggetto non di testo presente in una pagina e garantire che quando il contenuto non testuale di un oggetto cambia dinamicamente vengano aggiornati anche i relativi contenuti equivalenti predisposti; l’alternativa testuale equivalente di un oggetto non testuale deve essere commisurata alla funzione esercitata dall’oggetto originale nello specifico contesto.

Requisito 4
Garantire che tutti gli elementi informativi e tutte le funzionalità siano disponibili anche in assenza del particolare colore utilizzato per presentarli nella pagina. (Tradotto: Informazione fornita non solo tramite colore).

Requisito 5
Evitare oggetti e scritte lampeggianti o in movimento le cui frequenze di intermittenza possano provocare disturbi da epilessia fotosensibile o disturbi della concentrazione, ovvero possano causare il malfunzionamento delle tecnologie assistive utilizzate; qualora esigenze informative richiedano comunque il loro utilizzo, avvertire l’utente del possibile rischio prima di presentarli e predisporre metodi che consentano di evitare tali elementi.

Requisito 6
Garantire che siano sempre distinguibili il contenuto informativo (foreground) e lo sfondo (background), ricorrendo a un sufficiente contrasto (nel caso del testo) o a differenti livelli sonori (in caso di parlato con sottofondo musicale); evitare di presentare testi in forma di immagini; ove non sia possibile, ricorrere agli stessi criteri di distinguibilità indicati in precedenza.

Requisito 7
Utilizzare mappe immagine sensibili di tipo lato client piuttosto che lato server, salvo il caso in cui le zone sensibili non possano essere definite con una delle forme geometriche predefinite indicate nella DTD adottata

Requisito 8
In caso di utilizzo di mappe immagine lato server, fornire i collegamenti di testo alternativi necessari per ottenere tutte le informazioni o i servizi raggiungibili interagendo direttamente con la mappa.

Requisito 9
Per le tabelle dati usare gli elementi (marcatori) e gli attributi previsti dalla DTD adottata per descrivere i contenuti e identificare le intestazioni di righe e colonne.

Requisito 10
Per le tabelle dati usare gli elementi (marcatori) e gli attributi previsti nella DTD adottata per associare le celle di dati e le celle di intestazione che hanno due o più livelli logici di intestazione di righe o colonne.

Requisito 11
Usare i fogli di stile per controllare la presentazione dei contenuti e organizzare le pagine in modo che possano essere lette anche quando i fogli di stile siano disabilitati o non supportati.

Requisito 12
La presentazione e i contenuti testuali di una pagina devono potersi adattare alle dimensioni della finestra del browser utilizzata dall’utente senza sovrapposizione degli oggetti presenti o perdita di informazioni tali da rendere incomprensibile il contenuto, anche in caso di ridimensionamento, ingrandimento o riduzione dell’area di visualizzazione o dei caratteri rispetto ai valori predefiniti di tali parametri.

Requisito 13
In caso di utilizzo di tabelle a scopo di impaginazione, garantire che il contenuto della tabella sia comprensibile anche quando questa viene letta in modo linearizzato e utilizzare gli elementi e gli attributi di una tabella rispettandone il valore semantico definito nella specifica del linguaggio a marcatori utilizzato.

Requisito 14
Nei moduli (form), associare in maniera esplicita le etichette ai rispettivi controlli, posizionandole in modo che sia agevolata la compilazione dei campi da parte di chi utilizza le tecnologie assistive.

Requisito 15
Garantire che le pagine siano utilizzabili quando script, applet, o altri oggetti di programmazione sono disabilitati oppure non supportati; ove ciò non sia possibile fornire una spiegazione testuale della funzionalità svolta e garantire una alternativa testuale equivalente, in modo analogo a quanto indicato nel requisito n. 3.

Requisito 16
Garantire che i gestori di eventi che attivano script, applet o altri oggetti di programmazione o che possiedono una propria specifica interfaccia, siano indipendenti da uno specifico dispositivo di input.

Requisito 17
Garantire che le funzionalità e le informazioni veicolate per mezzo di oggetti di programmazione, oggetti che utilizzano tecnologie non definite da grammatiche formali pubblicate, script e applet siano direttamente accessibili.

Requisito 18
Nel caso in cui un filmato o una presentazione multimediale siano indispensabili per la completezza dell’informazione fornita o del servizio erogato, predisporre una alternativa testuale equivalente, sincronizzata in forma di sotto-titolazione o di descrizione vocale, oppure fornire un riassunto o una semplice etichetta per ciascun elemento video o multimediale tenendo conto del livello di importanza e delle difficoltà di realizzazione nel caso di trasmissioni in tempo reale.

Requisito 19
Rendere chiara la destinazione di ciascun collegamento ipertestuale (link) con testi significativi anche se letti indipendentemente dal proprio contesto oppure associare ai collegamenti testi alternativi che possiedano analoghe caratteristiche esplicative, nonchè prevedere meccanismi che consentano di evitare la lettura ripetitiva di sequenze di collegamenti comuni a più pagine.

Requisito 20
Nel caso in cui per la fruizione del servizio erogato in una pagina sia previsto un intervallo di tempo predefinito entro il quale eseguire determinate azioni, è necessario avvisare esplicitamente l’utente, indicando il tempo massimo consentito e le alternative per fruire del servizio stesso.

Requisito 21
Rendere selezionabili e attivabili tramite comandi da tastiere o tecnologie in emulazione di tastiera o tramite sistemi di puntamento diversi dal mouse i collegamenti presenti in una pagina; per facilitare la selezione e l’attivazione dei collegamenti presenti in una pagina è necessario garantire che la distanza verticale di liste di link e la spaziatura orizzontale tra link consecutivi sia di almeno 0,5 em, le distanze orizzontale e verticale tra i pulsanti di un modulo sia di almeno 0,5 em e che le dimensioni dei pulsanti in un modulo siano tali da rendere chiaramente leggibile l’etichetta in essi contenuta.

Requisito 22
Per le pagine di siti esistenti che non possano rispettare i su elencati requisiti (pagine non accessibili), in sede di prima applicazione, fornire il collegamento a una pagina conforme a tali requisiti, recante informazioni e funzionalità equivalenti a quelle della pagina non accessibile ed aggiornata con la stessa frequenza, evitando la creazione di pagine di solo testo; il collegamento alla pagina conforme deve essere proposto in modo evidente all’inizio della pagina non accessibile.

E’ obbligatorio per un sito essere accessibile?

Per legge lo è solo per i siti delle pubbliche amministrazioni, enti pubblici economici, alle aziende di trasporto e telecomunicazione a prevalenza pubblica, alle aziende private concessioarie di servizi pubblici, siti sviluppati con il contributo di fondi pubblici, ai comuni.

Ma qualcuno controlla? Si esiste un ente apposito l’ AgID (ex CNIPA).

La validazione dell’accessibilità è eseguita sia da un valutatore certificato (verifica tecnica) che verifica se il sito rispetta lo standard di riferimento scelto (WCAG2, legge Stanca) sia da utenti disabili (verifica soggettiva) che controllano se effettivamente i contenuti siano fruibili senza problemi.

Se sono in regola cosa vinco? Il rilascio del logo con le stelline di qualità.

Logo Conformità alla Legge Stanca

Logo Conformità alla Legge Stanca

Ma il punto non è questo.

Rendere un sito accessibile è la cosa giusta da fare. Punto.

Giusta per come è nato il web. Come detto da Tim Berners-Lee (l’inventore del WEB) “La forza del web sta nella sua universalità. L’accesso da parte di chiunque, indipendentemente dalle disabilità, ne è un aspetto essenziale”.

Giusta perchè rende migliore la vita di alcune persone.

Ma se proprio proprio questi due motivazioni non bastano diciamo che è una buona motivazione anche per una questione economica. La percentuale delle persone con un certo grado di disabilità (visiva, uditiva, motoria) è enorme (l’ONU stima una percentuale che va dal 7 al 10% della popolazione mondiale).

In Italia si stimano circa 3 milioni di cittadini disabili di cui 1 milione invalidità motoria, 600 mila sordi e 350 ciechi e ipovedenti.

Ditelo al vostro capo. Ma questa deve essere solo una motivazione da portare al banco di chi guarda solo gli aspetti economici (come è giusto che sia altrimenti le aziende chiuderebbero). Per chi fa programmazione, chi fa comunicazione sul web, e chiunque includa la passione in questo lavoro le motivazioni sono le prime due.

E poi un sito accessibile è anche SEO friendly … ma non ditelo troppo in giro …

Accessibilità “for dummies”

Nel prossimo post analizzeremo alcuni dei validatori più conosciuti mostrandone pregi e difetti.

Intanto per ora una serie di punti che chiunque può verificare e che sinceramente richiedono veramente poca fatica.

Per molti siti bastano veramente solo questi. Credetemi.

  • Aggiungere un testo alternativo (alt=”logo aziendale”) ad ogni elemento non testuale, come ad esempio le immagini. Metterlo anche per i contenuti che vogliamo che gli screen reader saltino esplicitandolo come alt=”” col guadagno di tempo e chiarezza
  • Usare in maniera adeguata i titoli e sottotitoli (h1 per il titolo della pagina, h2 per i titoli delle sezioni principali, h3 i sottotitoli ecc) per organizzare logicamente i contenuti
  • Permettere la navigazione tramite tastiera (tramite tasto TAB)
  • Avere un buon contrasto fra testo e sfondo (Colour Contrast Analyzer, http://webaim.org/resources/contrastchecker/ , http://www.snook.ca/technical/colour_contrast/colour.html)
Colour Contrast Analyser

Colour Contrast Analyser

  • Far funzionare i form con gli screen reader introducendo il tag <label> ovvero l’associazione tra i campi di inserimento e le rispettive etichette di testo.
  • Permettere di ridimensionare il carattere (grazie all’utilizzo di una dimensione del carattere relativa e non in px)
  • Avere un link (magari visivamente nascosto) ad inizio pagina che permetta di raggiungere direttamente il contenuto principale (si evita che lo screen reader legga il menu di navigazione globale facendo risparmiare decine di secondi) sfruttando le proprietà dell’anchor text.
    <body>
    <a href="#maincontent">Vai al contenuto principale</a>
    ...
    <div id="maincontent>
    <h1>Il mio titolo</h1>
    <p>Il mio contenuto</p>
  • Usare l’attributo acceskey per associare il link direttamente ad un tasto della tastiera

          <a accesskey=“2” id=“content”></a>

          <p>Il mio contenuto</p>

e col tasto alt-2 si accede direttamente ai contenuti.

 

 

 

Emozioni nel Web

Quali sono le emozioni più significative del web?

Esistono metodi per misurarle?

Esistono tecniche per stimolarle?

 

Abbiamo visto nel post il ruolo delle emozioni nella User Experience come vengono classificate le emozioni e la loro distinziona fra primarie e secondarie.

 

Per misurare lo stato emotivo di un soggetto di fronte ad una tecnologia o un prodotto possono essere prese in considerazione diversi parametri comportamentali e fatte una serie di misure fisiologiche durante una fase di test:

 

  1. Espressioni facciali: sono una delle metodologie più importanti con le quali comunichiamo le nostre emozioni
  2. Analisi tono della voce: anche il tono della voce ha un ruolo di primaria importanza nello studio delle emozioni perchè condizionato dal rilassamento o distensione involontario di una serie di muscoli coinvolti nella produzione dei suoni
  3. Dilatazione pupille: forti stimoli emotivi (sia positivi che negativi) portano alla contrazione o dilatazione delle pupille. Avete in mente il gatto degli stivali di Shrek? appunto…
  4. Movimenti e postura: se siamo ansiosi ci muoviamo avanti ed indietro per la stanza o tendiamo a spostare e rispostare il primo oggetto che troviamo sulla scrivania…
  5. Parametri fisiologici: frequenza cardiaca ECG, frequenza respiratoria, elettroencefalogramma EEG, pressione sanguigna, attività elettrodermica

 

Queste misure possono essere integrate anche dall’ausilio di un questionario sull’esperienza vissuta o in alternativa un diario (tecniche self report) dove l’utente può appuntarsi il proprio stato emotivo in ogni step di esecuzione del test.

 

Le emozioni nel Web

Sono stati fatti numerosi test a riguardo anche in ambito web.

Per il web sono state classificate 6 emozioni principali:

 

  1. odio
  2. ansia
  3. noia
  4. divertimento
  5. serenità
  6. amore

 

Un interessante progetto è l “Emotion-based Web User Interfaces” del CNR di Pisa visitabile all’indirizzo http://giove.isti.cnr.it/tools/EWUI/home.
In cosa consiste il progetto?
Appoggiandosi a Spotify genera un’interfaccia (un layout) di gestione dei contenuti in cui è possibile scegliere l’emozione che essa scaturirà.
In sintesi il suo scopo è quello di definire delle linee guida per stimolare varie tipologie di emozioni nell’interazione con una pagina web.

 

 

Emozioni nel web

Emozioni nel web: fonte http://giove.isti.cnr.it/tools/EWUI/home

 

Emotion-based Web User Interfaces

Cosa serve per provarlo?

1. Spotify funzionante sul proprio pc
2. Collegarsi all’indirizzo http://hiis.isti.cnr.it/demo/ems/

Ecco come si presenta la homepage.

Emotion-based Web User Interfaces Homepage

Emotion-based Web User Interfaces Homepage

Basta selezionare l’emozione dal menu (attenzione questo menu spesso rimane dietro alle altre pagine aperte e non si trova più).

Emotion-based Web User Interfaces popup selezione emozione

Emotion-based Web User Interfaces popup selezione emozione

Mi sono sbizzarrito un po’ ed ho ottenuto le seguenti presentazioni (vi consiglio di provare voi stessi perchè tanti dettagli come animazioni, scattering, malfunzionamenti possono essere solo apprezzati in prima persona).

Odio: layout confuso, interazione difficile, elementi non funzionanti,immagini e testi sfocati; colori: nero


Ansia: elementi che si trasformano, effetti dinamici, fattori di stress, sfocature, elementi non funzionanti; colori: nero, giallo-grigio, blu marino


Noia: nessuna immagine, molta informazione testuale, muri di parole; colori: argento, grigio, nero


Divertimento: movimenti, effetti dinamici, animazioni, estetica attraente,ordine; colori: arancione, verde, giallo, azzurro, fucsia


Serenità: staticità, buon look and feel, label chiare, interazione semplice; colori: rosso, arancione, giallo, verde, azzurro


Amore: estetica e grafica attraente, interazione e navigazione facile, buona formattazione testo, buona usabilità; colori: rosso, rosa

 

Questi risultati meritano un commento.

Prima di tutto ogni elemento non funzionante, non ben formattato (es sfocature) e non leggibile contribuisce ad aumentare il senso di odio per quel sito.

 

Il testo non formattato in maniera adeguata (senza elenchi, senza parole in bold, ecc) e comunque lungo e non accompagnato da immagini è fonte di noia. Una pagina web non è una pagina di un libro. Chi vuole scrivere per il web deve essere il più possibile sintetico, essenziale, asciutto e arrivare al succo del discorso senza tanti giri di parole.

 

In generale tutto ciò che è in movimento è un rischio perchè si perde la sensazione del controllo. Può divertire ed intrattenere la prima volta che si visita il sito ma in generale è fonte di ansia. Nella stessa casistica entrano i popup.

 

Ciò che fà stare bene stimolando serenità e amore sono due fattori: buona usabilità e un buon look and feel.

 

Questi risultati possono essere interpretati come una specie di riprova che quando si parla di emozioni (e quindi di User Experience) non solo l’aspetto è importante ma anche l’usabilità ha un ruolo importantissimo ed insieme vanno a braccetto nel predeterminare il successo o meno di un qualsiasi prodotto o servizio.

 

 

Il ruolo delle emozioni nella User Experience

Il focus delle emozioni nella User Experience la “elevano” ad un gradino superiore rispetto ai concetti di Usabilità e User Centered Design.

La definizione ISO della user Experience è la seguente:

“Le percezioni e le reazioni di un utente che derivano dall’uso o dall’aspettativa d’uso di un prodotto, sistema o servizio“.

Le note aggiuntive di questa definizione spiegano che l’esperienza d’uso comprende tutte le emozioni dell’utente.

La user experience amplifica il concetto di soddisfazione racchiuso nella definizione di usabilità (usabilità ISO=”La misura in cui un prodotto può essere usato da particolari utenti per raggiungere certi obiettivi con efficacia, efficienza, soddisfazione in uno specifico contesto d’uso”.) puntando non solo alla soddisfazione pratica ma anche emotiva, non solo all’esecuzionale ottimale dei task ma alla memorabilità (anche inconscia) di un prodotto o servizio.

 

“I prodotti soddisfano bisogni, le esperienze desideri.” M. Gobé, (2001).

 

Quindi la User experience riguarda le emozioni legate ad un prodotto non solo nell’atto dell’utilizzo ma in un arco temporale che parte molto prima (es rumors legati ad una nuova tecnologia) e termina molto dopo (es condivisione su social network o soggetto di una storia da raccontare in ufficio).

 

 

Ma cos’è un’emozione? L’emozione può essere definita come  “la catena di eventi che si innescano tra uno stimolo scatenante (input) e l’esecuzione del comportamento elaborato come risposta (output)” [Gallucci, 2006]

 

La letteratura riporta varie classificazioni di emozioni.

Prendendo in considerazione quella di Ekman (1972) si possono distinguere 6 emozioni primarie.

  • Disgusto
  • Tristezza
  • Gioia
  • Paura
  • Sorpresa
  • Rabbia

Sono universali, innate, nascono spontaneamente e di origine biologica.

 

Le altre (invidia, vergogna, ansia, rassegnazione, gelosia, speranza, perdono, offesa, nostalgia, rimorso e delusione) sono una combinazione di due o più emozioni primarie.

 

Emozioni e scelte

 

Siamo convinti di prendere decisioni in base a ragionamenti logici e coerenti, ma in realtà è il nostro sistema “incoscio” che ci governa, è lui che ci condiziona quotidianamente in ogni singola decisione.

Ecco perchè spesso non riusciamo a dare una giustificazione di molte cose che facciamo; molti processi che avvengono nel nostro cervello non sono accessibili alla coscienza o lo sono solamente in una minima percentuale.

 

La cosa veramente interessante è che senza le emozioni non saremmo in grado di prendere decisioni e saremmo in completa balia degli eventi esterni.

 

Infatti alcuni studi (Damasio 1994) riportano di pazienti non in grado di provare emozioni a causa di lesioni in alcune parti del cervello che potremmo definire quindi “incondizionatamente razionali”, non sono in reltà in grado di comportarsi razionalmente nella vita quotidiana ed iterano i loro sbagli senza potervisi opporre.

 

Le emozioni, che abbiamo ritenuto per molto tempo separate dal raziocinio, in realtà fungono in un certo senzo come da bilancia, come metodo per tarare le nostre scelte e decisioni.

 

Emozioni e spazi emotivi

 

Per capire le emozioni è utile appoggiarsi al concetto degli spazi emotivi.

E’ possibile creare un grafico incrociando un primo asse dell’intensità emozionale (arousal, lo stato di eccitazione/attivazione dell’organismo) con un secondo asse del valore positivo o negativo dell’esperienza venendo così a creare uno “spazio fisico” dove collocare ogni esperienza di uso di un qualsiasi prodotto. Si parla di circomplessi (Russel, 1980).

Circomplesso emozioni

Circomplesso emozioni

Questo modello è in realtà un po’ superato in quanto limita verso una sola polarità di emozione escludendo la possibilità ad emozioni contrapposte di poter convivere.

 

In realtà emozioni contrastanti spesso convivono nell’esperienza quotidiana applicata a qualsiasi oggetto (o relazione personale). Si veda ad esempio questo test Panas (Positive and Negative Affect Scale)

 

Non è mai tutto bianco o tutto nero.

Ecco perchè spesso vengono usati modelli circomplessi bidimensionali per una miglior collocazione emozionale.

Nei risultati sull’utilizzo di un prodotto spesso uno stesso aspetto viene valutato positivamente per poi essere valutato negativamente o viceversa.

Questo perchè magari ne viene approfondita la modalità di utilizzo in determinati contesti nei quali cambia radicalmente la valutazione.

 

Ad esempio pochi bottoni possono essere visti positivamente all’inizio perchè “rassicuranti” e poco impegnativi. Successivamente con l’utilizzo si capisce che sono appunto quei pochi bottoni ha rendere le funzioni più evolute poco gestibili (es bottoni con multifunzionalità non chiare e difficilmente memorizzabili) e quindi far pendere il prodotto verso emozioni negative.

 

Emozioni nella User Experience: Il rapporto fra emozione e prodotto

Sono i prodotti a generare emozioni o le emozioni a generare i prodotti?

 

La risposta è che entrambe le ipotesi sono vere. In ogni caso un prodotto per avere possibilità di successo deve necessariamente essere correlato da emozioni; ne può essere fonte o traguardo, può esserne caratteristica aggiunta o interna al proprio DNA.

 

Ecco le casistiche che si possono avere:

  1. Mi servo di un’emozione per progettare un prodotto
  2. Un prodotto genera un’emozione
  3. Il prodotto viene arricchito con una componente emozionale
  4. Il prodotto ha proprie emozioni
Emozioni nella user experience

Emozioni nella User Experience: Relazione prodotto emozione

Che tipo di reazione abbiamo ad un’emozione?

Ognuno di noi reagisce in maniera diversa di fronte ad un evento scatenante, ma ci sono fattori comuni che possono essere in un certo senzo “classificati e misurati” in base alla reazione che ne scaturisce

 

  • Fisiologica (es aumento del tasso del battito cardiaco, dilatazione della pupilla, frequenza respiratoria)
  • Espressiva (es espressione facciale)
  • Sperimentale (sensibilità soggettiva che la persona può riconoscere e descrivere a parole)
  • Comportamentale (per esempio gesticolare, alzare la voce)

Nel prossimo post riporterò un interessante progetto condotto dal CNR (Consiglio Nazionale delle Ricerche) di Pisa riguardante le emozioni più significative del web con una loro classificazione e stimolazione.

Icone ed usabilità

Che cosa sono le icone? che ruolo hanno in termini di usabilità?

Le icone sono dei disegni (più o meno stilizzati) che servono per comunicare all’utente un’informazione.

Icone ed usabilità

Le icone sono importanti perchè:

 

  • sono più facili da ricordare. Infatti è risaputo (la letteratura scientifica lo riporta) che l’informazione nella memoria a lungo termine è codificata in maniera diversa a seconda del canale sensoriale attraverso il quale è stata assimilata e che le immagini tendono ad essere ricordate più a lungo e con più facilità. Questo fenomeno è noto come la superiorità dell’immagine. Infatti le persone ricordano l’80% di quello che vedono e fanno, il 20% di quello che leggono, il 10% di quello che ascoltano.
Superiorità dell'immagine

Superiorità dell’immagine

 

  • favoriscono il riconoscimento piuttosto che il ricordo. E’ piu facile riconoscere che rievocare ed anche questo proviene dalla letteratura scientifica. Riconoscere (rievocare) implica un recupero di un ricordo precedentemente immagazzinato e costa fatica. Il riconoscimento è la capacità di classificare come familiari stimoli che siano già stati visti (e vissuti) in situazione passate. Sono quindi più immediati e quindi meno faticosi. (Non per niente una delle euristiche di Nielsen abbraccia questa visione).

 

Classificazione delle icone

Le icone possono essere classificate in base al grado di riproduzione con l’entità da raffigurare ovvero in maniera inversamente proporzionale al grado di astrazione (e quindi al grado di ambiguità ed interpretazione)

 

  • Icone rassomiglianti: raffigurano interamente il concetto da comunicare. Ne sono un esempio le icone usate per le applicazioni (e siti) riguardanti il meteo. In maniera indipendente dalla nazione o cultura dell’utente il mapping fra queste icone e lo stato metereologico è chiaro e lampante sia perchè vi è una forte associazione con l’esperienza del mondo reale (Norman) sia perchè essendo complete non lasciano molto spazio ad interpretazioni errate.
Icona rassomigliante

Icona rassomigliante

 

  • Icone esemplari: raffigurano solo una parte del concetto da esprimere e si affidano all’utente per essere associate al tutto. Ecco che il contesto culturale e sociale entrano in gioco. Entrano in questo gruppo ad esempio l’immagine di forchetta e coltello a rappresentare un ristorante, o le forbici e il pettine per il parrucchiere. Ma siamo sicuri che tali rappresentazioni siano universalmente riconosciute? direi di no visto che in certi posti si usano i bastoncini per mangiare e che magari in certe culture il pettine non è molto diffuso.
Icona esemplare ristorante

Icona esemplare ristorante

  • Icone simboliche: se non si riesce a disegnare neanche una sottoparte del messaggio, oppure questo è un’entità astratta (per esempio “salute”, “bellezza”, “ricchezza”) si può ricorrere a disegni simbolici che facciano da tramite verso il concetto tramite un mapping il più possibile diretto. Se per esempio voglio indicare “pesante” posso utilizzare il simbolo del peso oppure della bilancia o dell’elefante.
Icona simbolica pesantezza

Icona simbolica pesantezza

 

Si capisce quanto l’icona di questo tipo sia soggetta a forte intrepretazione da parte dell’utente e richieda comunque un certo sforzo sia dipendente dal contesto e dalla modalità di utilizzo. Le icone in figura (quelle classiche su un pacco trasportato) sono facilmente interpretabili se viste da un magazziniere appunto su un pacco.

Icone simboliche su scatola di trasporto

Icone simboliche su scatola di trasporto

 

Le stesse potrebbero non essere così ovvie se messe in un altro contesto.

Una volta mi ritrovai a discutere su un sito il cui scopo era far risparmiare soldi in ambito di vacanze (non mi divulgo) . Il designer aveva optato per utilizzare questa tipologia di icona (salvadanaio) per il concept.

Icona simbolica salvadanaio

Icona simbolica salvadanaio

Ma scoprimmo che l’icona maggiormente riconosciuta per questo concetto era in realtà il maialino.
(come feci? semplicemente cercando sui vari motori di ricerca Google, Bing, Baidu, Yandex, ecc il termine “money box” e guardando i risultati nelle immagini).

Icona simbolica salvadanaio maialino

Icona simbolica salvadanaio maialino

 

  • Icone arbitrarie: sono le icone che non ricadendo nei tre gruppi sopra non hanno un mapping “diretto” con un concetto e sono quindi specifiche per quell’applicazione o sistema e vanno necessariamente imparate ad hoc.

 

Come scegliere le icone

Come abbiamo visto le icone sono importanti perchè se sfruttate in maniera adeguata riescono a veicolare l’informazione in maniera più diretta e permanente nella testa dell’utente.

Allo stesso tempo la loro interpretazione può essere soggetta al background socio-culturale e contesto di utilizzo.

In linea di massima la strategia da adottare è quella di prediligere, quando possibile, le icone nella scala: rassomiglianti, esemplari, simboliche, arbitrarie.

Invertendo si potrebbe dire di non scegliere icone del gradino inferiore quando sono tranquillamente utilizzabili icone del gradino superiore. Ad esempio se esistono icone simboliche soddisfacenti per esperimere il concetto è preferibile usare quelle piuttosto che inventarsele di sana pianta.

Tipologia di icone ed usabilità

Tipologia di icone ed usabilità

L’adesione agli standard Norman (sia tecnologici che culturali) è un buon punto di partenza a conferma di questo principio di azione.