IxD booklet

Monica Zambolin

matr.:262192

Design dell’Interazione istruzioni per l’uso

Elaborato finale del corso di Design dell’Interazione (coordinatori: Gillian Crampton Smith e Philip Tabor) presentato il 19_12_2006 presso: Facoltà di Design e Arti, Università I.U.A.V., Venezia

Indice Informazioni Importanti

1

• Informazioni sulla sicurezza

Informazioni Generali • Cos’è l’Interaction Design?

Buono e cattivo design

4

5

1. Fasi di un processo di Interaction Design

7

• Obiettivi • Progettazione di proposte alternative • Costruzione di prototipi • Valutazione dei risultati

8 9 10

2. L’ Interaction Designer

12

• Comprendere il problema Raccogliere informazioni • Dare forma alle idee Prototipare Modelli e metafore • Il risultato: il buon design

14 16 17

3. Una valutazione critica

25

(il progettista del processo di Interaction Design)

• NOKIA 6101 e PANASONIC X400 a confronto

18

19_12_2006

Monica Zambolin

Informazioni Importanti Grazie per aver scelto questo piccolo manuale per comprendere, in modo veloce, il significato del lavoro dei designer dell’interazione.

Per informazioni più esaurienti e complete consulta il sito http:\\www.ideo.com

Informazioni sulla sicurezza E’ necessario leggere scrupolosamente le seguenti informazioni, che forniscono dettagli per l’utilizzo delle nozioni riportate, in maniera sicura per l’utente e per l’ambiente, in conformità ai regolamenti in vigore.

La lettura delle seguenti pagine deve essere accompagnata dall’effettiva sperimentazione sul campo: chiunque può essere Alimentazione designer dell’interazione!

Calore

Si raccomanda di tenere, questo manuale, lontano da fonti di calore.

Durante la guida

Il conducente di un veicolo è obbligato a mantenere sempre il completo controllo del mezzo. Non leggere durante la guida; parcheggiare prima l’auto in un luogo sicuro.

Utilizzo efficiente

Per un utilizzo efficiente, tenere in mano il manuale come un normale libro. Grazie alle ridotte dimensioni dell’oggetto è possibile trasportarlo all’interno di una tasca dei pantaloni o in borsa.

1

Monica Zambolin

Precauzioni

19_12_2006

Evitare il contatto con i liquidi.

Non lasciare il manuale esposto alla luce diretta del sole o in un luogo umido, polveroso o caldo.

Quando si smaltisce il materiale di imballaggio o il prodotto usato, contattare le autoritĂ per ottenere informazioni sulle possibilitĂ di riciclaggio.

2

19_12_2006

Monica Zambolin

3

Monica Zambolin

19_12_2006

Informazioni Generali Cos’è l’Interaction Design?

L’interaction design o design dell’interazione, si occupa della progettazione di strumenti interattivi efficaci, facili e piacevoli per sostenere le persone nella loro vita quotidiana.

Per strumenti o prodotti interattivi si intendono tecnologie, oggetti, applicazioni e dispositivi di qualunque genere con i quali l’utente interagisce.

Progettare l’interazione significa migliorare e potenziare il modo in cui le persone lavorano e comunicano.

4

19_12_2006

Monica Zambolin

Buono e cattivo design L’usabilità di un prodotto interattivo è lo scopo della progettazione del design dell’interazione.

Un prodotto usabile viene identifi cato attraverso determinati punti di forza e di debolezza che permettono il confronto tra sistemi ben progettati ed altri mal progettati.

design BUONO

design CATTIVO

• richiede pochi passaggi per portare a termine le operazioni di base

• obbliga a numerosi passaggi per compiere le operazioni di base

• design semplice ed elegante • offre diverse funzionalità • utilizza un sistema di rappresentazione basato su oggetti famigliari • esteticamente gradevole e divertente da usare

• è snervante • non è chiaro cosa si deve fare • non permette di capire a colpo d’occhio il metodo d’utilizzo • è difficile da usare

5

Monica Zambolin

6

19_12_2006

19_12_2006

Monica Zambolin

Fasi di un processo di Interaction Design Obiettivi Identificare i bisogni degli utenti è il primo passo per affrontare la progettazione di un prodotto interattivo.

E’ necessario conoscere il tipo di utente che andrà ad utilizzare il nuovo strumento e saper riconoscere quali sono i suoi bisogni principali e secondari in modo tale da condurre una progettazione che avrà lo scopo di soddisfarli.

