Date post: | 01-May-2015 |
Category: |
Documents |
Upload: | gianpiero-corradini |
View: | 219 times |
Download: | 0 times |
1
Interazione Uomo-Macchina
Introduzione al corsoa.a. 2006/2007
2
Termini dell’HCI
• Utente– Un individuo, un gruppo di persone che lavorano
insieme.
• Elaboratore– Ogni tecnologia informatica, dal piccolo PDA
(Personal Digital Assistant) al computer da scrivania, ad un sistema su larga scala, ad un sistema embedded --> ubiquità del computer
• Interazione– Ogni comunicazione tra utente e computer,
diretta o indiretta. – In ogni caso esiste un fine dell’interazione.
3
computerSistemi SW
Algoritmi
Dispositivi I/O
User Interface (UI)
Interfaccia
• Vista dal progettista– la funzionalità dell’applicazione è separata dal UI– UI è spesso vista come un aggiunta
• Vista dall’utente– non distingue tra UI e applicazione sottostante– se la UI è ben progettata e usabile, l’intera applicazione
appare usabile
utente
Documentazione
Training
Ambiente socialee lavorativo
4
Interfaccia (cont.)
• Una UI include tutti gli aspetti di progetto di un sistema che influenzano l’interazione tra il sistema stesso e l’utente.
• In particolare:– la corrispondenza con i compiti dell’utente– la metafora usata (eg., desktop)– i controlli e comportamenti– navigazione entro una schermata e flusso tra schermate– integrazione tra differenti applicazioni– il progetto visuale delle schermate– il progetto di interazioni audio non verbali
5
Obiettivi della IUM
• Migliorare l’interazione tra utenti e computer rendendo I computer più user-friendly e maggiormente ricettivi alle necessità dell’utente.
• Progettare sistemi che minimizzino la barriera tra il modello cognitivo umano di ciò che egli vuole compiere e la “comprensione” del calcolatore del compito dell’utente.
• Specificatamente, la IUM si occupa di:– Metodologie e processi per il progetto di interfaccie– Metodi per l’implementazione di interfaccie– Tecniche per la valutazione ed il confronto di interfaccie– Sviluppo di nuove interfaccie e metodi di interazione– Sviluppo di modelli e teorie dell’interazione che siano descrittivi e
predittivi.
6
Con il termine ‘sicurezza’ si intende che il sistema IUM:
1. Fa quello per cui e’ stato progettato2. Impedisce gravi errori3. Fornisce le funzionalita’ adatte ai compiti
dell’utente
7
Usabilità
• Efficacia– il sistema fa quello per cui è stato progettato?
• Efficienza– Il sistema supporta la produttività aiutando l’utente a
portare a termine il suo comoito?
• Sicurezza – il sistema impedisce gravi errori? aiuta a porvi rimedio?
• Utilità– Il sistema fornisce le funzionalità adatte ai compiti
dell’utente?
• Facilità di apprendimento– Quanto è facile imparare ad usare il sistema?
• Facilità di ricordo– Quanto è facile ricordarne le modalità di uso
8
Con il termine ‘sicurezza’ si intende che il sistema IUM:
1. Fa quello per cui e’ stato progettato2. Impedisce gravi errori3. Fornisce le funzionalita’ adatte ai compiti
dell’utente
9
La UI richiede:
1. Dal 40% al 90% del codice totale di un’applicazione
2. Meno del 10% del codice totale di un’applicazione
3. Quasi il 100% del codice totale di un’applicazione
10
• Una UI richiede dal 40% al 90% del codice totale, in media 70%
• Se fatta male deve essere completamente rifatta, altrimenti il costo passa agli utenti
• Una GUI richiede almeno il 29% del budget di progetto di sviluppo SW
11
La UI richiede:
1. Dal 40% al 90% del codice totale di un’applicazione
2. Meno del 10% del codice totale di un’applicazione
3. Quasi il 100% del codice totale di un’applicazione
12
Caratteristiche di una buona UI
• L’interfaccia utente– deve suggerire all’utente quali operazioni esso possa
compiere sulla UI (affordance);– deve rendere ovvia la relazione tra l’azione del sistema e
l’azione svolta dall’utente (mapping);– deve fornire una retroazione all’azione dell’utente
(feedback);– fornisce un buon modello concettuale del comportamento
del sistema sottostante;– fornisce delle funzioni vincolanti (per prevenire errori
dell’utente);– supporta l’addestramento automatico;– …
13
L’umano
• La psicologia cognitiva studia i processi cognitivi umani
• processi di acquisizione, organizzazione, elaborazione ed uso delle conoscenze
• Processi mentali che mediano tra stimoli e risposta• es. soluzione di problemi, memoria, linguaggio• Modello della mente umana come elaboratore di
informazioni che giungono dagli organi sensoriali
14
In un’onda la frequenza indica:
1. La velocita’ di propagazione2. Il numero di oscillazioni al second3. L’escursione massima dell’ampiezza
15
• Registro il livello dell’acqua in un punto dello stagno (p.es. su un palo): oscilla
• Periodo: T = tempo per ritornare allo stesso livello• Ampiezza: massima escursione• Frequenza: f =1/T (quante oscillazioni al secondo)• Lunghezza d’onda: = T· velocità di propagazione
Periodo
Grandezzafisica
Ampiezza
Tempo
16
In un’onda la frequenza indica:
1. La velocita’ di propagazione2. Il numero di oscillazioni al secondo3. L’escursione massima dell’ampiezza
17
La visione
• Due fasi del processo:
– ricezione fisica dello stimolo
– elaborazione ed interpretazione dello stimolo (percezione visiva)
18
Il ricettore fisico: l’occhio
• Riceve luce e la trasforma in segnale elettrico
• La luce viene riflessa dagli oggetti, che vengono rappresentati rovesciati sulla retina
19
L’acutezza visiva e’:
1. La capacita’ di distinguere il colore2. La lunghezza del cristallino3. L’abilita’ di percepire dettagli fini
20
Percezione visiva
• Percezione delle dimensioni e della profondità– l’angolo visuale indica lo spazio occupato da un
oggetto rispetto al campo di vista (è relativo alla dimensione e distanza dall’occhio)
– l’acutezza visiva è l’abilità di percepire i dettagli fini
21
L’acutezza visiva e’:
1. La capacita’ di distinguere il colore2. La lunghezza del cristallino3. L’abilita’ di percepire dettagli fini
22
Percezione visiva (cont.)
• Percezione della brillantezza– la brillantezza è la reazione soggettiva alla luminanza
(quantità di luce emessa da un oggetto)– il contrasto è il rapporto tra la luminanza dell’oggetto e
quella dello sfondo
– l’acutezza visiva cresce con la luminanza
23
Nella percezione visiva la gradazione e’:
1. La lunghezza dell’onda2. La quantita’ di bianco contenuta in un
colore3. Un sinonimo di acutezza visiva
24
Percezione visiva (cont.)
• Percezione del colore
– Gradazione: lunghezza d’onda
– Saturazione: quantita’ di bianco
– Intensità: brillantezza
25
Nella percezione visiva la gradazione e’:
1. La lunghezza dell’onda2. La quantita’ di bianco contenuta in un
colore3. Un sinonimo di acutezza visiva
26
Quale tra queste affermazioni e’ corretta:
1. La procedura di lettura e’ sequenziale2. La procedura di lettura non e’ sequenziale3. La procedura di lettura e’ sequenziale o
non e’ sequenziale a seconda dell’individuo
27
Lettura
• Diverse fasi– Viene percepito il pattern visivo– Viene decodificato usando la rappresentazione interne del
linguaggio– Le parole sono interpretate usando la conoscenza
sintattica, semantica e pragmatica.
• La lettura comporta i cosiddetti fenomeni saccadici e di fissazione: la percezione avviene durante la fissazione (94% del tempo)
• La lettura non è sequenziale (l’occhio si muove avanti e indietro)
28
Quale tra queste affermazioni e’ corretta:
1. La procedura di lettura e’ sequenziale2. La procedura di lettura non e’ sequenziale3. La procedura di lettura e’ sequenziale o
non e’ sequenziale a seconda dell’individuo
29
Quale fra queste affermazioni e’ corretta:
1. I caratteri maiuscoli accelerano la lettura2. I caratteri maiuscoli rallentano la lettura3. La velocita’ di lettura e’ indipendente dal
tipo di carattere utilizzato
30
• Velocità di lettura di 250 parole al minuto: le parole non vengono scandite carattere per carattere.
• Le parole familiari vengono riconosciute dalla forma
• Il maiuscolo non ha forma, e costringe a scandire i singoli caratteri (rallenta)
• Massima velocità (sperimantale) con – font da 9 a 12– lunghezza riga tra 58 e 132 mm.
• La visualizzazione in negativo (nero su bianco) migliora la lettura (maggior acuità)
31
Quale fra queste affermazioni e’ corretta:
1. I caratteri maiuscoli accelerano la lettura2. I caratteri maiuscoli rallentano la lettura3. La velocita’ di lettura e’ indipendente dal
tipo di carattere utilizzato
32
Udito
• Fornisce informazione sull’ambiente: – distanze, direzioni, oggetti, etc.
• Il soggetto della percezione uditiva sono le sorgenti primarie (che emettono il suono)
• Il soggetto della percezione visiva sono le sorgenti secondarie (gli oggetti che riflettono la luce)
• Canale di input che non richiede attenzione, da sfruttare nelle interfaccie
33
L’essere umano puo’ udire frequenze
1. Inferiori al millesimo di Hertz2. Superiori al milione di Hertz3. Tra i 20 Hz e i 15 kHz
34
• L’essere umano può sentire frequenze dai 20 Hz ai 15 KHz
• Distingue meno accuratamente le alte frequenze rispetto alle basse
• Il sistema uditivo filtra i suoni:– Il rumore di fondo viene eliminato
consentendoci di udire suoni familiari senza prestare attenzione
– Esempio: cocktail party effect
35
L’essere umano puo’ udire frequenze
1. Inferiori al millesimo di Hertz2. Superiori al milione di Hertz3. Tra i 20 Hz e i 15 kHz
36
Percezione aptica
• Fornisce importanti feedback circa l’ambiente.
• Aptica = tatto + cinestetica
• Tatto: gli stimoli sono ricevuti mediante recettori nervosi della pelle:– Termorecettori: sensibili alla temperatura– Nocirecettori: sensibili al dolore– Meccanorecettori: sensibili alla pressione
• Può essere un senso basilare per chi è disabile visivamente
37
La memoria a breve termine e’:
1. Immediatamente legata alla percezione sensoriale
2. Conseguenza di una lunga fase di ripetizione
3. Conseguenza di una breve fase di attenzione
38
Memorie sensoriali - iconica- ecoica- aptica
Memoria a breve termine
STM
Memoria a lungo termine
LTM
attenzione ripetizione (rehearsal)
La memoria
• Distinguiamo 3 tipi di memoria– Sensoriale– Breve termine– Lungo termine
• Sono collegati con un modello a cascata
39
Buffer sensoriali- memoria iconica-memoria ecoica-memoria aptica
Memoria a breve termine
STM
Memoria a lungo termine
LTM
attenzione ripetizione (rehearsal)
Memorie sensoriali
• Memorie tampone che registrano temporaneamente gli stimoli sensoriali:– iconica: stimolo visivo – ecoica: stimolo uditivo– aptica: stimolo aptico
• L’informazione passa dal livello sensoriale alla STM mediante l’attenzione
• Se l’informazione non passa nella STM viene rapidamente sovrascritta e persa (2s audio, 0.3 video)
40
Memoria a breve termine (STM)
• Registrazione temporanea dell’informazione che è oggetto della elaborazione in corso (memoria di lavoro).
• Es: per comprendere una frase bisogna tenerla a mente tutta dall’inizio.– accesso rapido: 70 ms– decadimento rapido: 200 ms– capacità limitata: 72 “pezzi” (chunks) di
informazione
41
La memoria a breve termine e’:
1. Immediatamente legata alla percezione sensoriale
2. Conseguenza di una lunga fase di ripetizione
3. Conseguenza di una breve fase di attenzione
42
La memoria a lungo termine ha
1. Decadimento immediato2. Decadimento lento o nullo3. Lo stesso decadimento della memoria
sensoriale
43
Memoria a lungo termine (LTM)
• Area di archivio di tutta la conoscenza (ciò che sappiamo)– accesso lento: 0,1 s– decadimento lento o nullo– enorme e illimitata capacità– puo’ essere dichiarativa o procedurale
• Esistono 2 tip di LTM dichiarativa:– episodica: memoria di eventi ed esperienze in forma seriale– semantica: memoria strutturata di fatti, concetti, e capacità.
• L’informazione nella memoria semantica deriva da quella episodica– si imparano fatti o concetti dalle esperienze
44
La memoria a lungo termine ha
1. Decadimento immediato2. Decadimento lento o nullo3. Lo stesso decadimento della memoria
sensoriale
45
Buffer sensoriali- memoria iconica-memoria ecoica-memoria aptica
Memoria a breve termine
STM
Memoria a lungo termine
LTM
attenzione ripetizione (rehearsal)
LTM: Memorizzare
• L’informazione si muove dalla memoria STM alla LTM per rehearsal (ripetizione, studio).
• Ipotesi di tempo totale: la quantità di informazione memorizzata è proporzionale al tempo di ripetizione: (più si studia, più si ricorda)
• Distribution of practice effect: a parità di tempo totale, si hanno migliori risultati distribuendo nel tempo
46
LTM: Dimenticare
• Decadimento– l’informazione viene persa gradualmente ma lentamente
• Interferenza– la nuova informazione rimpiazza la vecchia: interferenza
retroattiva– Informazione vecchia può interferire con la nuova:
inibizione proattiva (Es., tornare vs casa vecchia invece della nuova)
• Parole legate ad emozioni si ricordano meglio • È possibile dimenticare?
– il dato è stato rimosso…– …oppure è solo molto difficile recuperarlo?
47
LTM: Recuperare
• Ricordo– l’informazione viene “ripescata dalla memoria”.– il processo può essere agevolato da indizi.
• Riconoscimento– la presentazione di un’informazione provoca la
consapevolezza che tale informazione è stata già vista. – Meno complesso del: l’informazione presentata è un
indizio.
• Indizi per aiutare il ricordo– Uso di categorie– Visualizzazione
48
Ragionamento
• Processo con cui si usa la conoscenza di cui si dispone per trarre conclusioni o dedurre qualcosa di nuovo sul dominio di interesse
• Tre tipi:
– Deduttivo
– Induttivo
– Abduttivo
49
Quale di queste affermazioni e’ falsa:
1. Il ragionamento deduttivo generalizza da casi visti a casi non visti
2. Il ragionamento induttivo generalizza da casi visti a casi non visti
3. Il ragionamento abduttivo permette di risalire dagli eventi alle cause
50
Ragionamento deduttivo
• Le conclusioni sono logicamente derivate dalle premesse date.
• Esempio: • Se è venerdì, egli andrà a lavorare• È venerdì • Quindi: egli andrà a lavorare
• La deduzione umana è fallace, perchè usa anche la conoscenza del mondo (scorciatoie)
• Esempio:• Alcune persone sono bambini• Alcuni bambini piangono• Quindi: alcune persone piangono
51
Ragionamento induttivo
• Generalizza da casi visti a casi non visti. – Esempio: tutti gli elefanti che ho visto hanno la
proboscide, quindi tutti gli elefanti hanno la proboscide
• Si può solo falsificare, ma mai provare vera.• Comunque utile nel mondo reale, per
sapere cosa aspettarsi.• L’essere umano usa meglio l’evidenza
positiva che l’evidenza negativa – Esempio, carte di Wason
52
Ragionamento abduttivo
• Risalire dagli eventi alle cause– Esempio: Marco guida veloce quando ha bevuto– Se vedo Marco guidare veloce, assumo che
abbia bevuto
• Non affidabile: può portare a false spiegazioni
53
Quale di queste affermazioni e’ falsa:
1. Il ragionamento deduttivo generalizza da casi visti a casi non visti
2. Il ragionamento induttivo generalizza da casi visti a casi non visti
3. Il ragionamento abduttivo permette di risalire dagli eventi alle cause
54
Errori
• Svista (errore non intenzionale)– Intenzione corretta, ma fallisco nel metterla in atto– Cause: scarsa abilità fisica, disattenzione …– Cambiamenti di contesto nel comportamento esperto
possono causare errori
• Sbaglio (errore)– Intenzione sbagliata– Causa: comprensione incorretta del sistema o della
situazione• l’uomo crea modelli mentali per spiegare il comportamento
delle cose, se il modello è sbagliato, accadono errori (es. pensavo che l’interuttore accendesse la luce invece era il campanello)
• Non è sempre colpa dell’uomo: il progettista deve tenere presente le convenzioni ed i modelli mentali comuni.
55
• Descriveremo il sistema computer composto da vari elementi.
• Il modello di macchina a cui si fa riferimento è l’architettura Von Neumann.
• Ognuno di questi elementi influisce nell’interazione:– input devices: inserimento del testo e puntamento;– output devices: schermo (video), audio;– input e output cartaceo (stampa e scanner);– memoria: RAM e memorizzazione permanente;– elaborazione: velocità, reti.
Il computer
56
Toccare, sentire, annusare
• Dispositivi aptici– vibrazione, ritorno di forza– Nei giochi – Nella simulazione (chirurgica)
• Odore e gusto– Tecnologia molto limitata allo stato attuale
57
La Random Access Memory (RAM) e’:
1. La memoria a lungo termine di un computer
2. La memoria a breve termine umana3. La memoria a breve termine di un
computer
58
Memoria a breve termine
• RAM (Random Access Memory):– memorie volatili (perdono l’informazione quando
il computer viene spento); – tempo di accesso: 5-70 ns; – transfer rate tipico: 1000 MB/s (a 133 MHz)– alcune RAM non volatili sono utilizzate per
memorizzare informazioni di impostazione– tipicamente un computer ha da 64 MB di RAM in
su (tip. 256 MB);
59
Memoria a lungo termine
• Dischi (non volatile):– supporto magnetico: – floppy disks (1.4 MB), – hard disks:
• tempo di accesso ~ 8ms, • transfer rate ~ 100MB/sec.
– supporto ottico: • letture e scritture con laser; • CD-ROM, CD-RW (~ 600BG)• DVD
60
La Random Access Memory (RAM) e’:
1. La memoria a lungo termine di un computer
2. La memoria a breve termine umana3. La memoria a breve termine di un
computer
61
Sommario
• Modelli dell’interazione– modello di Norman– modello di Abowd e Beale
• Stili di interazione• Modelli concettuali• Paradigmi
62
Il modello di Abowd e Beale e’ costituito da
1. Due componenti: l’utente e il sistema2. Tre componenti: l’utente, il sistema e il
progettista3. Quattro componenti: l’utente, il sistema,
l’input e l’output
63
Modello di Norman
• In questo modello l’attenzione è incentrata maggiormente sulla visione che l’utente ha della interazione.
• È basato su di un ciclo di esecuzione/valutazione
64
Score
Utask
Ooutput
Iinput
Modello di Abowd e Beale
• Interaction Framework • 4 componenti:
– Utente (U)– Sistema (S)– Input (I)– Output (O)
• Ogni componente ha il suo linguaggio– Interazione: traduzione tra linguaggi– Problemi di interazione = problemi di traduzione
65
Il modello di Abowd e Beale e’ costituito da
1. Due componenti: l’utente e il sistema2. Tre componenti: l’utente, il sistema e il
progettista3. Quattro componenti: l’utente, il sistema,
l’input e l’output
66
Modelli concettuali di interazione
Basati sull’attivitàBasati sull’oggetto
Metafore
67
• Modello concettuale– Descrizione del sistema in termini di idee e
concetti integrati sul suo funzionamento, comportamento e modo di presentarsi
– L’elenco dei modelli non è esaustivo, nè i modelli sono tra loro mutuamente esclusivi
68
La manipolazione diretta e’
1. L’ analogo del modelli di Norman2. L’analogo del modello di Abowd e Beale3. Un modello concettuale basato
sull’attivita’ che descrive la manipolazione di oggetti virtuali
69
Modelli basati sull’attività
• Fornire istruzioni (comandi)– Utente fornisce istruzioni al sistema su cosa fare– Es. Videoregistratore, HiFi, computer Unix o DOS
• Conversare– Il sistema si comporta come un interlocutore di una
conversazione– Es. Sistemi di prenotazione telefonica.
• Manipolare e navigare– Manipolazione di oggetti virtuali e navigazione in spazi
virtuali --> manipolazione diretta
• Esplorare e sfogliare– L’utente può esplorare e sfogliare l’informazione come
una rivista o un libro (--> ipertesto)
70
La manipolazione diretta e’
1. L’ analogo del modelli di Norman2. L’analogo del modello di Abowd e Beale3. Un modello concettuale basato
sull’attivita’ che descrive la manipolazione di oggetti virtuali
71
In un modello basato su oggetti, l’agente e’:
1. Una metafora2. Un foglio elettronico3. Una parte dell’interfaccia che esegue
compiti stabiliti dall’utente
72
Modelli basati su oggetti
• Modulo da riempire: – L’interfaccia èun modulo che l’utente deve compilare
• Agente:– L’interfaccia è un agente che esegue compiti stabiliti
dall’utente – Esempi:
• Filtro anti-spam• Assistente di Office• Wizards• ….
73
In un modello basato su oggetti, l’agente e’:
1. Una metafora2. Un foglio elettronico3. Una parte dell’interfaccia che esegue
compiti stabiliti dall’utente
74
Metafore
• L’essenza della metafora è comprendere ed avere esperienza di una cosa in termini di un’altra.
• Le metafore producono modelli concettuali (basati sull’attività o sull’oggetto o altro)
• Alcuni dei precedenti derivano da metafore (p. es. scrivania, modulo cartaceo)
• Le metafore forniscono all’utente analogie (aiutano il problem solving)
• Le metafore rendono l’interfaccia familiare e facilitano l’apprendimento
• La metafora può essere fuorviante: gli utenti potrebbero prendere la metafora alla lettera e farsi un modello concettuale sbagliato del sistema
75
Stili di interazione
ComandiSelezione menu
Riempimento moduliWIMP
76
Stili di interazione
• Sono le modalità concrete attraverso le quali l'utente può comunicare o interagire con il sistema:
– Interfaccia a linea di comando (fornire istruzioni)– Interrogazione (fornire istruzioni)– Selezione in un menu (fornire istruzioni)– Domanda/risposta (dialogare)– Compilazione di moduli (modulo)– Fogli elettronico (modulo)– Point & click (esplorare e sfogliare)– WIMP (manipolazione diretta)– Tridimensionali (manipolazione diretta)– Multimodale (metafore specifiche)
77
In una WIMP le finestre sono
1. Aree dello schermo che si comportano come se fossero indipendenti
2. Piccole frecce che identificano una corrispondenza spaziale tra schermo e posizione del mouse
3. Piccole immagini o figure usati per rappresentare alcuni oggetti dell’interfaccia
78
Elementi della WIMP
• Finestre (Windows)• Aree dello schermo che si comportano
come se fossero indipendenti – può contenere testo o oggetti grafici– può essere spostata o ridimensionata– possono affiancarsi o sovrapporsi ed oscurarsi a
vicenda.– Barra di scorrimento (scrollbar)
• permette di muovere il contenuto della finestra sopra e sotto o da un lato all’altro
– barra del titolo (title bar) • descrive il nome della finestra
79
• Icone (Icons)– Sono piccole immagini o figure usate per rappresentare
alcuni oggetti dell’interfaccia o un’azione.– Le finestre possono essere chiuse (iconificate), ovvero
rappresentate da una icona
• Puntatori (Pointers)– Componente fondamentale – Identifica una corrispondenza spaziale fra lo schermo e la
posizione fisica del mouse– Tipicamente una piccola freccia, ma può cambiare (es.
mano o clessidra)
80
• Menu– Scelta (tramite il puntatore) di operazioni
elencate sul display– Alleggeriscono il compito della memoria a breve
termine– Non bisogna mettere troppe voci, meglio usare
menu a cascata (cascading menu)• la selezione di un menu apre un altro menu adiacente.
– Menu principale visibile sempre come barra dei menu
81
– menu a tendina (pull-down) – fall-down
• simili ai menu a tendina ma non serve fare click
– menu a comparsa (pop-up) • di solito per opzioni contestuali• Appaiono dove si clicca
82
In una WIMP le finestre sono
1. Aree dello schermo che si comportano come se fossero indipendenti
2. Piccole frecce che identificano una corrispondenza spaziale tra schermo e posizione del mouse
3. Piccole immagini o figure usati per rappresentare alcuni oggetti dell’interfaccia