Progettazione per l’utente in mobilità MUI

1. Progettazione per l’utente in mobilitàMUI Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 Fabiana Vernero

2. Utenti mobili, device mobili Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 Fabiana Vernero

3. Perché? - 1 • Telefono cellulare : personal computer = 4 : 1 • Per molte persone, il cellulare costituisce il mezzo principale con cui accedere a Internet. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

4. Perché? - 2 • Spesso la user experience non è soddisfacente quando si accede a siti pensati per PC da un device mobile: • Difficoltà nel reperire i contenuti più utili in mobilità • Difficoltà/impossibilità di visualizzare siti molto ricchi • Lentezza, costi elevati Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

5. Da “desktop” a “mobile” • Quali contenuti dovrebbero essere accessibili in mobilità? • Quali bisogni si soddisfano rendendo i propri contenuti accessibili agli utenti in mobilità? • Qual è il valore aggiunto di accedere a certi contenuti in mobilità? Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

6. Mobile Web • Connettività diffusa • Accesso all’informazione “anytime and anywhere”. • Uso di caratteristiche specifiche del device (chiamate dirette a numeri telefonici, aggiunta di contatti in rubrica…) • Servizi basati sulla localizzazione. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

7. Utenti in mobilità • Bisogni a breve termine. • Obiettivi precisi (goal-oriented attitude). • Interesse per informazioni specifiche. • Scarso interesse per la navigazione. • Scarso interesse per i documenti prolissi. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

8. Mobile devices (svantaggi) • Display di dimensioni limitate. • Possibili difficoltà di input. • Limitato supporto tecnologico (es. script, plug in). • Limitate capacità computazionali ( lentezza nella visualizzazione delle pagine, specie se ricche o con errori di markup…) • Memoria limitata ( visualizzazione di pagine incomplete). Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

9. Mobile devices (vantaggi) • Personali • Personalizzabili • Portatili • Connessi • Multi-funzionali (oltre la comunicazione vocale). • Geo-localizzazione • Uso con una mano sola • Sempre accesi • Strumenti di “alerting” universalmente riconosciuti Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

10. Architettura dell’informazione • L’informazione dovrebbe essere strutturata il più semplicemente possibile: • Differenza tra una buona e una cattiva esperienza! • Numero di click necessari per ottenere l’informazione desiderata. • Lentezza nel reperimento dei dati Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

11. Strategie • Limitare le scelte • Considerare solo il contenuto rilevante per un utente in mobilità • Sito “piccolo” e ben focalizzato • Semplice architettura “verticale” (drill down) • Annidamento di sottocategorie ben etichettate Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

12. Annidamento • Limitare il numero delle categorie e dei livelli (non superare i cinque) • Limitare il numero di link per pagina. • Non lasciare mai categorie/pagine vuote • Offrire esempi/preview per i contenuti annidati, per aiutare gli utenti a scegliere. • Ordinare i link in base alla frequenza di accesso • Aumentano le possibilità che l’utente trovi subito ciò che desidera • I contenuti meno popolari sono penalizzati Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

13. Schermi di dimensioni diverse • Le dimensioni dei display e il layout delle tastiere variano molto. • La larghezza dello schermo è più importante della lunghezza. • Soluzioni: • Conoscere il proprio target • Personalizzare in base al device Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

14. Schermi di dimensioni diverse Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

15. Progettare per il device giusto • Dominare la complessità considerando classi di device: • Voice-only phones • Feature phones • Smartphones (applicazioni, schermo più grande) • PDAs (organizzazione piuttosto che comunicazione, tastiera QWERTY o stilo, schermo più grande) • I confini tra le classi non sono ben definiti e si spostano costantemente. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

16. Default Delivery Context • Il W3C ha definito un contesto tecnologico “di base”, specificando le caratteristiche che qualunque device mobile dovrebbe avere. • Vantaggio: I servizi accessibili nel DDC sono accessibili da qualunque device mobile. • Svantaggio: L’esperienza utente e’ molto povera (“baseline experience”; non vengono sfruttate le possibilità dei device più evoluti, che sono la maggior parte). Usable Screen Width: 120 pixels, minimum. Markup Language Support: XHTML Basic 1.1 (delivered with content type application/xhtml+xml) Character Encoding: UTF-8. Image Format Support: JPEG, GIF 89a. Maximum Total Page Weight: 20 kilobytes. Colors: 256 Colors, minimum. Style Sheet Support: CSS Level 1; In addition, CSS Level 2 @media rule together with the handheld and all media type. HTTP: HTTP/1.0 or more recent. Script: No support for client side scripting. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

