Slides dalle lezioni del corso di Interazione Uomo Macchina per il corso di laurea in Informatica - Università di Milano Bicocca - Prof.R.Polillo (a.a.2014-15) - Lezione del 6 maggio 2015
1. Corso di Interazione Uomo Macchina
AA 2014-2015
Roberto Polillo
Corso di laurea in Informatica
Università di Milano Bicocca
Dipartimento di Informatica, Sistemistica e Comunicazione
PRINCIPI E LINEE GUIDA (I)
Edizione
2014-15
1
2. Queste slides…
… si basano sul libro “Facile da usare”, dell’autore, dove si trovano
tutte le necessarie spiegazioni. Vedi www.rpolillo.it
Queste slide sono disponibili con licenza Creative Commons
(attribuzione, non commerciale, condividi allo stesso modo) a
chiunque desiderasse utilizzarle, per esempio a scopo didattico,
senza necessità di preventiva autorizzazione:
http://creativecommons.org/licenses/by-nc-sa/3.0/it/deed.it
La licenza non si estende alle immagini fotografiche e alle screen
shots, i cui diritti restano in capo ai rispettivi proprietari, che sono
stati indicati, ove possibile, nelle didascalie del libro. L’autore si
scusa per eventuali omissioni, e resta a disposizione per
correggerle.
Ρ.Πολιλλο
− Μαρζο
2015
2
3. Scopo di questa lezione
3
Discutere, con esempi, le indicazioni che
possono essere fornite al progettista per
guidarlo nella progettazione di sistemi usabili.
R.Polillo - Marzo 2015
4. Quali indicazioni per il design dell’interfaccia
utente?
R.Polillo - Marzo 2015
4
coercitività
generalità
principi
bassa
bassa
alta
alta
5. Quali indicazioni per il design dell’interfaccia
utente?
R.Polillo - Marzo 2015
5
coercitività
generalità
Linee
guida
principi
bassa
bassa
alta
alta
6. Quali indicazioni per il design dell’interfaccia
utente?
R.Polillo - Marzo 2015
6
coercitività
generalità
Linee
guida
principi
Design
patterns
bassa
bassa
alta
alta
7. Quali indicazioni per il design dell’interfaccia
utente?
R.Polillo - Marzo 2015
7
coercitività
generalità
regole
di progetto
Linee
guida
principi
Design
patterns
bassa
bassa
alta
alta
8. Quali indicazioni per il design dell’interfaccia
utente?
R.Polillo - Marzo 2015
8
coercitività
generalità
standard
regole
di progetto
Linee
guida
principi
Design
patterns
bassa
bassa
alta
alta
9. Terminologia
Principi
Principi generali per la progettazione di interfacce utente usabili, basati su evidenza
scientifica o sul generale consenso. Derivano dalla conoscenza degli aspetti psicologici,
computazionali e sociali e sono indipendenti dalla tecnologia. Sono espressi spesso in
forma molto generale.
Linee guida
Insieme di raccomandazioni per il progetto dell’interfaccia utente per una particolare
classe di sistemi, espresse in modo generale ma meno astratte degli standard, con
esempi e motivazioni.
Non sono vincolanti, sta al progettista decidere sulla opportunità di applicarle caso per caso
Standards
Insieme di regole da applicare nel progetto di una classe di sistemi. Sono vincolanti: i
progettisti devono applicarli. Sono di norma emesse da un Ente di standardizzazione. La
conformità allo standard deve essere valutabile in modo preciso.
Regole di progetto
Insieme di regole da applicare nel progetto di un particolare sistema. Sono vincolanti
R.Polillo - Marzo 2015
9
10. Indicazioni per il design: autorevolezza
Diversi livelli di autorevolezza:
A: Completamente supportate da risultati di ricerca e
dati empirici
B: Basate su pratica generalmente accettata (in modo
documentato)
C:Non ben documentate, ma supportate dall’opinione di
professionisti
D: Opinione individuale
Standard: solo livelli A e B
R.Polillo - Marzo 2015
10
11. Indicazioni per il design: tipologia
R.Polillo - Marzo 2015
11
coercitività
generalità
standa
rd
regole
di progetto
Linee
guida
principi
Design
patterns
bassa
bassa
alta
alta
12. Gli standard per la usabilità
12
Situazione complessa: gli standard
sono in continua evoluzione
(www.iso.org; www.uninfo.it)
Il processo è molto lento, e passa
attraverso diverse fasi
Ci sono standard di prodotto e standard
di processo
R.Polillo - Marzo 2015
13. ISO 9241: Ergonomics of human System
interaction
E’ uno standard composto dalle seguenti serie, ciascuna
delle quali composta di diversi documenti), in diverso
stadio di evoluzione (attualmente, una ventina di
documenti) appartenenti alle seguenti serie:
100 series: Software ergonomics
200 series: Human system interaction processes
300 series: Displays and display related hardware
400 series: Physical input devices – ergonomics principles
500 series: Workplace ergonomics
600 series: Environment ergonomics
700 series: Application domains - Control rooms
900 series: Tactile and haptic interactions
R.Polillo - Marzo 2015
13
14. Indicazioni per il design: tipologia
R.Polillo - Marzo 2015
14
coercitività
generalità
standard
regole
di progetto
Linee
guida
principi
Design
patterns
bassa
bassa
alta
alta
15. User Interface Design
Guidelines
Android:
http://developer.android.com/guide/topics/ui/index.html
iOS:
https://developer.apple.com/library/ios/documentation/us
erexperience/conceptual/MobileHIG/index.html
R.Polillo - Marzo 2015
15
16. Design patterns
Soluzioni generali a problemi di progettazione che si
ripropongono in molte situazioni
Non una soluzione “finita”, ma un modello da adattare
alla specifica situazione
Il concetto è nato in architettura
alla fine degli anni ’70
(Christopher Alexander),
e applicato all’ingegneria del
software dalla fine degli anni ‘80
R.Polillo - Marzo 2015
16
18. Design pattern in architettura
R.Polillo - Marzo 2015
18
“Colloca la scala principale in una
posizione chiave, centrale e
visibile. Tratta l’intera scala come
una stanza (o, se all’esterno,
come un cortile). Disponila in
modo che la scala e la stanza
siano una cosa sola, con la scala
che scende attorno a una o due
pareti della stanza. Allarga il
fondo della scala con finestre
aperte o balaustre, e con ampi
gradini, in modo che le persone
che scendono lungo la scala
diventino parte dell’azione della
stanza mentre sono ancora sulla
scala, e che le persone in basso
usino naturalmente i gradini per
sedersi”.
Da C.Alexander, A Pattern Language
19. I pattern di interazione uomo macchina: esempio
Design pattern per le funzioni di ricerca in un sito web
(van Welie)
Advanced search Search Tips
Autocomplete Site Index
FAQ Site Map
Help Wizard Footer Sitemap
Search Box Tag Cloud
Search Area Topic Pages
Search Results
R.Polillo - Marzo 2015
19
20. Mobile design patterns: esempi
http://www.mobile-patterns.com
http://http://pttrns.com
http://inspired-ui.com (iPhone)
http://www.sitepoint.com/examples-mobile-
design-patterns/
Un libro:
http://www.mobiledesignpatterngallery.com
R.Polillo - Marzo 2015
20
21. Pattern language per l’interazione
21
I formalismi di descrizione sono diversi, ma
normalmente ogni pattern è descritto in una
scheda che fornisce
Il problema di cui si tratta
Il pattern che lo risolve
Le motivazioni
L’ambito/limitazioni di applicazione
Esempi di uso
R.Polillo - Marzo 2015
22. Design pattern: vantaggi
Raccolgono lo stato della pratica
Suggeriscono soluzioni ai progettisti
Formazione di un linguaggio comune
Diffondono gli “standard di fatto”
Evitano di “reinventare la ruota”
R.Polillo - Marzo 2015
22
23. Indicazioni per il design: tipologia
R.Polillo - Marzo 2015
23
coercitività
generalità
standard
regole
di progetto
Linee
guida
princip
i
Design
patterns
bassa
bassa
alta
alta
24. Principi
I “principi morali” sono principi che guidano il
“buon” comportamento umano
Nella progettazione, possiamo definire quei
“principi morali” che dovrebbero guidarci, in
particolare, quando dobbiamo scegliere fra
soluzioni alternative
Sono tanto più validi quanto più la pratica
mostri che derogare da questi principi genera,
prima o poi, delle difficoltà
R.Polillo - Marzo 2015
24
25. ISO 9241-110: I 7 principi del dialogo uomo
macchina
25
1. Adeguatezza al compito
2. Autodescrizione
3. Conformità alle aspettative dell’utente
4. Adeguatezza all’apprendimento
5. Controllabilità
6. Tolleranza verso gli errori
7. Adeguatezza alla personalizzazione
R.Polillo - Marzo 2015
26. 26
1. Adeguatezza al compito
2. Autodescrizione
3. Conformità alle aspettative
dell’utente
4. Adeguatezza all’apprendimento
5. Controllabilità
6. Tolleranza verso gli errori
7. Adeguatezza alla individualizzazione
R.Polillo - Marzo 2015
La funzionalità del
sistema e il dialogo
sono basati sulle
caratteristiche del
compito, piuttosto
che sulla tecnologia
scelta per
effettuarlo
ISO 9241-110: I 7 principi del dialogo uomo
macchina
28. Adeguatezza al compito, in pratica
Nel nostro progetto, abbiamo applicato in pratica
questo principio…
… nell’attenzione “spasmodica” alla corretta
individuazione dei casi d’uso, e alla stesura del
diagramma dei casi d’uso, come base di
partenza per orientare la progettazione; inoltre…
… la definizione di scenari d’uso tipici ci ha
aiutato a perfezionare l’analisi
R.Polillo - Marzo 2015
28
29. Adeguatezza al compito: aspetti chiave
29
Fasi dell’interazione e “navigazione” adeguate
al compito
Informazioni e formati adeguati al compito
Tecniche di interazione adeguate al compito
Dialogo essenziale (no ridondanze non
necessarie per il compito)
Default tipici
R.Polillo - Marzo 2015
Nel nostro
caso, tutto
pensato per
mobiles
Nel nostro
caso, tutto
pensato per
mobiles
30. Dialogo essenziale
Analizzare accuratamente le
ridondanze:
servono?
a che cosa servono?
a chi servono?
ci sono degli svantaggi nella loro
eliminazione?
R.Polillo - Marzo 2015
30
32. I 7 principi del dialogo secondo la ISO 9241-110:2006
32
1. Adeguatezza al compito
2. Autodescrizione
3. Conformità alle aspettative
dell’utente
4. Adeguatezza all’apprendimento
5. Controllabilità
6. Tolleranza verso gli errori
7. Adeguatezza alla
individualizzazione
R.Polillo - Marzo 2015
Agli utenti risulta
evidente, in ogni
momento, in che
contesto e fase
del dialogo si
trovano, quali
azioni possono
compiere e come
queste possono
essere effettuate
33. Autodescrizione, in pratica
Nel nostro progetto, abbiamo applicato questo
principio nell’attenzione “spasmodica” alla
segnalazione del contesto corrente, fin dal primo
prototipo (POP)
Esempi:
Il nome dell’app
I titoli delle varie schermate
Il nome dell’utente loggato
L’oggetto selezionato
Lo stato del sistema (!)
Feedback evidente
Descrizione dell’input atteso
R.Polillo - Marzo 2015
33
Se non
indispensabile, no
ricorso alla
memoria a breve
termine
Se non
indispensabile, no
ricorso alla
memoria a breve
termine