interfacce, ux e tv - coris.uniroma1.it · visual analytics click, scroll, tap, mouse movements...

Interfacce, UX e tv

Emmanuel Mazzucchi04.04.2016

Il percorso

Emmanuel Mazzucchi Interfacce e UX 2

04.04 (2h)Interfacce

e UX

05.04 (2h)Interfacce e

UX

19.04 (5h)Experience design e tv

Digilab UX Lab


Studi in laboratorioLavoriamo con un campioneLavoriamo con un ccampionecam

Task analysis

Card sorting / Tree testing

Eye-tracking test

Contextualinterview

isyalysi Eye-trackin

Focus Group

Analytics: ilcomportamento di tutti gli

utentiuute

Visual analytics

Funnel analysis

Online survey

UX research


Identifichiamo i pattern di attenzione e valutiamo il visual design• Dove cade all’inizio lo sguardo dell’utente? • Quali aree vengono ignorate?• Dove si soffermano più a lungo?• La pubblicità viene guardata o ignorata?

Eyetracking study

Identifichiamo problemi di usabilità (efficienza, efficacia,soddisfazione)

Usability Lab Studies (task analysis)

Visual AnalyticsClick, scroll, tap, mouse movements

Click Heatmap

Dove cliccano o fanno tap gli

utenti

Mouse (movement)Heatmap

Dove si ferma il mouse e come si muove nella pagina

Scrollmap

Quanto vengonoscrollate le pagine

Interfacceuser experience

human centered design


Interfacce e UX 9

http://www.vox.com/2016/2/26/11120236/bad-doors-human-centered-design

Emmanuel Mazzucchi

DoorDonald Norman

Norman doordiscoverabilityfeedback

Una storia vera

Gentile XXXX,può farsi rispedire la password da questa pagina indicando l’indirizzo con cui si è registratoEmmanuel Mazzucchi

"

"


Interfaccia

utenteprogettista

Modello del progettista

Modello dell’utente

Immagine del sistema

Cultura

Dotazione tecnologica

Abilità

Obiettivi

Etc.

Cultura

Dotazione tecnologica

Abilità

Obiettivi

Etc.

Interfacce e UX 11Emmanuel Mazzucchi

Problemi di comunicazione come questi possono essere riconducibili a:

• La qualità del modello del progettista• La maniera in cui viene rappresentato

Modello del progettista

Modello dell’utente

Situazione idealeSituazione problematica


Definizioni

Interfaccia: “zona dell’adattamento fra corpo dell’uomo e apparecchiatura” (Anceschi)

Un insieme di significati, veicolati attraverso caratteristiche fisiche, convenzioni di linguaggio e culturali.

UI (User Interface): tra il sistema informatico e l’utente. Presenta sistemi di input e output


Schermo:interfaccia per vedere

Schermo:interfaccia per

vedere, fare tap, swipe, etc.


Internet of things: nuove funzioni per le «cose» di tutti i giorni


Le categorie di interfacce

A un primo livello di generalità si distinguono per• Sistemi percettivi coinvolti• Attività cognitive richieste• Quantità e direzionalità dei messaggi tra utente e sistema


Categorie di interfacceInterfacce grafiche

rappresentazione dell’informazione su uno spazio visivo

bidimensionale, all’interno del quale l’utente si può muovere

rappresentato come un cursore (es. Windows).

– Wimp: Windows, Icons, Menu, Pointing devices

Interfacce a comandi

Vengono fornite dall’utente istruzioni secondo linguaggi codificati

Interfacce conversazionali: viene simulato un dialogo con una

persona, sotto forma di conversazione. Ogni step del dialogo è

influenzato dalla precedente risposta


Interfacce grafiche o a comandi?


“Modalità”

Canale di comunicazione tra utente e macchina: corrisponde in

genere a uno specifico canale sensoriale umano o a uno

specifico sensore della macchina

– Modalità visiva

– Modalità uditiva

– Modalità tattile

– Riconoscimento delle emozioni

– etc


«Modi»Stato del sistema in cui un input produce uno specifico risultato. Se un’interfaccia è multimodale, in corrispondenza di diversi modi il medesimo input produrrà diversi risultati.

– Es. modo silenzioso del sistema– Es. Caps Lock (maiuscolo)Interfacce multimodali possono produrre errori basati

sull’oscillazione tra modalità

(Jef Raskin, Interfacce a misura d’uomo)


I problemi dei sistemi multifunzione

Il computer ha una molteplicità di funzioni che corrisponde a un

numero limitato di comandi, è necessariamente multimodale

Per Norman («Il computer invisibile») e Wieser («The coming age of

calm technology») le funzioni dovrebbero essere distribuite tra una

molteplicità di interfacce specializzate, in grado di dialogare tra di

loro per ridurre il carico cognitivo dell’utente (ubiquitous computing,

agenti intelligenti, etc)



La caffettiera del masochista

2014

Scopo

Piano di azione

Esecuzione

Interpretazione dello stato del mondo

Valutazionedel risultato

Norman, modello multistadiale dell’azione

Percezionedello stato del

mondoInterfacce e UX 30Emmanuel Mazzucchi

Scopo

Piano di azione

Esecuzione



Golfo dell’esecuzione

Golfo della valutazione




Problema: esecuzione


