Download - 7. Ingegneria e creativita
![Page 1: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/1.jpg)
Corso di Interazione Uomo MacchinaAA 2010-2011
Roberto Polillo
Corso di laurea in InformaticaUniversità di Milano BicoccaDipartimento di Informatica, Sistemistica e Comunicazione
INGEGNERIA E CREATIVITÀ1
Edizione 2
010-11
R.Polillo - Ottobre 2010
![Page 2: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/2.jpg)
Come “inventiamo” nuovi prodotti?3
R.Polillo - Ottobre 2010
![Page 3: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/3.jpg)
Alcune “tecniche”4
Mimesi Ibridazione Metafora Variazione Composizione
R.Polillo - Ottobre 2010
![Page 4: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/4.jpg)
Mimesi 5
“Imitazione”Si costruiscono oggetti virtuali che “riproducono” in ogni dettaglio oggetti reali ampiamente diffusi
R.Polillo - Ottobre 2010
![Page 5: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/5.jpg)
Mimesi: esempi
Riproduzione precisa di uno
specifico modello dell’HP!6 R.Polillo - Ottobre 2010
![Page 6: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/6.jpg)
7 R.Polillo - Ottobre 2010
![Page 7: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/7.jpg)
Chi et al., CHI 2005
8
R.Polillo - Ottobre 2010
![Page 8: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/8.jpg)
Questo bottone permette di cambiare la scala: l’oggetto imitato viene “potenziato” con funzioni non realizzabili nel modello reale
R.Polillo - Ottobre 2010
9
![Page 9: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/9.jpg)
IBM Smart Phone
1. Comporre il numero
2. Cliccare la cornetta (sic!)10
R.Polillo - Ottobre 2010
![Page 10: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/10.jpg)
Da: IBM, Aptiva Communication Center
R.Polillo - Ottobre 2010
11
![Page 11: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/11.jpg)
Ibridazione
“Incrociare piante o animali di specie diverse in modo da ottenere ibridi”
Esempio:lavagna + proiettore lavagna luminosa
R.Polillo - Ottobre 2010
12
![Page 12: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/12.jpg)
Esempio
Wireless Notebook Presenter Mouse 8000, di Microsoft (2006)
13
R.Polillo - Ottobre 2010
![Page 13: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/13.jpg)
calendario + orologio + tab + bottoni
player musicale + menu e form Windows-like
Ibridazione: esempi
R.Polillo - Ottobre 2010
14
![Page 14: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/14.jpg)
I/O Brush (MIT)
R.Polillo - Ottobre 2010
15 pennello + fotocamera
http://it.youtube.com/watch?v=04v_v1gnyO8
![Page 15: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/15.jpg)
Pocket Guitar (2009):chitarra + iPhone
16
R.Polillo - Ottobre 2010
![Page 17: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/17.jpg)
dj3
R.Polillo - Ottobre 2010
18
![Page 18: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/18.jpg)
Mac OS X
dialogue box + vetro =
dialogue box trasparente
R.Polillo - Ottobre 201019
![Page 19: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/19.jpg)
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 - Ottobre 2010
20
donatore
ricevente
![Page 20: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/20.jpg)
Metafora: esempi
sei un fulmine l’ondeggiare delle spighe il ruggire dei motori la gamba del tavolo al timone dello stato
R.Polillo - Ottobre 2010
21
![Page 21: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/21.jpg)
Metafora: esempio
È vero, il mondo è tutto un palcoscenico
sul quale tutti noi, uomini e donne
siam solo attori, con le nostre uscite
e 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 - Ottobre 2010
22
![Page 22: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/22.jpg)
Word 95
La icona crea la metafora, e suggerisce immediatamente
la funzione del menu23
R.Polillo - Ottobre 2010
![Page 23: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/23.jpg)
La metafora della scrivania (Macintosh, 1984)
R.Polillo - Ottobre 2010
24
![Page 25: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/25.jpg)
Metafora: vantaggi
Suggerisce idee al designer, perché trasferisce un intero “campo semantico” da un contesto all’altro, suggerendo soluzioni inattese
Esempi:
la gamba del tavolo e se mettessimo una giarrettiera a una gamba del tavolo? Oppure se gli mettessimo delle scarpe?
il ruggire del motore “metti un tigre nel motore”
R.Polillo - Ottobre 2010
26
![Page 26: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/26.jpg)
Metafora: svantaggi
Può confondere l’utente, perché le inevitabili incongruenze fra i due campi semnatici possono generare confusione e sfiducia
NB La metafora non è una similitudine!
R.Polillo - Ottobre 2010
27
![Page 27: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/27.jpg)
R.Polillo - Ottobre 2010
28
![Page 28: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/28.jpg)
29 R.Polillo - Ottobre 2010
![Page 29: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/29.jpg)
Una tastiera che pensa?
30 R.Polillo - Ottobre 2010
![Page 30: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/30.jpg)
Il design delle icone
R.Polillo - Ottobre 2010
31
Mac OS X
Windows
? ? ? ? ?
![Page 31: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/31.jpg)
32
R.Polillo - Ottobre 2010
![Page 32: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/32.jpg)
Variazione
R.Polillo - Ottobre 2010
34
![Page 33: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/33.jpg)
Variazione: esempi35
R.Polillo - Ottobre 2010
![Page 34: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/34.jpg)
Paint per Windows 95 (Microsoft, 1995)
R.Polillo - Ottobre 201036
![Page 35: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/35.jpg)
WINDOWS 1.0
37
R.Polillo - Ottobre 2010
![Page 36: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/36.jpg)
WINDOWS 2.0
38
R.Polillo - Ottobre 2010
![Page 37: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/37.jpg)
WINDOWS 3.1
39
R.Polillo - Ottobre 2010
![Page 38: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/38.jpg)
WINDOWS 95
40
R.Polillo - Ottobre 2010
![Page 39: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/39.jpg)
Il ciclo compito-manufatto41
Bisogno
Manufatto
“Non appena viene introdotto un nuovo manufatto, inizia una
co-evoluzione dell’artefatto e di chi lo usa”
D.C.Engelbart
R.Polillo - Ottobre 2010
![Page 40: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/40.jpg)
Esempio: evoluzione del martello42
R.Polillo - Ottobre 2010
![Page 41: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/41.jpg)
Esempio: “paper clip”
R.Polillo - Ottobre 2010
43
1898 1900
graffia il foglio
non graffia il foglio, ma può scivolare via
![Page 42: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/42.jpg)
1921 1934
non scivola via
44
R.Polillo - Ottobre 2010
![Page 43: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/43.jpg)
R.Polillo - Ottobre 201045
![Page 44: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/44.jpg)
La evoluzione del software46
Per la sua “immateriale”, il software, è il manufatto evolutivo per eccellenza:
- non esistono limitazioni “materiali” alle sue modifiche
- le sue modifiche non richiedono modifiche di impianti produttivi
- la versione modificata può essere distribuita immediatamente e ovunque, a costo praticamente nullo (via Internet)
- concetto di perpetual beta
R.Polillo - Ottobre 2010
![Page 45: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/45.jpg)
Una variante: Mutazione47
“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 - Ottobre 2010
![Page 46: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/46.jpg)
Esempio: design generativo48
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 - Ottobre 2010
![Page 47: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/47.jpg)
soddu2.dst.polimi.it49 R.Polillo - Ottobre 2010
![Page 48: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/48.jpg)
50 R.Polillo - Ottobre 2010
![Page 49: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/49.jpg)
51
R.Polillo - Ottobre 2010
![Page 50: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/50.jpg)
Basilica, C.Soddu, 199852 R.Polillo - Ottobre 2010
![Page 51: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/51.jpg)
COMPOSIZIONE
Design pattern
Composizione55
R.Polillo - Ottobre 2010
![Page 52: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/52.jpg)
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 - Ottobre 2010
56
![Page 53: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/53.jpg)
57
R.Polillo - Ottobre 2010
![Page 54: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/54.jpg)
Design pattern in architettura
R.Polillo - Ottobre 2010
58
“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
![Page 55: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/55.jpg)
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 - Ottobre 2010
59
![Page 56: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/56.jpg)
Pattern language per l’interazione60
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 - Ottobre 2010
![Page 57: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/57.jpg)
• Problem• Solution• Use when• How• Why• More examples• Implementation• Literature
• Problem summary• Example• Usage• Solution• Rationale• [Discussion]• [Sources]• More examples
Schede descrittive: esempi
R.Polillo - Ottobre 2010
61
Van Welie Toxboe
![Page 58: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/58.jpg)
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 - Ottobre 2010
62
![Page 59: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/59.jpg)
Creazione63
Ma esiste veramente la creazione dal nulla?
R.Polillo - Ottobre 2010
![Page 60: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/60.jpg)
“Per inventare, serve una buona immaginazione e un mucchio di cianfrusaglie”
Thomas Alva Edison
R.Polillo - Ottobre 2010
64
![Page 61: 7. Ingegneria e creativita](https://reader037.vdocuments.mx/reader037/viewer/2022110114/546efba5af7959330b8b4655/html5/thumbnails/61.jpg)
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.
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.