17. Paradigmi di navigazione • Gli schemi di navigazione tipici del desktop-Web (es tab, menu globali estesi in orizzontale…) non sono molto adatti al contesto mobile. • Navigazione verticale, basata su una lista di opzioni. • Un solo livello di navigazione per volta (per non occupare troppo spazio e non presentare troppe opzioni agli utenti). • “Punti di fuga”: Collegamenti alla pagina successiva, alla pagina genitore, alla home (generalmente a fondo pagina, o sia in alto che in basso). • Layout monolitici con testo giustificato a sinistra. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

18. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

19. Multiple User Interfaces Tante interfacce per un solo servizio Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 Fabiana Vernero

20. Definizione • Un sistema che permette: • Accesso ad un servizio da diverse piattaforme • Viste “differenti” dell’informazione disponibile • Coordinamento delle funzioni offerte • In breve: • Supporta diversi stili di interazione ed interfaccia • Permette di raggiungere obiettivi correlati usando mezzi diversi • Caratteristiche e funzioni si comportano in modo coerente sulle varie piattaforme Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

21. Capire i device • In una MUI, tipi diversi di device si supportano e definiscono insieme un’esperienza coerente. • Desktop… • Mobile… • Situated (es. totem)… • Home (es. Interactive tv) • Special purpose embedded devices… Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

22. Display ampio, tastiera comoda, buone capacità computazionali, possibilità di leggere dati da memorie terziarie… Sistema operativo generico, disponibilità di varie applicazioni… Adatto per svolgere un compito in modo approfondito e focalizzato… Personal desktop/laptop computer http://www.andriastore.it/catalog/images/desktop_computer.jpg Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

23. Display, modalità di input e capacità computazionali limitate… Possibilità di interazione vocale, ma.. Adatto a compiti nell’ambito della comunicazione e/o organizzazione personale Sempre con sé, fornisce connettività quasi ovunque… Consente di ottenere informazioni “al volo”, permette la geolocalizzazione… Device mobile http://ziogeek.com/wp-content/uploads/2009/07/samsung-i7500-android-smartphone.jpg Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

24. Dedicati a specifici servizi (non sono sistemi flessibili)… Possono essere interattivi o meno… Possono fornire informazioni “a colpo d’occhio”… Hanno un legame con il posto in cui si trovano… Situated devices http://www.wetouch.it/images/totemhome.jpg Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

25. Ampio display, modalità di input limitate a pochi tasti… Fruizione rilassata, in un ambiente rassicurante e familiare… Non adatto per compiere delle elaborazioni… Interactive Television http://bobrien.com/images/img_remote.jpg Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

26. Capacità computazionali limitate, non adatti per servizi generici… Usano sensori ed attuatori: contatto ed interazione con l’ambiente circostante, modalità di input naturali… Possono rendere “intelligente” e “connesso” un oggetto generico, che avrebbe comunque una sua funzione (es. la maglia può essere indossata) Special purpose embedded devices http://faketakemake.posterous.com/?page=2 http://web.media.mit.edu/~leah/images/diy_lilypad/turn_signal/turn_%20-%2044.jpg Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

27. Al lavoro! • Come caratterizzereste ulteriormente ciascuna delle categorie di device proposte? • Suggerimento: concentratevi su situazioni e bisogni dell’utente Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

28. Caratteristiche - 1 • Astrazione • Le informazioni e i servizi dovrebbero essere gli stessi a partire da qualunque piattaforma. • Le modalità di presentazione possono variare in base alle caratteristiche della piattaforma stessa. • Consistenza “cross-platform” • Il comportamento di una MUI deve essere lo stesso su qualunque piattaforma (es. devono essere mantenute le preferenze dell’utente) • Il look and feel può variare… Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

29. Caratteristiche - 2 • Uniformità • Le funzioni dovrebbero essere le stesse su tutte le piattaforme e dovrebbero funzionare nello stesso modo (es., essere composte dagli stessi passi…) • Consapevolezza dei trade-off • E’ possibile progettare delle interfacce semplificate in cui non siano presenti alcune caratteristiche secondarie, se per l’utente è un valore accedere comunque al servizio da una certa piattaforma Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

30. Caratteristiche - 3 • Conformità con gli standard : • Non è necessario che tutte le caratteristiche siano presenti su tutte le piattaforme. • E’ bene adeguarsi allo standard della piattaforma per definire quali caratteristiche mantenere e quali no. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