Capire le caratteristiche delle attività svolte dall’utente e comprendere i suoi bisogni porta alla definizione dei requisiti che dovranno essere soddisfatti dal nuovo progetto.

7

Monica Zambolin

19_12_2006

Progettazione di proposte alternative Il passo successivo, dopo aver identificato i requsiti fondamentali del sistema che si va a progettare, è la proposta di nuove idee.

Si propone in, prima istanza, un modello concettuale (cosa farà il prodotto, come si comporterà,che aspetto avrà, etc.).

In un secondo momento si arriverà a definire colore, suoni, immagini da usare, etc. ovvero l’aspetto fisico del sistema.

8

19_12_2006

Monica Zambolin

Costruzione di prototipi Per poter valutare l’effettiva usabilità del nuovo progetto, si costruiscono dei prototipi cartacei, e si sottopongono agli utenti.

Da questo tipo di prove si possono rintracciare punti deboli e forti del nuovo progetto.

Interessante è capire, come l’utente interagisce con il nuovo prodotto e se le azioni vengono compiute con facilità.

9

Monica Zambolin

19_12_2006

Valutazione dei risultati Molte sono le idee che nascono, come il numero di prototipi che verranno realizzati. Riconoscere la soluzione migliore tra quelle proposte è l’ultimo passo della progettazione di un nuovo prodotto.

Facilità di utilizzo, capacità di soddisfare i bisogni, bellezza sono alcuni dei criteri che permettono di identificare la miglior produzione.

10

19_12_2006

Monica Zambolin

11

Monica Zambolin

19_12_2006

L’Interaction Designer Comprendere il problema Per il designer che si appresta a mettere in atto un nuovo progetto è essenziale che il suo obiettivo principale sia l’usabilità del prodotto.

• Per prima cosa è necessario raccogliere quante più informazioni possibili sugli utenti, il loro lavoro e il contesto di quel lavoro, in modo tale che il nuovo prodotto possa sostenerli nel raggiungimento dei loro obiettivi.

• In un secondo momento si produrrà, a partire dai bisogni identificati, un insieme di requisiti per poter cominciare a progettare.

Sbagliare la definizione dei requisiti è un errore da evitare. Se gli utenti vengono ascoltati, sarà più possibile che i risultati finali ne rispecchino le aspettative.

12

19_12_2006

Monica Zambolin

Identifi cazione dei requisiti e utilitĂ del prodotto: schema concettuale

13

Monica Zambolin

19_12_2006

Raccogliere informazioni Lo scopo di raccogliere dati è quello di ottenere informazioni suffi cienti, rilevanti e appropriate sull’utenza.

Esistono diverse tecniche fl essibili per la raccolta dati che possono essere combinate tra loro.

Queste tecniche sono: • questionari; • interviste (registrazioni audio/video); • l’osservazione sul campo; • studio di documentazioni esistenti.

I dati raccolti vanno successivamente interpretati e attraverso prime annotazioni, vanno strutturate le descrizioni dei requisiti.

I vari aspetti di un sistema che originano diversi requisiti vengono analizzati e documentati con l’utilizzo di diagrammi di fl usso (flow chart) o di stato ovvero, si devono costruire degli schemi concettuali che riassumano il processo delle attività svolte dagli utenti.

La schematizzazione dell’azione è molto importante perchè permette di identifi care i punti deboli del sistema.

14

19_12_2006

Monica Zambolin

INIZIO

FLOWCHART

STORYBOARD

afferrare la cornetta

controllare il numero sulla rubrica

NO

portarla all’orecchio

Conosci il numero da comporre?

SI inserire il dito sul foro corrispondente alla cifra

girare il disco in senso orario

NO

Hai inserito tutte le cifre del numero?

SI attendere una risposta

NO

Hai ricevuto risposta?

1. alzare la cornetta 2. portarla all’orecchio 3. comporre il numero 4. attendere la risposta 5. parlare

SI parlare

NO

6. riagganciare

La conversazione è terminata?

SI riagganciare

FINE

Telefonare con il telefono a disco Esempio di schematizzazione di un’azione attraverso uno storyboard ed un flowcahrt.

15

Monica Zambolin

19_12_2006

Dare forma alle idee Dopo la raccolta delle informazioni sulle pratiche di lavoro, e lo sviluppo di un’idea precisa circa quello che il sistema dovrebbe o non dovrebbe fare, arriva il momento di dar forma alle idee costruendo prototipi.

L’attività di progettazione inizia una volta definiti i requisiti.

• Dapprima si ha un’idea concettuale di ciò che il nuovo prodotto farà e come.

