13. conoscere l'utente (iii): il sistema motorio

Corso di Interazione Uomo MacchinaAA 2013-2014

Roberto Polillo

Corso di laurea in InformaticaUniversità di Milano BicoccaDipartimento di Informatica, Sistemistica e Comunicazione

Conoscere l'utente: il sistema motorio

1

R.Polillo - Marzo 2014Edizi

one 2013-1

4

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 2014

2

http://www.rpolillo.it/

http://creativecommons.org/licenses/by-nc-sa/3.0/it/deed.it

PERSONA

LIVELLO COGNITIVO

RUOLO

DIVERSITÀ DEGLI UTENTI

Utente

COMPORTAMENTI

Livelli di descrizione dell’utente

3


Temi

L’importanza del feedback nell’apprendimento motorio

La legge esponenziale della pratica La legge di Fitts


4

L’importanza del feedback

In operazioni che richiedono apprendimento motorio, è necessario fornire sempre un feedback all’utente


5

Feedback e apprendimento motorio

tentativi

err

ori

Feedback quantitativo

Feedback qualitativo

Nessun feedback


6

Feedback qualitativo: esempio


7

Feedback quantitativo: esempio

posizione del cursore


8

Esempio: feedback visivo e touch screen

Esperimento: digitare numeri di 4 cifre su una tastiera numerica visualizzata su un touch screen

Visualizzazione in un campo del

numero digitato

Nessun

feedback Entrambi i

feedback

(M.Deron, How Important is Visual Feedback When Using a Touch Screen?, Usability News, Winter 2000)


9

Visualizzazione 3D della depressione del

tasto

iPhone: feedback10


Personalizzazione


11

Blackberry Q10: keyboard


12

La legge esponenziale della pratica

Il tempo necessario per effettuare un compito diminuisce con la pratica.In particolare, il tempo Tn per effettuare un compito all’n-esima prova è dato da:

Tn = T1 n -

dove 0.4 [0.2 ~ 0.6]


13

La legge esponenziale della pratica

0

2

4

6

8

10

12

0 10 20 30 40 50

N (numero tentativi)

T (te

mpo

di e

secu

zion

e)

Series1

Tn = T1n-

T1=10; =0.4

Inizialmente si migliora molto rapidamente

… poi molto lentamente

prove)


14

Un esperimento

Un pannello ha 10 tasti situati sotto 10 luci. L’utente deve premere un sotto-insieme di tasti in risposta all’accensione di un sottoinsieme di luci (Klemmer, 1962). NB: il grafico è su scala bilogaritmica

Per migliorare del 20% ci vogliono

50.000 prove

Per migliorare del 20% ci vogliono

1.000 prove


15

La legge di Fitts

D

S

T = 100 log2(D/S + 0.5)

Il tempo T necessario per muovere la mano su un bersaglio di dimensioni S a distanza D dipende dalla precisione relativa richiesta (rapporto D/S)

Più un oggetto è piccolo e lontano, più tempo ci vuole a raggiungerlo


16

T0OK

OKT0 - ΔT

OKT0 - ΔT

Legge di Fitts: esempio


17

Esempio

T(S) = 100 log2 (25/S + 0.5)


18

Esempio

T(D) = 100 log2 (D/0.5 + 0.5)


19


20

Esempio: evoluzione di Windows


21


Percorsi visivi: siete d’accordo con questo layout?

22


23

PowerPoint 2010, Windows


24

PowerPoint 2008 e 2011, Mac

I menu migliori per la legge di Fitts

1. Pie2. Pop-up3. Tendina

(nell’ordine)


25

Menu a tendina

MAC OS 8R.Polillo - Marzo 2014

26

Ahlstrom, CHI 2005

- 3 movimenti verticali V1, V2, V3- 2 movimenti orizzontali H1, H2

Selezione da menu


28

Pop-up menu


31

Pie menu


32

Pie menu nidificati


33

34


Qui tutta l’area grigia è cliccabile

Qui è cliccabile solo il testo

Menu responsive: top (toggle)


35

https://developer.mozilla.org/en-US/Apps/Design/Responsive_Navigation_Patterns

Menu responsive: bottom (expandable)


36

Menu responsive: left (hidden)


37

Esempio: Tableconnect (smartphone+tavolo)


38

https://www.youtube.com/watch?v=0MDwvALVf_k



Next generation “airtouch” interfaces

Airtouch technology (video, 46"): http://

www.youtube.com/watch?v=Bu5_mXj7PA4

Concept design (video, 2'): http://www.youtube.com/watch?v=XbVN

UImVq-g

Display airtouch system (video, 2'): http://www.youtube.com/watch?v

=pgLpEF6u6ow

https://www.youtube.com/watch?v=u9tXEBeh86o


39

http://www.youtube.com/watch?v=Bu5_mXj7PA4



http://www.youtube.com/watch?v=XbVNUImVq-g

http://www.youtube.com/watch?v=XbVNUImVq-g

http://www.youtube.com/watch?v=pgLpEF6u6ow





13. conoscere l'utente (iii): il sistema motorio

Education