31. Usabilità delle MUI Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 Fabiana Vernero

32. The personal computing continuum [Weiss, 2002] size portability desktop laptop palmtop handheld Usabilità delle MUI • Contesto d’uso: posto + situazione (tipo di task…) • Consente di valutare una combinazione device + interfaccia Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

33. Contesti d’uso • Stationary: non è necessario (ma è possibile) che i device siano portatili. • Seated: l’utente ha entrambe le mani libere per interagire col device e può dedicare tutta la sua attenzione all’interfaccia. • Standing: l’utente regge il device con una mano e ci lavora con l’altra. • Moving: l’utente regge e utilizza il device con la stessa mano (deve averne una libera) Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

34. Device, interfacce e contesti • Quanto più un device è portatile, in tanti più contesti può essere utilizzato. • L’interfaccia di un device non portatile non può essere trasferita su un device portatile mantenendo lo stesso livello di usabilità. • Un’interfaccia adatta ad un device portatile non può permettere di svolgere tutti i compiti che consente l’interfaccia di un device non portatile. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

35. Fattore “portabilità” • Di quante parti può essere composto un device da utilizzare in uno specifico contesto? • Stationary  non rilevante • Seated  alcune (purché non troppo grandi e pesanti da trasportare) • Standing  al massimo due • Moving  una sola Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

36. Fattore “attenzione” • Qual è il livello di attenzione che si può chiedere all’utente (primario, secondario, minimale)? • Stationary  qualunque livello • Seated  qualunque livello • Standing  al massimo secondario • Moving  solo marginale Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

37. Fattore “gestione” • In che modo ci si aspetta che l’utente gestisca l’interazione (con due mani, stabile; con due mani, instabile; una mano, sbilanciato) • Stationary  qualunque tipo • Seated  qualunque tipo • Standing  al massimo con due mani, instabile • Moving  una mano, sbilanciato Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

38. Fattore “apprendibilità” • Quale tipo di apprendimento si può richiedere all’utente perché impari ad usare la nuova interfaccia (tecnologico, metaforico, idiomatico)? • Stationary  qualunque tipo • Seated  qualunque tipo • Standing  metaforico o idiomatico • Moving  idiomatico Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

39. Profilo dei contesti • Nel contesto “moving” ho il maggior numero di vincoli, ma un device mobile con un’interfaccia adatta può essere usato in tutti i contesti. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

40. Interusabilità Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 Fabiana Vernero

41. Introduzione • Quando gli utenti entrano in un nuovo contesto, devono poter applicare le conoscenze già acquisite. • Queste conoscenze devono poter essere adattate in base alle caratteristiche del device. • Il servizio deve essere continuo: • Continuità della conoscenza (una conoscenza unitaria deriva dall’uso dei diversi device) • Continuità del task (memoria delle ultime operazioni svolte) Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

42. Consistenza • Percettiva: l’aspetto e la struttura dell’informazione (es. ordine) deve essere simile sui vari device. • Lessicale: uniformità nell’uso delle etichette. • Sintattica: uniformità nelle operazioni da svolgere per ottenere un certo obiettivo. • Semantica: tutti i device dovrebbero offrire gli stessi servizi (ridondanza) Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

43. Trasparenza • Gli utenti devono poter capire immediatamente che cosa possono fare, come possono farlo e perché il sistema risponde in un certo modo. • A seconda che i device che compongono una MUI siano ridondanti, mutuamente esclusivi o complementari, si devono affrontare difficoltà diverse per rendere il sistema trasparente. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

44. Adattamento • Il sistema dovrebbe sapere: • Quali device l’utente ha già utilizzato; • La quantità e la frequenza d’uso di ogni device; • L’ultima operazione compiuta con la MUI • Il sistema può: • Adattare il livello delle spiegazioni offerte. • Contestualizzare le informazioni (es. ricordare quali operazioni hanno determinato lo stato attuale del sistema) Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

45. Bibliografia • Ahmed Seffah, Homa Javahery (eds.), Multiple User Interfaces, 2004, Wiley. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

46. Al lavoro! • Progettare (a grandi linee) una MUI: • Per quale dominio? • Quali sono i servizi che la MUI deve offrire? • Da quali device è composta la MUI? • Quali sono i benefici associati a ciascuno dei device? • Quali funzioni offrono i diversi device? • Quali caratteristiche possono non essere supportate su alcuni dei device? Perché? Laboratorio di Interazione Uomo-Macchina – a.a.2010/2011 F. Vernero