• In un secondo momento, si passa alla progettazione fisica del prodotto.

16

19_12_2006

Monica Zambolin

Prototipare Il prototipo è la forma iniziale del modello concettuale con il quale si vogliono presentare le informazioni attraverso il prodotto; è la simulazione dell’interazione che si vuole creare tra l’oggetto e l’utente.

Un prototipo è: • uno schizzo su un pezzo di carta; • un’immagine; • una simulazione video; • poche parole scritte; • diagrammi sintetici; • pezzi di carta e cartone; • pennarelli ; • post-it.

Il prototipo può essere costruito con qualsiasi tipo di materiale. Deve essere in grado però, di consentire l’interazione tra l’utente e il prodotto che si sta immaginando.

L’utente così, può fare esperienza di cosa significa utilizzare il nuovo prodotto nel contesto reale, esplorarne gli usi e valutarne i difetti.

17

Monica Zambolin

19_12_2006

Modelli e metafore Durante la progettazione vengono prese decisioni sulla natura dell’interazione da supportare e sul design fisico del prodotto.

Il modo in cui dovrebbe presentarsi il sistema all’utente dovrebbe essere semplice e comprensibile.

E’ necessario prendere decisioni sul modello di interazione da supportare ovvero creare un modello concettuale di come dovrà presentarsi il sistema all’utente e quali operazioni saranno permesse durante l’utilizzo.

La progettazione di un modello concettuale appropriato parte dalla selezione di una metafora.

L’utilizzo di una metafora dà al modello una struttura di base che risiede già nelle conoscenze familiari all’utente.

18

19_12_2006

Monica Zambolin

Esistono due tipi di modelli concettuali basati, l’uno sulle attività più comuni per gli utenti e l’altro basato sugli oggetti ATTIVITA’ 1. impartire ordini / dare informazioni 2. chiedere infirmazioni / discutere

OGGETTI • libro • strumento • veicolo

3. aprire / chiudere / spostare 4. ricercare

MODELLI basati su ATTIVITA’ 1. fornire istruzioni 2. conversare 3. manipolare / navigare

MODELLI basati su OGGETTI •sfruttano un’analogia con oggetti del mondo fisico •l’oggetto viene manipolato come nella realtà.

4. esplorare / sfogliare

19

Monica Zambolin

19_12_2006

Un particolare modello concettuale di interfaccia è la metafora.

La metafora di interfaccia è sviluppata per essere simile agli aspatti di una entità fisica ma che ha comportamenti e proprietà proprie.

Questo tipo di modelli possono basarsi su una attività, su un oggetto o su entrambi.

L’esempio più conosciuto di metafora di interfaccia è l’analogia tra la scrivania e il desktop .

20

19_12_2006

Monica Zambolin

Comparazione tramite icone della metafora della scrivania utilizzata per il desktop del pc.

SCRIVANIA

DESKTOP

DOCUMENTI

FILES

CARTELLE PER L’ARCHIVIO

CARTELLE DATI

ARCHIVIO

RISORSE DEL COMPUTER

LENTE

RICERCA

STAMPANTE / FOTOCOPIATRICE

STAMPANTE

POSTA

E-MAIL

DOCUMENTI DA ELIMINARE

FILES DA CANCELLARE

CESTINO

CESTINO

21

Monica Zambolin

19_12_2006

Il risultato: il buon design Per la realizzazione di un buon progetto il designer deve prendere in considerazione una serie di elementi guida che lo porteranno a creare un buon oggetto di design.

Oggi sono disponibili diversi insiemi di principi. Quelli più conosciuti riguardano il ‘come’ determinare che cosa un utente dovrebbe vedere e poter fare nel corso dello svolgimento di una certa attività in interazione con un sistema.

A seguito verrà riportato un elenco dei principi più comuni ai quali un designer dell’interazione dovrebbe fare riferimento.

PRINCIPI PER UN BUON DESIGN RENDERE LE COSE VISIBILI: più le funzioni del sistema sono visibili all’utente più gli sarà chiaro cosa fare.

FORNIRE VINCOLI: limitare le possibilità di interazione fra utente e sistema in un dato momento riducendo così la possibilità di commettere errori. (segue)

22

19_12_2006

Monica Zambolin

PRINCIPI PER UN BUON DESIGN

FORNIRE FEEDBACK: qualsiasi strumento utilizzato deve inviare un’informazione di ritorno per informare che una certa azione è andata a buon fine e permette all’utente di continuare nello svolgimento della sua attività.

