Post on 21-Nov-2014
description
Corso di Interazione Uomo MacchinaAA 2013-2014
Roberto Polillo
Corso di laurea in InformaticaUniversità di Milano BicoccaDipartimento di Informatica, Sistemistica e Comunicazione
INGEGNERIA E CREATIVITÀ1
R.Polillo - Marzo 2014 Edizione 2013-14
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.
R.Polillo - Marzo 20142
Scopo di questa lezione3
Presentare alcune tecniche che possono stimolare la creatività nel design di nuovi manufatti.
R.Polillo - Marzo 2014
Come “inventiamo” nuovi prodotti?4
R.Polillo - Marzo 2014
Alcune “tecniche”5
Mimesi Ibridazione Metafora Variazione Composizione
R.Polillo - Marzo 2014
Mimesi 6
“imitazione”Si costruiscono oggetti virtuali che “riproducono” in ogni dettaglio oggetti reali ampiamente diffusi
R.Polillo - Marzo 2014
Mimesi: esempi
Riproduzione precisa di uno
specifico modello dell’HP!
7 R.Polillo - Marzo 2014
8 R.Polillo - Marzo 2014
Chi et al., CHI 2005
9
R.Polillo - Marzo 2014
Wine app per iPad
R.Polillo - Marzo 2014
10
Inside Photo Album per iPad
R.Polillo - Marzo 2014
11
La libreria di iPad
R.Polillo - Marzo 2014
12
Dj Mixer (app per iPad)
R.Polillo - Marzo 2014
13
Orologio per iPad
R.Polillo - Marzo 2014
14
Esempio: settaggio di un orologio
15
Da Interface Hall of Shame http://bit.ly/Xlo536 R.Polillo - Marzo 2014
Set time su iPhone
R.Polillo - Marzo 2014
16
GarageBand (iPad)
R.Polillo - Marzo 2014
17
GarageBand (per iPad)
R.Polillo - Marzo 2014
18
GarageBand (per iPad)
R.Polillo - Marzo 2014
19
Questo bottone permette di cambiare la scala: l’oggetto imitato viene “potenziato” con funzioni non realizzabili nel modello reale
R.Polillo - Marzo 2014
21
IBM Smart Phone
1. Comporre il numero
2. Cliccare la cornetta (sic!)22
R.Polillo - Marzo 2014
Da: IBM, Aptiva Communication Center R.Polillo - Marzo 2014
23
Ibridazione“Incrociare piante o animali di specie diverse in modo da ottenere ibridi”
R.Polillo - Marzo 2014
24
Esempio:lavagna + proiettore lavagna
luminosa
calendario + orologio + tab + bottoni
player musicale + menu e form Windows-like
Ibridazione: esempi
R.Polillo - Marzo 2014
25
dj3
R.Polillo - Marzo 2014
27
Esempio
Wireless Notebook Presenter Mouse 8000, di Microsoft (2006)
28
R.Polillo - Marzo 2014
Pocket Guitar (2009):chitarra + iPhone
29
R.Polillo - Marzo 2014
Cameraphone Samsung
I/O Brush (MIT)
R.Polillo - Marzo 2014
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
Mac OS X
dialogue box + vetro =
dialogue box trasparente
R.Polillo - Marzo 201434
Metaforadal 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 2014
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 2014
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 2014
38
Word 95
La icona crea la metafora, e suggerisce immediatamente
la funzione del menu39
R.Polillo - Marzo 2014
La metafora della scrivania (Macintosh, 1984)
R.Polillo - Marzo 2014
40
Metafora: vantaggiSuggerisce idee al designer, perché trasferisce un intero “campo semantico” da un contesto all’altro, suggerendo soluzioni inattese
R.Polillo - Marzo 2014
41
Esempio: la "gamba del tavolo"
R.Polillo - Marzo 2014
42
Esempio: "metti un tigre nel motore"
R.Polillo - Marzo 2014
43
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 2014
44
R.Polillo - Marzo 2014
45
46 R.Polillo - Marzo 2014
Una tastiera che pensa?
47 R.Polillo - Marzo 2014
Il design delle icone
R.Polillo - Marzo 2014
48
Mac OS X
Windows
? ? ? ? ?
49
R.Polillo - Marzo 2014
Variazione
R.Polillo - Marzo 2014
50
Variazione: esempi51
R.Polillo - Marzo 2014
Paint per Windows 95 (Microsoft, 1995)R.Polillo - Marzo 2014
52
WINDOWS 1.0
53
R.Polillo - Marzo 2014
WINDOWS 2.0
54
R.Polillo - Marzo 2014
WINDOWS 3.1
55
R.Polillo - Marzo 2014
WINDOWS 95
56
R.Polillo - Marzo 2014
Una variante: Mutazione57
“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 2014
Esempio: design generativo58
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 2014
soddu2.dst.polimi.it59 R.Polillo - Marzo 2014
60 R.Polillo - Marzo 2014
61
R.Polillo - Marzo 2014
Basilica, C.Soddu, 199862 R.Polillo - Marzo 2014
COMPOSIZIONE
Design pattern
Composizione65
R.Polillo - Marzo 2014
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 2014
66
67
R.Polillo - Marzo 2014
Design pattern in architettura
R.Polillo - Marzo 2014
68
“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 2014
69
Pattern language per l’interazione70
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 2014
• Problem• Solution• Use when• How• Why• More examples• Implementation• Literature
Schede descrittive: esempi
R.Polillo - Marzo 2014
71
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 2014
72
Creazione73
Ma esiste veramente la creazione dal nulla?
R.Polillo - Marzo 2014
“Per inventare, serve una buona immaginazione e un mucchio di cianfrusaglie”
Thomas Alva Edison
R.Polillo - Marzo 2014
74