20. Principi e linee guida (I)

Corso di Interazione Uomo MacchinaAA 2014-2015

Roberto Polillo

Corso di laurea in InformaticaUniversità di Milano BicoccaDipartimento di Informatica, Sistemistica e Comunicazione

PRINCIPI E LINEE GUIDA (I)

Edizione 2014-15

1

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.

Ρ.Πολιλλο − Μαρζο

20152

Scopo di questa lezione3

Discutere, con esempi, le indicazioni che possono essere fornite al progettista per guidarlo nella progettazione di sistemi usabili.

R.Polillo - Marzo 2015

Quali indicazioni per il design dell’interfaccia utente?


4

coercitività

generalità

principi

bassa

ba

ssa

alta

alta



5

coercitività

generalità

Linee guida

principi

bassa

ba

ssa

alta

alta



6

coercitività

generalità

Linee guida

principi

Design patterns

bassa

ba

ssa

alta

alta



7

coercitività

generalità

regoledi progetto

Linee guida

principi

Design patterns

bassa

ba

ssa

alta

alta



8

coercitività

generalità

standard

regoledi progetto

Linee guida

principi

Design patterns

bassa

ba

ssa

alta

alta

Terminologia

PrincipiPrincipi 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 guidaInsieme 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

StandardsInsieme 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 progettoInsieme di regole da applicare nel progetto di un particolare sistema. Sono vincolanti


9

Indicazioni per il design: autorevolezza

Diversi livelli di autorevolezza:A: Completamente supportate da risultati di ricerca e

dati empiriciB: Basate su pratica generalmente accettata (in modo

documentato)C:Non ben documentate, ma supportate dall’opinione di

professionistiD: Opinione individuale

Standard: solo livelli A e B


10

Indicazioni per il design: tipologia


11

coercitività

generalità

standard

regoledi progetto

Linee guida

principi

Design patterns

bassa

ba

ssa

alta

alta

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


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 ergonomics200 series: Human system interaction processes300 series: Displays and display related hardware400 series: Physical input devices – ergonomics principles500 series: Workplace ergonomics600 series: Environment ergonomics700 series: Application domains - Control rooms900 series: Tactile and haptic interactions


13



14

coercitività

generalità

standard

regoledi progetto

Linee guida

principi

Design patterns

bassa

ba

ssa

alta

alta

User Interface Design Guidelines Android:

http://developer.android.com/guide/topics/ui/index.html iOS:

https://developer.apple.com/library/ios/documentation/userexperience/conceptual/MobileHIG/index.html


15

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


16


17

Design pattern in architettura


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

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 SitemapSearch Box Tag Cloud Search Area Topic Pages Search Results


19

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


20

Pattern language per l’interazione21

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


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”


22



23

coercitività

generalità

standard

regoledi progetto

Linee guida

principi

Design patterns

bassa

bassa

alta

alta

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à


24

ISO 9241-110: I 7 principi del dialogo uomo macchina

25

1. Adeguatezza al compito2. Autodescrizione3. Conformità alle aspettative dell’utente4. Adeguatezza all’apprendimento5. Controllabilità6. Tolleranza verso gli errori7. Adeguatezza alla personalizzazione


26

1. Adeguatezza al compito2. Autodescrizione3. Conformità alle aspettative

dell’utente4. Adeguatezza all’apprendimento5. Controllabilità6. Tolleranza verso gli errori7. Adeguatezza alla individualizzazione


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

Adeguatezza al compito: esempio27


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


28

Adeguatezza al compito: aspetti chiave29

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


Nel nostro caso, tutto

pensato per mobiles

Nel nostro caso, tutto

pensato per mobiles

Dialogo essenziale

Analizzare accuratamente le ridondanze: servono? a che cosa servono?a chi servono? ci sono degli svantaggi nella loro eliminazione?


30

Dialogo essenziale


31

I 7 principi del dialogo secondo la ISO 9241-110:2006

32

1. Adeguatezza al compito2. Autodescrizione3. Conformità alle aspettative

dell’utente4. Adeguatezza all’apprendimento5. Controllabilità6. Tolleranza verso gli errori7. Adeguatezza alla

individualizzazione


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

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’appI titoli delle varie schermateIl nome dell’utente loggatoL’oggetto selezionatoLo stato del sistema (!)Feedback evidenteDescrizione dell’input atteso


33

Se non indispensabile, no ricorso alla memoria a breve termine

Se non indispensabile, no ricorso alla memoria a breve termine

Esempio: guida all’utente34


Guida all’utente: che cosa non fare


35

Pagina web con menu le cui scritte appaiono come roll-over: da evitare!


www.brigaderia.com.br

20. Principi e linee guida (I)

Education

Transcript of 20. Principi e linee guida (I)