I feedback a disposizione del designer dell’interazione sono di tipo uditivo, tattile, verbale e visibile.

FORNIRE UN MAPPING NATURALE: nella realizzazione del mapping bisogna tenere conto del modo di utilizzo dello strumento il quale dovrà fornire effetti direttamente connessi all’azione. es.: su di un telecomando premo il tasto con scritto ‘1’ e alla TV compare il canale n°1.

GARANTIRE LA CONSISTENZA: è fondamentale l’utilizzo di elementi simili per svolgere compiti simili.

FORNIRE AFFORDANCE: il termine affordance indica la proprietà di un oggetto di far capire come deve essere usato. Fornire un’affordance significa fornire un’indizio; il disegno di elementi come bottoni, icone, link e barre di scorrimento devono invitare a compiere dterminate azioni. es.: i bottoni devono invitare ad essere premuti.

23

Monica Zambolin

19_12_2006

Esempio di interfaccia di un lettore CD.

Vincolo

(pulsante attivo solo se il brano è in esecuzione )

Affordance

Mapping naturale

(le frecce indicano chiaramente le azioni: play,avanti,indietro, stop,etc.)

Feedback

( la forma del bottone richiama l’azione del premere)

PLAY: ascolto del brano STOP: interruzione del brano AVANTI/INDIETRO: avanzamento o regressine del brano

24

19_12_2006

Monica Zambolin

Una valutazione critica NOKIA 6101 e PANASONIC X400 a confronto Mettere a confronto due prodotti è utile per poter comprendere quali sono gli aspetti importanti da tenere in considerazione quando si ha in mano un sistema interattivo.

• Cosa rende un prodotto migliore rispetto all’altro?

Chi l’utilizza? Perchè? Cosa ci si aspetta che faccia questa tecnologia? Queste sono alcune domande che ci si pone per poter portare avanti una critica, un confronto tra due prodotti.

• Lo schema seguito per la valutazione è quello a pg. che spiega la differenza tra buono e cattivo design.

Diagrammi e tabelle sono stati costruiti per chiarire punto per punto i diversi aspetti.

25

Monica Zambolin

19_12_2006

NOKIA 6101 Si tratta di un recente modello di cellulare della NOKIA caratterizzato da sportellino apribile, display a colori e fotocamera.

Creato per offrire agli utenti non solo le possibiliĂ standard che offre un telefonino (fare e ricevere telefonate, mandare SMS, gestire una rubrica) ma anche per garantire nuovi servizi. Questo prodotto , infatti, offre la possibilitĂ , di effettuare la connessione internet, mandare MMS, ascoltare la radio oltre che fare e salvare foto.

26

19_12_2006

Monica Zambolin

PANASONIC X400 Le caratteristice fisiche di questo modello di cellulare sono molto simili a quelle del NOKIA 6101; è anch’esso, infatti, caratterizzato da sportellino apribile, display a colori e fotocamera.

Offre agli utenti le possibilià standard di un semplice telefonino (fare e ricevere telefonate, mandare SMS, gestire una rubrica) e contemporaneamente garantire nuovi servizi. Anche questo prodotto , infatti, offre la possibilità, di effettuare la connessione internet e mandare MMS,

27

Monica Zambolin

19_12_2006

IL DESIGN FISICO: aspetti comuni

Displey principale

Tasto di navigazione Disposizione tasti di controllo

Obbiettivo fotocamera

NOKIA 6101

28

PANASONIC X400

19_12_2006

Monica Zambolin

IL DESIGN FISICO: diversitĂ

Apertura manuale

Apertura tramite pulsante

Tasti in rilievo

Tasti piatti

Porta infrarossi Spia-indicatore

per segnalazione di chiamata

Display

per segnalazione di chiamata

NOKIA 6101

PANASONIC X400

29

Monica Zambolin

19_12_2006

IL DESIGN DELL’INTERFACCIA: aspetti comuni

Ricerca rete Livello batteria

NOKIA 6101

PANASONIC X400

Nome rete logo operatore

Accesso Menù

30

19_12_2006

Monica Zambolin

IL DESIGN DELL’INTERFACCIA: diversità

ora/data

Preferiti

NOKIA 6101

Rubrica

sms

collegamento internet

PANASONIC X400

31

Monica Zambolin

19_12_2006

SISTEMA DI RAPPRESENTAZIONE NOKIA 6101

MENU’ -elenco di funzioni -elenco di icone

PANASONIC X400

MENU’= icone con descrizione in alto a sinistra.

