Corso di Interazione Uomo MacchinaAA 2014-2015
Roberto Polillo
Corso di laurea in InformaticaUniversità di Milano BicoccaDipartimento di Informatica, Sistemistica e Comunicazione
INGEGNERIA E CREATIVITÀ
Edizione 2014-15
Mimesi 6
“imitazione”Si costruiscono oggetti virtuali che “riproducono” in ogni dettaglio oggetti reali ampiamente diffusi
R.Polillo - Marzo 2015
Esempio: settaggio di un orologio
15
Da Interface Hall of Shame http://bit.ly/Xlo536
R.Polillo - Marzo 2015
Questo bottone permette di cambiare la scala: l’oggetto imitato viene “potenziato” con funzioni non realizzabili nel modello reale
R.Polillo - Marzo 2015
21
Ibridazione
“Incrociare piante o animali di specie diverse in modo da ottenere ibridi”
R.Polillo - Marzo 2015
24
Esempio:lavagna + proiettore ⇒ lavagna luminosa
calendario + orologio + tab + bottoni
player musicale + menu e form Windows-like
Ibridazione: esempi
R.Polillo - Marzo 2015
25
I/O Brush (MIT)
R.Polillo - Marzo 2015
31 pennello + fotocamerahttp://it.youtube.com/watch?v=04v_v1gnyO8
Google glasses
https://www.youtube.com/watch?v=ErpNpR3XYUw apr 2012
http://www.youtube.com/watch?v=fNATuCkRWFE feb 2013 R.Polillo - Marzo 2015
32
Metafora
dal greco metaphora, trasporto, mutazione
Consiste, in sostanza, nel “mescolare” fra loro campi semantici differenti, trasferendo proprietà e concetti propri di un campo semantico ad un altro
R.Polillo - Marzo 2015
36
donatore
ricevente
Metafora: esempi
sei un fulmine l’ondeggiare delle spighe il ruggire dei motori la gamba del tavolo al timone dello stato
R.Polillo - Marzo 2015
37
Metafora: esempio
È vero, il mondo è tutto un palcoscenicosul quale tutti noi, uomini e donnesiam solo attori, con le nostre uscitee con le nostre entrate; ove ciascuno,per il tempo che gli è stato assegnato,recita molte parti,e gli atti sono le sue sette età….
W. Shakespeare, As you like it
R.Polillo - Marzo 2015
38
Word 95
La icona crea la metafora, e suggerisce immediatamente
la funzione del menu39
R.Polillo - Marzo 2015
Metafora: vantaggi
Suggerisce idee al designer, perché trasferisce un intero “campo semantico” da un contesto all’altro, suggerendo soluzioni inattese
R.Polillo - Marzo 2015
41
Metafora: svantaggi
Può confondere l’utente, perché le inevitabili incongruenze fra i due campi semantici possono generare confusione e sfiducia
NB La metafora non è una similitudine!
R.Polillo - Marzo 2015
44
Una variante: Mutazione58
“Fenomeno per cui in una specie si origina un individuo che presenta alcuni caratteri diversi dai suoi ascendenti, e li trasmette alla discendenza”
R.Polillo - Marzo 2015
Esempio: design generativo59
Progettare un manufatto e affidare al computer il compito di generarne possibili “mutazioni genetiche”
“metadesign” o “design di specie”:definire le caratteristiche essenziali di un manufatto e affidare al computer il compito di generarne possibili “incarnazioni”
R.Polillo - Marzo 2015
Design patterns: che cosa sono
Un design pattern è una soluzione generale a un problema di progettazione che si ripropone in molte situazioni, anche diverse
Non una soluzione “finita”, ma piuttosto un modello, un template 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
67
Design pattern in architettura
R.Polillo - Marzo 2015
69
“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
R.Polillo - Marzo 2015
70
Pattern language per l’interazione71
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
• Problem• Solution• Use when• How• Why• More examples• Implementation• Literature
Schede descrittive: esempi
R.Polillo - Marzo 2015
72
Van Welie
• Problem summary• Example• Usage• Solution• Rationale• [Discussion]• [Sources]• More examples
Toxboe
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
73