Problema: interpretazione


Compaq sta considerando di cambiare il comando "Press Any Key" in "Press Return Key" a causa delle continue chiamate che chiedono quale sia il tasto "Any“

A una cliente di AST viene chiesto di spedire indietro una copia dei suoi dischetti difettosi. Pochi giorni dopo arriva una lettera della cliente con le fotocopie dei floppy.

Problema: interpretazione


interpretazione


Problema: valutazione


Scopo

Piano di azione

Esecuzione



Golfo dell’esecuzione

Golfo della valutazione




Avvicinare il sistema all’utente

1. Ridurre l’ampiezza del golfo dell’esecuzione “affordance”

• Si riferisce alla capacità di un oggetto di far capire come deve essere usato:“non si tratta di una proprietà bensì di una relazione attivata tra l’oggetto e l’organismo che interagisce con esso” (Norman). Parlerà successivamente di signifiers

2. Ridurre l’ampiezza del golfo della valutazione “feedback”


Principi di usabilità (Norman, 1998)

1. Rendere le cose visibili2. Fornire feedback3. Fornire vincoli

– Fisici– Logici– Culturali

4. Fornire un mapping naturale5. Garantire la consistenza6. Fornire affordance


Affordance


Affordance e feedback


Affordance


Vincoli o consistenza?


Rendere le cose visibili


Mapping


Mapping e consistenza


Mapping


Principi di usabilità (Norman, 1998)

1. Rendere le cose visibili2. Fornire feedback3. Fornire vincoli

– Fisici– Logici– Culturali

4. Fornire un mapping naturale5. Garantire la consistenza6. Fornire affordance



Norman Shneiderman Nielsen

1 Garantire la consistenza Preservare la coerenza Consistenza

2 Rendere le cose visibili (visibilità)

Visibilità dello stato del sistema

3 Fornire feedback Offrire un feedback informativo per ogni azione dell’utente

4 Fornire vincoli Prevenzione dell’errore

5 Fornire un mapping naturaleFornire affordance

Corrispondenza tra il sistema ed il mondo reale

6 Offrire una prevenzione e una gestione semplice degli errori

Fornire all'utente i mezzi per riconoscere e riparare gli erroriInserire strumenti di aiuto e istruzioni di utilizzo

7 Ridurre il carico della memoria a breve termine

Riconoscere piuttosto che ricordare

8 Fornire controllo Dare agli utenti controllo e libertà

9 Estetica e progettazione minimalista

10 Consentire agli utenti abituali di usare comandi rapidiPermettere un’inversione semplice delle azioni

Flessibilità ed efficienza

11 Progettare dialoghi provvisti di chiusura


Regole di Shneiderman per il design delle interfacce

1. Preservare la coerenza2. Consentire agli utenti abituali di usare comandi rapidi3. Offrire un feedback informativo per ogni azione dell’utente4. Progettare dialoghi provvisti di chiusura5. Offrire una prevenzione e una gestione semplice degli errori6. Permettere un’inversione semplice delle azioni7. Fornire controllo8. Ridurre il carico della memoria a breve termineShneiderman, Designing the user interface, III edizione, Addison-

Wesley, 1999

BibliografiaAnceschi, G. (1993), Il progetto delle interfacce. Oggetti colloquiali e protesi virtuali. Domus Academy, Milano.Blythe M., Overbeeke K, Monk A., Wright P. (2004), Funology. From Usability to Enjoyment, Kluwer Academic Publishers, DordrechtCard, Stuart; Thomas P. Moran and Allen Newell (1983). The Psychology of Human Computer Interaction. Lawrence Erlbaum AssociatesGalloway A. (2012), The Interface Effect, PolityHassenzahl, M. (2010). Experience Design: Technology for all the right reasons. Synthesis Lectures on Human-Centered Informatics, 3(1), 1-95.Raskin, J., 2000, The human interface, Boston, Addison-Wesley Professional; trad. it.2003, Interfacce a misura d'uomo,Milano, Apogeo Shneiderman (1987), 1987. Designing the User Interface: Strategies for Effective Human-Computer Interaction


BibliografiaNielsen-Norman Group, User Experience - Our Definition,http://www.nngroup.com/about/userexperience.html (01.12.2008).Norman D.A., The design of everyday things, 1998; trad. it. La caffettiera del masochista: psicopatologia degli oggetti quotidiani, Giunti, Firenze, 1990.Norman D.A., Things that make us smart, 1993; trad. it. Le cose che ci fanno intelligenti, Feltrinelli, Milano, 1995.Norman D., The invisible computer, 1998, trad it. Il computer invisibile, Apogeo, Milano, 2000.Norman, D., A,. Emotional Design: Why We Love (Or Hate) Everyday Things, Basic Books (trad. it. Emotional Design. Perche amiamo (o odiamo) gli oggetti di tutti i giorni, Apogeo, 2004) 2004Norman, D. A. (2011). Living with Complexity. Cambridge, MA: MIT Press (Trad it vivere con la complessità)Norman D., The Design of Future Things, Basic Books, New York (NY), 2007 (trad. it.Il design del futuro, Milano, Apogeo,. 2008).


interfacce, ux e tv - coris.uniroma1.it · visual analytics click, scroll, tap, mouse movements...

Documents