Interazione Uomo

Interaction Design
Macchina
1
Sommario lezione
•
•
•
•
Interfacce tradizionali ed evoluzione dell'HCI
Dispositivi di interazione
Considerazioni conclusive
Approfondimento
– Augmented Reality
– Acquisizione 3D
2
Interfaccia computazionale
> Caratteristiche e sviluppo dell’interfaccia tradizionale HCI
> Sviluppo di nuovi modelli/ linguaggi di interfaccia
computazionale: ubiquitous computing, augmented reality,
tangible computing, wearable computing, locative media,
intelligent environments, mobile interfaces
3
Configurazione classica
1981 --> Xerox Star workstation: prima generazione di GUI
(Graphical User Interface), "desktop metaphor”
> 1984 --> Apple Macintosh GUI: nuovo stile di HCI (HumanComputer Interaction)
> Modello dell’interfaccia tradizionale HCI: metafora desktop,
icone, schermo, tastiera, mouse
4
Configurazione classica
Interfaccia tradizionale HCI: processo di “remediation” --> ha
ripreso i linguaggi di diversi media e li ha combinati creando un
prodotto nuovo.
>
> Tale interfaccia ha adottato la metafora del desktop perché i
computers venivano usati principalmente in ufficio e per fini
lavorativi.
> Velocità dello sviluppo tecnologico + sperimentazione nei campi
di arte e ricerca --> rappresentano sia un problema che
un’opportunità per la progettazione di nuove interfacce
5
Evoluzione dell'HCI
> 1991 --> Waiser: introduce l’idea di Ubiquitous Computing:
computazione distribuita, suddivisione tra “foreground” e
“periphery”
> 1993 --> Augmented Reality: sovrapposizione di informazione
digitale/virtuale sull’ambiente circostante/tangibile
> 1996 --> Wearable Computing: computazione nei vestiti, più
vicino al corpo umano
> 1997 --> Tangible Computing (Ishii): computazione negli
oggetti quotidiani, il mondo come interfaccia (TUI vs GUI).
6
Evoluzione dell'HCI
>
Locative
Media
(location-based
informazione distribuita in luoghi specifici
computing):
> Intelligent Environments: computazione integrata
nell’ambiente e distribuita. L’ambiente risponde ai movimenti
e ai bisogni degli utenti
> Interfacce mobile (smart-phone, PDA, iPhone)
7
Ubiquitous Computing (o ubicomp)
• Idea che la computazione diventerà sempre più parte della
nostra quotidianità…, e verrà sempre più incorporata negli
oggetti di vita quotidiana.
• Idea di “calm computing”: il computer non sarà più
qualcosa che prende l’attenzione totale dell’utente (come
cinema e in parte TV), ma un medium che richiede un livello di
attenzione intermittente (più come la radio).
• Interfacce: devono essere progettate in modo distribuito e
reattivo rispetto ai comportamenti degli utenti.
• Equilibrio tra foreground/background (o periphery): serve ad
integrare la computazione con altre attività che l’utente
deve svolge
8
Augmented Reality
• Integrazione dell’informazione digitale/virtuale con quella
presente nell’ambiente fisico/tangibile
• Convergenza, commistione tra reale & virtuale, analogico &
digitale
• Tentativo di rendere l’informazione digitale più immediata e
utile, e l’interazione con i prodotti computazionali più semplice
9
Wearable Computing
• Computazione sempre “a portata di mano”, integrata negli
oggetti di abbigliamento
• Augmented reality è un esempio di wearable computing
• Integrazione con fashion design & arte
• Anche qui: tentativo di creare interfacce più immediate e
semplici da usare ma --> costi notevoli di implementazione +
difficoltà di adattarsi ad una nuova interfaccia
10
Wearable Computing
Esempi:
•
(Ivrea): oggetti che
reagiscono
alla
presenza
di
comunicazioni telefoniche (cellulari) in
prossimità.
Fashion Victims
http://www.miss-tal.com/fashion-victims/
•
Joanna Berzowska: scorpions, vestiti
che hanno una “propria vita”
http://www.xslabs.net/skorpions/
11
Wearable Computing
Esempi:
• WhiSpiral: sciarpa dove si possono registrare
messaggi ed ascoltari, accarezzandola o
muovendola.
Media lab europe
http://web.media.mit.edu/~stefan/hc/projects/whispiral
•
Solar
vintage Fan: ventaglio ad energia solare)
Lost Values
http://www.lostvalues.com
12
Tangible Computing
• Computazione integrata negli oggetti quotidiani - diventano
oggetti “intelligenti”
• I wearable computing rientra nell’idea del tangible computing
• Elementi di ambient media: intorno all’interazione con
l’oggetto computazionale spesso si trovano elementi periferici
(suoni, odori etc) che fanno parte dell’interfaccia stessa
• Richiama in parte l’idea delle “information appliances”
• Interfacciarsi con oggetti conosciuti rappresenta il punto di partenza
per un’interazione con l’elemento computazionale più intuitiva e
naturale
•
Anche se --> diversità ed etereogeneità delle interfacce
13
Tangible Computing
Esempi:
> Music Bottles (Medialab): bottiglie che “contengono ”
musica e vengono utilizzate come strumento di orchestrazione
http://tangible.media.mit.edu/projects/musicbottles/
> Topobo (Medialab): giocattolo componibile
(tipo Lego), dove ogni componente ha una
“memoria cinetica”, ed è capace di riprodurre
movimenti
http://tangible.media.mit.edu/projects/topobo/
14
Locative Media
• Distribuzione dell’informazione digitale nell’ambiente fisico.
L’informazione è resa disponibile in un luogo specifico (es. una
piazza)
• Maggiore rilevanza “materiale” ed immediata dell’informazione
distribuita
• Spesso l’interfaccia è di tipo mobile
• Informazione --> prima generata poi distribuita (per esempio da artisti
e produttori video se si tratta di prodotti
artistici, da industrie se
si tratta di pubblicità, da organi
pubblici per fini di turismo)
• Oppure --> generata dagli utenti
• Modalità di interazione: interfacce mobili, proiezioni su superfici,
connessione WiFi, GPS e Bluetooth, RFID, qrcode, visual markers (es:
dtouch,
http://web.media.mit.edu/~enrico/research/research.php)
15
Locative Media
> Media Portrait of the Liberties (Nisi): progetto sviluppato in una
zona povera, ma ricca di storia, di Dublino. Gli utenti possono scaricare
storie della zona sotto forma di video e nei luoghi dove sono avvenuti
http://www.valentinanisi.com/liberties.html
> 34 North 118 West: progetto sviluppato in centro a Los
Angeles, in cui si può accedere alla storia dello sviluppo
ferroviario
attraverso video e suoni
http://34n118w.net/34N/
http://34n118w.net/
Sono anche esempi di “mixed reality”
16
Intelligent Environment
• Computazione distribuita nell’ambiente, può reagire ai movimenti
degli utenti, o predirre i loro bisogni
• Legato ai concetti di Intelligenza Artificiale e Tangible Computing
• Case intelligenti: gli elettrodomestici si configuarano da soli e si
coordinano per gestire il funzionamento della casa (es:
frigo,
condizionatore, aspirapolvere, televisione etc)
• Utlizzo di sensori: per misurare elementi atmosferici (es
inquinamento), luce, movimento, suono etc.
• Superfici che reagiscono alle azioni degli utenti (es
pavimenti, tavoli etc)
• Utilizzo: funzionale, pubblicità, installazione artistica,
distribuzione di informazioni utili
17
Intelligent Environment
• Esempi:
Interactive floor
•
Eyeclick
(società specializzata)
http://www.eyeclick.com/products_500.html
•
Ada
(ETH Zurigo)
http://www.ini.uzh.ch/~tobi/floor/
Domotica
http://it.wikipedia.org/wiki/Domotica
18
Interfacce mobili
• Nuovo modello di HCI - interfaccia grafica (GUI) ma diversa da
quella dei desktop/laptop
• Schermo più piccolo, grandezza variabile, meno attenzione da parte
dell’utente
• Necessità di tenere in considerazione un raggio più ampio di
interazione: utente-tecnologia-ambiente circostante-persone circostanti
• Difficoltà --> diversi sistemi operativi, scarsa
standardizzazione delle interfacce
•
iPhone: ha introdotto un modello nuovo di interfaccia mobile,
totalmente grafica, touch-screen
19
Dispositivi di Interazione
• Carellata...
– Dispositivi testuali e sistemi di riconoscimento del
testo (anche manoscritti), strumenti touch screen,
light pen, tabletPC, data glove, eyegaze, dispositivi
olografici, HDM, optical see thorough, video-based,
CAVE, work banch, TOF cameras, stereo
cameras, ....
20
Dispositivi testuali
Segue l'ordine della calcolatrice (non confondere con
l'ordine del telefono – es. Aneddoto del bancomat )
21
Telefonino e T9
• In generale ad un numero
corrispondono più lettere
(occorre schiacciare più
volte)
• Con l'algoritmo T9 si digita
comunque una lettera alla
volta e il sistema propone la
sequenza di lettere associata
ad una parola sensata
(riconosciuta da un
vocabolario)
– es.'3736746' → “esempio”
22
OCR
Optical Character Recognition
• Strumento che consente di trasformare una bitmap
in testo
• Fonts differenti possono creare problemi per
algoritmi semplici basati sul template matching
• Esistono sistemi più complessi:
– segmentazione del testo
– scomposizione in linee e archi
– decifrazione dei caratteri
23
• Riconoscimento di caratteri scritti a mano:
– Il testo scritto a mano può essere inserito nel computer,
utilizzando una penna e una digitising tablet.
– Forma comune di interazione
Caratteristiche:
– acquisizione in modo naturale di tutte le informazioni
utili: percorso dello stroke, pressione etc.
– segmentazione dello scritto in singole lettere;
– interpretazione delle lettere;
– trattare con diversi stili di scrittura;
– I dispositivi mobile attuali incorporano la tecnologia di
riconoscimento caratteri, aboliscono l’uso della tastiera.
24
• Riconoscimento del parlato:
– Sistema promettente, che però funziona solo in
particolari situazioni: utente unico, vocabolario
ristretto;
Problemi:
– interferenza del rumore esterno;
– imprecisioni nella pronuncia;
– accenti.
25
Software per riconoscimento e sintesi del
parlato
26
Dispositivi TouchScreen
– dispositivo di puntamento a manipolazione diretta: rileva la
presenza di dita o altro sullo schermo
– Funzionamento:
• matrice di raggi luminosi interrotti
• riflessione di ultrasuoni
– Vantaggi:
• veloce, non richiede un puntatore specifico;
• adatto per selezioni da menu;
• adatto all’uso in ambienti ostili (sporchi…)
– Svantaggi:
•
•
•
•
•
le dita possono sporcare lo schermo;
le dita sono uno strumento di puntamento impreciso;
difficile selezionare regioni piccole o disegnare in modo accurato;
tenere il braccio sollevato può risultare faticoso;
27
occorre tenere lo schermo molto vicino.
Touchscreen
• Surface Microsoft
28
Touchscreen
• Prototipo della Tsinghua University
29
I-Pad
30
Light Pen
– penna connessa via cavo al monitor;
– la penna è trascinata sullo schermo e le sue traiettorie
vengono intercettate durante lo scan del monitor
– Dispositivo di puntamento diretto accurato (può
indirizzare singoli pixels);
– Problemi:
•
•
•
•
la penna può oscurare lo schermo;
fragile;
può essere facilmente persa su un tavolo pieno;
stanca il braccio.
– Meno popolare del mouse.
31
Tavoletta grafica (digitising tablet)
– Dispositivo indiretto ad alta risoluzione, disponibile in
vari formati;
– Sampling rate: tra 50 e 200 Hz;
– Può essere utilizzata per rilevare il movimento relativo
o assoluto;
– Può essere utilizzata per immettere testo, se supportata
da un software per il riconoscimento dei caratteri;
– Richiede molto spazio sul tavolo, può entrare in
contrasto spaziale con la tastiera.
32
Dataglove
– guanto di licra con sensori in fibra ottica: rileva angoli e
posizione 3-D della mano;
– la tecnologia per sfruttare appieno le potenzialità di questa
forma di input non esiste ancora;
– Vantaggi: facile da usare, potenzialmente potente e espressiva
(10 joint angles + informazioni spaziali 3D a 50 Hz);
– Svantaggi: difficile da usare assieme ad una tastiera, costoso;
– Potenziali utilizzi: gesture recognition, interpretazione del
linguaggio dei segni, etc.
33
Dataglove
34
Eyegaze
• rileva movimenti dell’occhio per controllare il cursore: veloce,
accurato ma costoso
35
Eyegaze
• Video:
Interaction with World of Warcraft
http://www.youtube.com/watch?v=NBIjWA8CHls
36
Dispositivi di uscita alternativi
• Visivi:
– rappresentazioni analogiche:
quadranti (dial), indicatori di
misura (gauge), luci etc.;
– head-up display: negli abitacoli
degli aerei;
• Uditivi:
– beep, bongs (campane), clonks
(rumore sordo), whistles (fischi) e
whirrs (ronzii)
• utilizzati come segnalatori di errori o
per confermare azioni (ad esempio la
pressione di un tasto);
– voce: non ancora molto esplorata
37
Display olografici
CRS4 Visual Computing, http://www.crs4.it/vic/
38
Head-Mounted Display (HMD)
• Piccoli display montati sulla testa, completamente
immersivi, hanno bisogno di un tracker per
tracciare la posizione e l’orientazione della testa.
39
Optical see-through
• Combinatori ottici parzialmente trasparenti
sono posti di fronte agli occhi, permettono di
vedere in essi il riflesso di immagini virtuali
rappresentate su piccoli display
40
Video-based
•Fa uso di piccole video-camere per catturare la visione
del mondo reale che sarebbe vista dagli occhi. Le
immagini reali sono combinate con quelle virtuali, create
dal computer, per creare immaginidi AR che vengono
visualizzate su un classico HMD (non see-through).
41
Cave Automatic Virtual Environment
(CAVE)
• Sistemi basati sulla proizione: proiezione diretta o
con retro-proizione, l’utente è completamente
circondato da immagini proiettate su grandi
schermi. Crea un senso di elevata immersione
42
Cave Automatic Virtual Environment
(CAVE)
• http://www.youtube.com/watch?v=-Sf6bJjwSCE
43
CAVE Applications
• architectural walk-through
• evaluation of engineering designs (virtual
prototyping)
• driving simulators
• training for dangerous situations and other
scenarios
• molecular modeling
• virtual reconstruction of archeological sites
• medical and biological visualization
• artistic expression of ideas, and more ...
44
CAVE Applications
45
Blue-c System
Collaborative Virtual Realilty by ETH
46
Workbenches
• Banchi di lavoro: schermi piatti che presentano
immagini in modalita’ stereo. Possono essere
montati anche in orizzontale/inclinati. Immersione
parziale, alto senso di presenza dell’oggetto
47
Range sensors
• I sensori range sono in grado di catturare la profondità
delle immagini
✗
Producono depth map o range image (chiaro=vicino)
48
Depth from Stereo
• Data una coppia di immagini di una stessa scena da
due punti di vista leggermente differenti (destro e
sinistro) si ricava la mappa di disparità che è in
relazione con la profondità della scena
left
right
disparità
49
Depth from Stereo
• Catturando un flusso video per canale è possibile
effettuare l'elaborazione stereo in real-time
Videre
http://www.videredesign.com
disparità
50
Time Of Fly (TOF) Camera
• Le TOF camera catturano le informazioni
tridimensionali lanciando un array di segnali sulla
scena ed applicando il principio del tempo di volo
per calcolare la profondità
51
Considerazioni conclusive
• I progettisti di interfacce assumono di avere a
disposizione processori a velocità infinita, creando
interfacce sempre più complicate;
• Se il processore è troppo lento il sistema non riesce
a rispondere a tutti gli input in tempo:
– overshooting: il sistema ha memorizzato in un buffer le
battiture;
– icon wars: l’utente clicca su una finestra e non succede
niente, allora clicca su un’altra, e quando il sistema
risponde le finestre si attivano ovunque
• Se il processore è troppo veloce:
– documenti e schermate di help che scorrono troppo
veloci per riuscire a leggere
52
Limiti per le prestazioni interattive
• Limiti computazionali (computation bound):
– il tempo perso in attesa di una computazione causa
frustrazione all’utente
• Limiti del canale di memorizzazione (storage
channel bound):
– il trasferimento di dati dal disco rigido alla memoria
può provocare un collo di bottiglia
• Limiti della Grafica (graphics bound):
– il refresh del display può richiedere molto tempo
• Limiti della rete (network capacity):
– l’utilizzo di risorse di rete provoca una riduzione della
performance dell’interfaccia se la rete risulta essere
troppo lenta
53
• L' interfaccia (ie., l’architettura) deve :
–
–
–
–
–
evitare il disorientamento dell'utente;
permettere il controllo del processo;
garantire qualità e comunicabilità dei risultati;
garantire l'evoluzione del sistema;
permettere la gestione integrata di tutte le attività
che richiedono l'utilizzo di un documento;
– adattare l'interfaccia alla crescente abilità
dell'utente.
54
Homework
• ARToolkit
– Scaricare ed installare l'ARToolkit (
http://www.hitl.washington.edu/artoolkit/)
– Studiare la documentazione
– Studiare l'esempio 'simpleTest'
55