-barra di scorrimento • L’utente riconosce il tipo di • L’utente ha la percezione

funzione dal tipo di icona.

immediatadel contenuto di Non potrà essere mai certo ogni voce.

che il contenuto sia quello

• La voce selezionata viene cercato finchè non controlla evidenziata.

la voce che compare in alto a sinistra.

• La voce selezionata viene circoscritta da quattro linee

32

19_12_2006

Monica Zambolin

ELENCO DELLE FUNZIONALITA’ NOKIA 6101

PANASONIC X400

1. Rubrica

1. Rubrica

2. Messaggi: SMS, MMS

2. Messaggi: SMS, MMS

3. Crea nuovo

3. Crea nuovo

4. Collegamento internet

4. Collegamento internet

5. Giochi

5. Giochi

6. Fotocamera

6. Fotocamera

7. Applicazioni: sveglia,

7. Applicazioni: sveglia,

registratore, calcolatrice

registratore, calcolatrice

8. Infrarossi

8. Infrarossi

9. Calendario

9. Calendario

10.Archivio: foto, suoni

10.Archivio: foto, suoni

11. Registro chiamate

11. Registro chiamate

12. Radio 13. Agenda 14. Note 15. Cronometro 16. PTT 17. Galleria

33

Monica Zambolin

19_12_2006

NUMERO DI PASSAGGI DA COMPIERE PER LE PRINCIPALI OPERAZIONI NOKIA 6101

PANASONIC X400

Creazione ed Invio di un messeggio di testo SMS 1. Selezionare Men첫

1. Selezionare Men첫

2. Messaggi

2. Icona Messaggi

3. Crea messaggio

3. Crea nuovo

4. Messaggio testo

4. Selezionare SMS

5. Scrivere un messaggio

5. Scrivere un messaggio

6. Selezionare Invia

6. Selezionare Invia

7. Scegliere tra Ultimi

7. Selezionare Opzioni

numeri,A numero telefono,

8. Scegliere tra Invio, Invio

A pi첫 destinatari o

a molti, Modelli, Salva,

A indirizzo e-mail

Copia, Taglia, incolla, Esci

8. Selezionare o digitare un

9. Selezionare o digitare

numero telefonico

un numero telefonico o

9. Confermare

sceglire da Rubrica 10. Invio 11. Conferma

34

19_12_2006

Monica Zambolin

NOKIA 6101

PANASONIC X400

Ricerca contatti in Rubrica 1. Selezionare Menù

1. Selezionare Menù

2. Rubrica

2. Icona Rubrica

3.Nomi

3. Apri rubrica

4. Opzioni

4.Scorrere l’elenco o im-

5. Cerca

mettere la prima lettera del

6. Scorrere l’elenco o im-

nominativo ricercato

mettere la prima lettera del nominativo ricercato

Consultazione registro chiamate 1. Selezionare Menù

1. Selezionare Menù

2. Registro chiamate

2. Icona Registro chiamate

3.Scegliere tra Chiamate

3. Scegliere tra Chiamate

senza risp., Chiamate rice-

senza risp., Chiamate rice-

vute, Chiamate effetuate

vute, Chiamate effetuate

4. Visualizzare i dettagli

4. Visualizzare i dettagli

35

Monica Zambolin

19_12_2006

CONFRONTO FINALE NOKIA 6101

PANASONIC X400

ASPETTI POSITIVI

• Apertura dello sportellino manuale;

• Tasti di navigazione separati;

• Tasti in rilievo;

• Riconoscibilità tramite icona dei tasti di risposta o termine chiamata;

• Display esterno che visualizza il numero della chiamata in arrivo; • Collegamento alla rubrica presente sulla prima schermata; • Possibilità di annullare un processo indesiderato premendo il tasto di sospensione chiamata; • Menù ad elenco con funzioni ben specifi cate; • Accostamento parole e icone.

36

• Illuminazione della spia anteriore di colore diverso in base all’operazione che si sta facendo; • Porta infrarossi frontale

19_12_2006

Monica Zambolin

NOKIA 6101

PANASONIC X400

ASPETTI NEGATIVI

• Non c’è la data sulla schermata principale;

• Apertura sportellino con pulsante;

• Porta infrarossi laterale;

• Collegamento internet presente sulla prima schermata;

• Tasti di navigazione non separati, non distinguibili da icone o colori oltre che per la forma;

• Colegamento al menù principale non visibile; • Utilizzo di icone e non di descrizioni (è necesserio memorizzare il signifi cato delle fi gure);

37

Garanzia