![Page 1: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/1.jpg)
Emmanuel Mazzucchi
26.04.2017
Interfacce – usabilità – architettura
dell’informazione – service design
![Page 3: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/3.jpg)
Studi in laboratorio
Lavoriamo con un campione
Task analysis
Card sorting / Tree testing
Eye-tracking test
Contextual
interview
Focus Group
Analytics: il
comportamento di tutti gli
utenti
Visual analytics
Funnel analysis
Online survey
UX research
27/04/2017 UX 3
![Page 4: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/4.jpg)
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
![Page 5: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/5.jpg)
Identifichiamo problemi di usabilità (efficienza, efficacia, soddisfazione)
Usability Lab Studies (task analysis)
![Page 6: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/6.jpg)
Visual Analytics
Click, scroll, tap, mouse movements
Click Heatmap
Dove cliccano o fanno tap
gli utenti
Mouse (movement)
Heatmap
Dove si ferma il mouse e co
me si muove nella pagina
Scrollmap
Quanto vengono
scrollate le pagine
![Page 7: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/7.jpg)
27/04/2017 UX slide 7
![Page 8: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/8.jpg)
27/04/2017 UX 8
![Page 9: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/9.jpg)
27/04/2017 UX slide 9
Un approccio centrato sulla
comunicazione
• Molteplicità dei soggetti coinvolti
• Meno vincolato alle specifiche tecnologie
di volta in volta utilizzate
• Prende in considerazione efficacia e
efficienza sia dal punto di vista dell’utente
che del committente
![Page 10: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/10.jpg)
Il percorso
27/04/2017 UX 10
interfacce
Usabilità
Task analysis User experience
Architettura dell’informazione
Card sorting Service design
Customer journey
![Page 11: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/11.jpg)
UX 11
http://www.vox.com/2016/2/26/11120236/bad-doors-human-centered-
design
27/04/2017
DoorDonald
NormanNorman door
discoverabilityfeedback
![Page 12: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/12.jpg)
Una storia vera
Gentile XXXX,
può farsi rispedire la password da
questa pagina indicando l’indirizzo
con cui si è registrato
Emmanuel Mazzucchi
"
"
27/04/2017 UX 12
![Page 13: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/13.jpg)
Interfaccia
utenteprogettista
Modello del progettista
Modello dell’utente
Immagine del sistema
Cultura
Dotazione tecnologica
Abilità
Obiettivi
Etc.
Cultura
Dotazione tecnologica
Abilità
Obiettivi
Etc.
UX 1327/04/2017
![Page 14: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/14.jpg)
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
UX 1427/04/2017
![Page 15: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/15.jpg)
27/04/2017 UX 15
![Page 16: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/16.jpg)
UX 1627/04/2017
![Page 17: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/17.jpg)
UX 1727/04/2017
![Page 18: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/18.jpg)
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
UX 1827/04/2017
![Page 19: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/19.jpg)
Schermo:
interfaccia per vedereSchermo:
interfaccia per vedere, fare
tap, swipe, etc.
UX 1927/04/2017
![Page 20: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/20.jpg)
Internet of things: nuove funzioni per
le «cose» di tutti i giorni
UX 2027/04/2017
![Page 21: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/21.jpg)
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
UX 2127/04/2017
![Page 22: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/22.jpg)
Categorie di interfacce
Interfacce 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
UX 2227/04/2017
![Page 23: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/23.jpg)
UX 2327/04/2017
![Page 24: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/24.jpg)
UX 2427/04/2017
![Page 25: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/25.jpg)
Interfacce grafiche o a comandi?
UX 2527/04/2017
![Page 26: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/26.jpg)
Interfacce grafiche o a comandi?
UX 2627/04/2017
![Page 27: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/27.jpg)
“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
UX 2727/04/2017
![Page 28: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/28.jpg)
«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)
UX 2827/04/2017
![Page 29: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/29.jpg)
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)
UX 2927/04/2017
![Page 30: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/30.jpg)
UX 3027/04/2017
![Page 31: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/31.jpg)
UX 3127/04/2017
La caffettiera del masochista
2014
![Page 32: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/32.jpg)
Scopo
Piano di azione
Esecuzione
Interpretazione dello stato del mondo
Valutazione
del risultato
Norman,
modello
multistadiale
dell’azione
Percezione
dello stato del
mondo
UX 3227/04/2017
![Page 33: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/33.jpg)
Scopo
Piano di azione
Esecuzione
Interpretazione dello stato del mondo
Valutazione
del risultato
Golfo dell’esecuzione
Golfo della valutazione
Norman,
modello
multistadiale
dell’azione
Percezione
dello stato del
mondo
UX 3327/04/2017
![Page 34: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/34.jpg)
Problema: esecuzione
UX 3427/04/2017
![Page 35: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/35.jpg)
Problema: interpretazione
UX 3527/04/2017
![Page 36: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/36.jpg)
interpretazione
UX 3627/04/2017
![Page 37: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/37.jpg)
Problema: valutazione
UX 3727/04/2017
![Page 38: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/38.jpg)
Scopo
Piano di azione
Esecuzione
Interpretazione dello stato del mondo
Valutazione
del risultato
Golfo dell’esecuzione
Golfo della valutazione
Norman,
modello
multistadiale
dell’azione
Percezione
dello stato del
mondo
UX 3827/04/2017
![Page 39: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/39.jpg)
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”
UX 3927/04/2017
![Page 40: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/40.jpg)
Principi di usabilità
(Norman, 1998)
1. Rendere le cose visibili
2. Fornire feedback
3. Fornire vincoli
– Fisici
– Logici
– Culturali
4. Fornire un mapping naturale
5. Garantire la consistenza
6. Fornire affordance
UX 4027/04/2017
![Page 41: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/41.jpg)
Affordance
UX 4127/04/2017
![Page 42: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/42.jpg)
Affordance e feedback
UX 4227/04/2017
![Page 43: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/43.jpg)
Affordance
UX 4327/04/2017
![Page 44: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/44.jpg)
Vincoli o consistenza?
UX 4427/04/2017
![Page 45: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/45.jpg)
Rendere le cose visibili
UX 4527/04/2017
![Page 46: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/46.jpg)
Mapping
UX 4627/04/2017
![Page 47: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/47.jpg)
Mapping e consistenza
UX 4727/04/2017
![Page 48: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/48.jpg)
Mapping
UX 4827/04/2017
![Page 49: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/49.jpg)
Mapping
UX 4927/04/2017
![Page 50: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/50.jpg)
Principi di usabilità
(Norman, 1998)
1. Rendere le cose visibili
2. Fornire feedback
3. Fornire vincoli
– Fisici
– Logici
– Culturali
4. Fornire un mapping naturale
5. Garantire la consistenza
6. Fornire affordance
UX 5027/04/2017
![Page 51: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/51.jpg)
UX 5127/04/2017
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 naturale
Fornire 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 errori
Inserire 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 rapidi
Permettere un’inversione semplice delle azioni
Flessibilità ed efficienza
11 Progettare dialoghi provvisti di chiusura
![Page 52: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/52.jpg)
UX 5227/04/2017
Regole di Shneiderman per il design delle interfacce
1. Preservare la coerenza
2. Consentire agli utenti abituali di usare comandi rapidi
3. Offrire un feedback informativo per ogni azione dell’utente
4. Progettare dialoghi provvisti di chiusura
5. Offrire una prevenzione e una gestione semplice degli errori
6. Permettere un’inversione semplice delle azioni
7. Fornire controllo
8. Ridurre il carico della memoria a breve termine
Shneiderman, Designing the user interface, III edizione, Addison-
Wesley, 1999
![Page 53: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/53.jpg)
Emmanuel Mazzucchi
26.04.2017
architettura dell’informazione
![Page 54: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/54.jpg)
27/04/2017 UX slide 54
Architettura di cosa?
![Page 55: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/55.jpg)
27/04/2017 UX slide 55
Modalità di ricerca di informazioni
Strategie spesso
usate insieme
Search monitorare
browsingMantenersi
consapevoli
Dirette
Indirette
Attive Passive
![Page 56: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/56.jpg)
27/04/2017 UX slide 56
User needs: diversi tipi di ricerca
![Page 57: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/57.jpg)
27/04/2017 UX slide 57
La classificazione ideale
Ogni classe è identificata da alcune proprietà. Se un elemento
le possiede, fa parte di quella classe, altrimenti non ne fa
parte. Non ci sono vie di mezzo.
• Confini chiari tra le classi
• Classificazione indipendente dal classificatore
• Tutti gli item sono sullo stesso piano (non ce ne sono alcuni più
rappresentativi)
![Page 58: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/58.jpg)
27/04/2017 UX slide 58
Tassonomie gerarchiche
• Usare un unico criterio di classificazione
• Coerenza del criterio di classificazione
• Attenzione all’ordine in cui sono presentate le classi
Esseri viventi
animali
mammiferi Rettili etc
piante
![Page 59: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/59.jpg)
27/04/2017 UX slide 59
Tassonomia poligerarchicaPermette il cross – listing (un item può stare in più di una categoria)
Catalogo prodotti
Prodotti usati
…… Libri
Libri
….. Usati
![Page 60: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/60.jpg)
27/04/2017 UX slide 60
Ma per le persone…. (Lakoff)
• Non esistono categorie che siano giuste o sbagliate a priori,
indipendentemente dal contesto
• Esistono categorie ibride
• Si possono ottenere confini netti solo tra gli elementi centrali di
una classe
• Usando tali elementi come prototipi si facilita l’orientamento
degli utenti
![Page 61: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/61.jpg)
27/04/2017 UX slide 61
Criteri di organizzazione tipici per classificazioni pure
• Alfabetico
• Cronologico
• Geografico
• Per argomento
• Per task
• Per tipologia di utente
• Per singolo utente
• Metafore
• Modelli ibridi
![Page 62: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/62.jpg)
27/04/2017 UX slide 62
Card sorting
![Page 63: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/63.jpg)
27/04/2017 UX slide 63
Card sorting
![Page 64: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/64.jpg)
27/04/2017 UX slide 64
Card sorting: le varianti
• Aperto: per definire le categorie.
Viene chiesto agli utenti di scegliere i nomi dei gruppi
• Chiuso: per verificare la categorizzazione proposta
Viene chiesto agli utenti di collocare gli item tra una lista di
categorie
• Per definire l’elenco degli item (brainstorming tra progettisti)
• Per verificare la comprensione degli item (con gli utenti)
• Per classificare gli item (brainstorming tra progettisti o con gli
utenti)
![Page 65: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/65.jpg)
27/04/2017 UX slide 65
Card sorting: istruzioni per
l’utente• Organizza gli item in gruppi che ritieni significativi
• Non pensare all’interfaccia, pensa all’organizzazione dei contenuti
• Se vuoi puoi creare sottogruppi
• Se vuoi puoi correggere un’etichetta
• Non ti preoccupare di riprodurre un’organizzazione coerente con l’attuale sito
• Una volta che i gruppi sono stati creati, bisogna dare un nome a ciascuno
• Se vuoi segnalare qualcosa che secondo te manca, puoi scriverlo su uno dei cartellini vuoti
• Se c’è qualcosa che non riesci a classificare puoi lasciarlo da parte
![Page 66: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/66.jpg)
27/04/2017 UX slide 66
Cosa si impara
• Meglio organizzare i contenuti per argomento, task, gruppo di
utenti, etc…?
• Gruppi diversi hanno comportamenti omogenei al loro
interno?
• Quanto sono diversi i bisogni di gruppi distinti?
• Quante categorie dovrei creare?
• Quali etichette dovrei usare per queste categorie?
![Page 67: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/67.jpg)
27/04/2017 UX slide 67
Risultati
• Analisi statistica
– Cluster (gruppi di comportamenti omogenei)
– Correlazioni tra item
– Livello di accordo tra gli utenti circa gli item
• Altri dati
– Think aloud
– Commenti e suggerimenti sulla comprensibilità delle etichette
– Proposte di nuovi item
– Elementi di difficile classificazione
– Differenti modelli mentali corrispondenti a diversi tipi utente
![Page 68: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/68.jpg)
27/04/2017 UX slide 68
Varianti
• Priorità. Quali contenuti vorresti in home page?
• Task di verifica. Domandare agli utenti, sulla base delle
categorie scelte. dove metteresti l’item X?
• Questionario. è stato semplice classificare l’item x?
![Page 69: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/69.jpg)
27/04/2017 UX slide 69
Organizzare il card sorting: le card
• Evitare ambiguità
• Assicurarsi di aver incluso tutti i termini da classificare
• Presentare gli item in maniera casuale
• Mantenere un livello uniforme di granularità
• Prevedere sempre cartellini vuoti che l’utente possa
compilare
• Si consiglia un numero di cards compreso tra 30 e 100
• Valutare gli aspetti logistici (card sorting digitale e
cartaceo, etichette adesive e non, post it)
![Page 70: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/70.jpg)
27/04/2017 UX slide 70
Organizzare il card sorting: gli
utentiGli utenti devono essere rappresentativi
• Card sorting individuali (finalizzati ad analisi statistiche dei dati
raccolti)
Jacob Nielsen consiglia 15 utenti. La numerosità necessaria è
influenzata dalla variabilità del target e dagli obiettivi (generativi – valutativi)
• Card sorting di gruppo (dimensione qualitativa)
Buoni risultati anche con 5 gruppi di 3 persone
![Page 71: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/71.jpg)
27/04/2017 UX slide 71
Riferimenti sul Card sorting
• Donna (Maurer) Spencer, Card sorting, Rosenfeld Media,
http://rosenfeldmedia.com/books/card-sorting/
• Donna Maurer e Todd Warfel, Card sorting: a definitive guide
http://boxesandarrows.com/card-sorting-a-definitive-guide/
• Web based card sorting
http://www.optimalsort.com
![Page 72: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/72.jpg)
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, Dordrecht
Card, Stuart; Thomas P. Moran and Allen Newell (1983). The Psychology of Human
Computer Interaction. Lawrence Erlbaum Associates
Galloway A. (2012), The Interface Effect, Polity
Hassenzahl, 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
UX 7227/04/2017
![Page 73: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/73.jpg)
Bibliografia
Nielsen-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) 2004
Norman, 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).
UX 7327/04/2017
![Page 74: UX - Sapienza - UX interfacce... · 27/04/2017 UX 51 Norman Shneiderman Nielsen 1 Garantire la consistenza Preservare la coerenza Consistenza 2 Rendere le cose visibili (visibilità)](https://reader031.vdocuments.site/reader031/viewer/2022022701/5bbebc1c09d3f208478c8134/html5/thumbnails/74.jpg)
27/04/2017 UX slide 74
Sull’architettura dell’informazione
Abbey Covert http://www.howtomakesenseofanymess.com/
IAinstitute
https://docs.google.com/spreadsheets/d/1fxLmmCsy2PmfPCWOtHbdlnut
2gaopcy_S8b0_Z7Wkd8/edit#gid=0
Morville, P., Rosenfeld, L., & Arango, J. (2015). Information Architecture for
the Web and Beyond.
Rosati, L. (2007), Architettura dell’informazione, Apogeo, Milano