SlideShare a Scribd company logo
1 of 39
1 Dall’Usabilità delle Parole  all’Usabilità delle Interfacce di Yvonne Bindi yvonnebindi@yahoo.it
2
3
…panic? 4
5 …addirittura!
6
7
8
9
10
… 11
Bottoni svolgono un ruolo importante nel modo in cui i visitatori interagiscono con un sito web.  Ne vedete in giro per la rete di forme, dimensioni e stili più disparati. Esistono alcune regole fondamentali da tenere a mente quando progettiamo  (o scegliamo dei)dei bottoni. 12 La guerra dei bottoni
Tipo player La forza della convenzione Immediatezza comunicativa Quasi nessuno può sbagliare Quasi… 13 Bottoni solo icone
Niente della loro forma ci riconduce alla loro funzione Il testo, le parole, veicolano da sole il messaggio Parole di largo impiego e diffusione 14 Bottoni solo testo
I due codici (iconico e linguistico) si completano Riduzione dell’ambiguità del linguaggio Esplicitazione del valore dell’icona Rafforzare non è necessariamente ripetersi La comprensione di un segnale su web,  ma anche in altre situazioni è il risultato di un’interpretazione da parte dell’utente in cui entrano in gioco diversi fattori: - culturali ,[object Object]
 contestuali
etc.15 Bottoni icona e testo insieme
16
Ad ogni scopo i suoi bottoni 17
Quello che conta davvero Che si capisca che si tratta di un bottone Che si capisca a cosa serve  Testo Icona Posizione   Aspetto Comportamento Posizione 18
19 Pulsanti di default di Moodle
20 I nostri pulsanti
21
22
23
24 Come valutare l’usabilità Valutazioni euristiche La valutazione è eseguita da esperti  di usabilità Test di usabilità Si effettuano osservando un campione  di utenti mentre utilizza il sistema. Metodo Krug Le 10 regole di Nielsen Sinergia tra i due tipi di valutazione
Le 10 regole d’oro di Nielsen Visibilità dello stato del sistema Corrispondenza fra il mondo reale e il sistema Libertà e controllo da parte degli utenti Consistenza e standard Prevenzione degli errori Riconoscere piuttosto che ricordare Flessibilità ed efficienza d’uso Design minimalista ed estetico Aiutare gli utenti a riconoscere gli errori, diagnosticarli e correggerli Guida e documentazione useit.com: Jakob Nielsen's Website 25
26 Il metodo di Steve Krug Test di usabilità fai da te Eng		Ita Osservare delle persone mentre usano il nostro prodotto: qualcosa che abbiamo disegnato, creato o costruito. Per capire se il prodotto è facile da usare e cosa si può fare per migliorarlo. Advanced Common Sense www.sensible.com
27 Ingredienti del test di usabilità Persone coinvolte 3 / 5 utenti a cui far testare il sito Un facilitatore Gli osservatori Cosa serve Una sala o ufficio con connessione Programma che registra schermo e voce Un copione da seguire
28 Dopo il test  Si fa il de-briefing Si fa una lista dei problemi individuati Si fa una cernita dei problemi più importanti Si progettano soluzioni (Almeno in teoria) si ri-tetsa
29 Perché funziona?  Perché tutti i siti hanno problemi di usabilità Perché i problemi seri di usabilità vengono subito a galla Perché è un’esperienza che rende un architetto dell’informazione      un architetto migliore
30 Test di usabilità del corso A2
Benvenuto, grazie per essere venuto. Il tuo aiuto per noi è davvero importante […] Ciò che facciamo si chiama Test di usabilità e serve a noi per capire se il nostro corso  on line funziona e se è facile da usare.Vogliamo capire se il sito si naviga bene, se il linguaggio è chiaro, se i comandi sono intuitivi da usare e così via […] Mentre usi il sito, pensa a voce alta: dicci cosa vedi, cosa cerchi di fare, e cosa pensi  […] Il test dura un’ora circa. Se hai qualche domanda durante il test, chiedi pure. Se sei stanco chiedi una pausa. Con il tuo permesso, registriamo lo schermo del computer durante il test […] 31 Lettera di benvenuto (Estratti)
Questionario 1 che riempie il facilitatore 1)Età, Provenienza, Titolo di studio, Lavoro 2)Quante ore la settimana usi internet? (casa+lavoro) 3) Che siti visiti (piacere+lavoro)? Esempi 4)Hai mai seguito un corso online?  […] 7) Ti è sembrato facile da seguire?		Sì	No	Poco   […] 9) Hai mai fatto una di queste operazioni on line? Biglietto del treno	Biglietto aereo	Acquisto con carta di credito		 Prenotazione albergo		Ricarica telefonica		Atro  32 (Estratti)
Attività 1  Osserva la Homepage, osserva tutte le sue parti, puoi scollare (andare su e giù), puoi passare con il mouse sopra gli oggetti, ma non puoi cliccare su nessun oggetto. Mentre osservi dimmi cosa vedi, cosa puoi fare, dove puoi andare, cosa puoi cliccare (senza cliccare!). Attività 2 Entra in Unità 1, vai al FILMATO e avvialo (fallo partire, premi play). Puoi stoppare il video, tornare indietro, riascoltare e interrompere quando vuoi. Attività 3 Entra nella sezione Grammatica e fai l’esercizio: “Di dove sei? da dove vieni?” Attività 4 Invia un messaggio ad un utente on line. 33 Attività da svolgere
Questionario 2 (Estratti) 1) Il sito è facile da usare 			1   2   3   4   5 (the website is easy to use)  2) Ho capitocosa fare 			1   2   3   4   5 ( I understood what to do)  […] 5) Il linguaggio è chiaro 			1   2   3   4   5(The languageisclear) 6) Scrivi le difficoltà (puoirispondereanche in inglese) Please write down the major difficulties (you can answer in English) 7)Scrivi due o trecosechevorresticambiare(puoirispondereanche in inglese)  Please write two or three things you would like to change in the website (you can answer in English)  […] 34
35 3 problemi di usabilità individuati Difficoltà con i pulsanti del player Lunghezza variabile dei campi da riempire negli esercizi Non cliccabilità delle icone libro in homepage
36
37

More Related Content

Similar to Dall'usabilità delle parole all'usabilità delle interfacce

User Experience su Mobile con Enrico Maioli.
User Experience su Mobile con Enrico Maioli.User Experience su Mobile con Enrico Maioli.
User Experience su Mobile con Enrico Maioli.semrush_webinars
 
Mobile user testing - IAsummit2013
Mobile user testing - IAsummit2013Mobile user testing - IAsummit2013
Mobile user testing - IAsummit2013Marco Buonvino
 
Laboratorio internet 10: Redazione dei contenuti
Laboratorio internet 10: Redazione dei contenutiLaboratorio internet 10: Redazione dei contenuti
Laboratorio internet 10: Redazione dei contenutiRoberto Polillo
 
Accessibilità - Adriano Cerocchi - SEO Training 2011
Accessibilità - Adriano Cerocchi - SEO Training 2011Accessibilità - Adriano Cerocchi - SEO Training 2011
Accessibilità - Adriano Cerocchi - SEO Training 2011SEO Training
 
Web Usability - 2 | WebMaster & WebDesigner
Web Usability - 2 | WebMaster & WebDesignerWeb Usability - 2 | WebMaster & WebDesigner
Web Usability - 2 | WebMaster & WebDesignerMatteo Magni
 
Web usability - 2 | WebMaster & WebDesigner
Web usability - 2 | WebMaster & WebDesignerWeb usability - 2 | WebMaster & WebDesigner
Web usability - 2 | WebMaster & WebDesignerMatteo Magni
 
Dalla UX alla UI: interfacce grafiche
Dalla UX alla UI: interfacce graficheDalla UX alla UI: interfacce grafiche
Dalla UX alla UI: interfacce graficheFrancesco Acerbi
 
8. Valutare la usabilita
8. Valutare la usabilita8. Valutare la usabilita
8. Valutare la usabilitaRoberto Polillo
 
Ascari Project (discorso)
Ascari Project (discorso)Ascari Project (discorso)
Ascari Project (discorso)Gabriele Genta
 
3. Progettare per l’utente
3. Progettare per l’utente3. Progettare per l’utente
3. Progettare per l’utenteRoberto Polillo
 
Android Mobile Apps , visione d'insieme
Android Mobile Apps , visione d'insiemeAndroid Mobile Apps , visione d'insieme
Android Mobile Apps , visione d'insiemeFrancesco De Simone
 
Users on social networks: Cinque scoperte fatte durante le attività user cent...
Users on social networks: Cinque scoperte fatte durante le attività user cent...Users on social networks: Cinque scoperte fatte durante le attività user cent...
Users on social networks: Cinque scoperte fatte durante le attività user cent...Luca Mascaro
 
Primo livello
Primo livelloPrimo livello
Primo livelloRanAway
 
Web usability - 4 | WebMaster & WebDesigner
Web usability - 4 | WebMaster & WebDesignerWeb usability - 4 | WebMaster & WebDesigner
Web usability - 4 | WebMaster & WebDesignerMatteo Magni
 
User Experience: teoria e pratica - UXFUN 05/09/2015 Cagliari
User Experience: teoria e pratica - UXFUN 05/09/2015 Cagliari User Experience: teoria e pratica - UXFUN 05/09/2015 Cagliari
User Experience: teoria e pratica - UXFUN 05/09/2015 Cagliari uxfun
 
Tesi Laurea Magistrale
Tesi Laurea MagistraleTesi Laurea Magistrale
Tesi Laurea MagistraleMatteo Vacca
 

Similar to Dall'usabilità delle parole all'usabilità delle interfacce (20)

User Experience su Mobile con Enrico Maioli.
User Experience su Mobile con Enrico Maioli.User Experience su Mobile con Enrico Maioli.
User Experience su Mobile con Enrico Maioli.
 
Mobile user testing - IAsummit2013
Mobile user testing - IAsummit2013Mobile user testing - IAsummit2013
Mobile user testing - IAsummit2013
 
Laboratorio internet 10: Redazione dei contenuti
Laboratorio internet 10: Redazione dei contenutiLaboratorio internet 10: Redazione dei contenuti
Laboratorio internet 10: Redazione dei contenuti
 
Accessibilità - Adriano Cerocchi - SEO Training 2011
Accessibilità - Adriano Cerocchi - SEO Training 2011Accessibilità - Adriano Cerocchi - SEO Training 2011
Accessibilità - Adriano Cerocchi - SEO Training 2011
 
Whidbey Day
Whidbey DayWhidbey Day
Whidbey Day
 
Web Usability - 2 | WebMaster & WebDesigner
Web Usability - 2 | WebMaster & WebDesignerWeb Usability - 2 | WebMaster & WebDesigner
Web Usability - 2 | WebMaster & WebDesigner
 
Web usability - 2 | WebMaster & WebDesigner
Web usability - 2 | WebMaster & WebDesignerWeb usability - 2 | WebMaster & WebDesigner
Web usability - 2 | WebMaster & WebDesigner
 
Dalla UX alla UI: interfacce grafiche
Dalla UX alla UI: interfacce graficheDalla UX alla UI: interfacce grafiche
Dalla UX alla UI: interfacce grafiche
 
Touchscreen iphone
Touchscreen   iphoneTouchscreen   iphone
Touchscreen iphone
 
8. Valutare la usabilita
8. Valutare la usabilita8. Valutare la usabilita
8. Valutare la usabilita
 
Ux for nerds
Ux for nerdsUx for nerds
Ux for nerds
 
Ascari Project (discorso)
Ascari Project (discorso)Ascari Project (discorso)
Ascari Project (discorso)
 
3. Progettare per l’utente
3. Progettare per l’utente3. Progettare per l’utente
3. Progettare per l’utente
 
Android Mobile Apps , visione d'insieme
Android Mobile Apps , visione d'insiemeAndroid Mobile Apps , visione d'insieme
Android Mobile Apps , visione d'insieme
 
Senior 2.0
Senior 2.0Senior 2.0
Senior 2.0
 
Users on social networks: Cinque scoperte fatte durante le attività user cent...
Users on social networks: Cinque scoperte fatte durante le attività user cent...Users on social networks: Cinque scoperte fatte durante le attività user cent...
Users on social networks: Cinque scoperte fatte durante le attività user cent...
 
Primo livello
Primo livelloPrimo livello
Primo livello
 
Web usability - 4 | WebMaster & WebDesigner
Web usability - 4 | WebMaster & WebDesignerWeb usability - 4 | WebMaster & WebDesigner
Web usability - 4 | WebMaster & WebDesigner
 
User Experience: teoria e pratica - UXFUN 05/09/2015 Cagliari
User Experience: teoria e pratica - UXFUN 05/09/2015 Cagliari User Experience: teoria e pratica - UXFUN 05/09/2015 Cagliari
User Experience: teoria e pratica - UXFUN 05/09/2015 Cagliari
 
Tesi Laurea Magistrale
Tesi Laurea MagistraleTesi Laurea Magistrale
Tesi Laurea Magistrale
 

Dall'usabilità delle parole all'usabilità delle interfacce

  • 1. 1 Dall’Usabilità delle Parole all’Usabilità delle Interfacce di Yvonne Bindi yvonnebindi@yahoo.it
  • 2. 2
  • 3. 3
  • 6. 6
  • 7. 7
  • 8. 8
  • 9. 9
  • 10. 10
  • 12. Bottoni svolgono un ruolo importante nel modo in cui i visitatori interagiscono con un sito web. Ne vedete in giro per la rete di forme, dimensioni e stili più disparati. Esistono alcune regole fondamentali da tenere a mente quando progettiamo (o scegliamo dei)dei bottoni. 12 La guerra dei bottoni
  • 13. Tipo player La forza della convenzione Immediatezza comunicativa Quasi nessuno può sbagliare Quasi… 13 Bottoni solo icone
  • 14. Niente della loro forma ci riconduce alla loro funzione Il testo, le parole, veicolano da sole il messaggio Parole di largo impiego e diffusione 14 Bottoni solo testo
  • 15.
  • 17. etc.15 Bottoni icona e testo insieme
  • 18. 16
  • 19. Ad ogni scopo i suoi bottoni 17
  • 20. Quello che conta davvero Che si capisca che si tratta di un bottone Che si capisca a cosa serve Testo Icona Posizione Aspetto Comportamento Posizione 18
  • 21. 19 Pulsanti di default di Moodle
  • 22. 20 I nostri pulsanti
  • 23. 21
  • 24. 22
  • 25. 23
  • 26. 24 Come valutare l’usabilità Valutazioni euristiche La valutazione è eseguita da esperti di usabilità Test di usabilità Si effettuano osservando un campione di utenti mentre utilizza il sistema. Metodo Krug Le 10 regole di Nielsen Sinergia tra i due tipi di valutazione
  • 27. Le 10 regole d’oro di Nielsen Visibilità dello stato del sistema Corrispondenza fra il mondo reale e il sistema Libertà e controllo da parte degli utenti Consistenza e standard Prevenzione degli errori Riconoscere piuttosto che ricordare Flessibilità ed efficienza d’uso Design minimalista ed estetico Aiutare gli utenti a riconoscere gli errori, diagnosticarli e correggerli Guida e documentazione useit.com: Jakob Nielsen's Website 25
  • 28. 26 Il metodo di Steve Krug Test di usabilità fai da te Eng Ita Osservare delle persone mentre usano il nostro prodotto: qualcosa che abbiamo disegnato, creato o costruito. Per capire se il prodotto è facile da usare e cosa si può fare per migliorarlo. Advanced Common Sense www.sensible.com
  • 29. 27 Ingredienti del test di usabilità Persone coinvolte 3 / 5 utenti a cui far testare il sito Un facilitatore Gli osservatori Cosa serve Una sala o ufficio con connessione Programma che registra schermo e voce Un copione da seguire
  • 30. 28 Dopo il test Si fa il de-briefing Si fa una lista dei problemi individuati Si fa una cernita dei problemi più importanti Si progettano soluzioni (Almeno in teoria) si ri-tetsa
  • 31. 29 Perché funziona? Perché tutti i siti hanno problemi di usabilità Perché i problemi seri di usabilità vengono subito a galla Perché è un’esperienza che rende un architetto dell’informazione un architetto migliore
  • 32. 30 Test di usabilità del corso A2
  • 33. Benvenuto, grazie per essere venuto. Il tuo aiuto per noi è davvero importante […] Ciò che facciamo si chiama Test di usabilità e serve a noi per capire se il nostro corso on line funziona e se è facile da usare.Vogliamo capire se il sito si naviga bene, se il linguaggio è chiaro, se i comandi sono intuitivi da usare e così via […] Mentre usi il sito, pensa a voce alta: dicci cosa vedi, cosa cerchi di fare, e cosa pensi […] Il test dura un’ora circa. Se hai qualche domanda durante il test, chiedi pure. Se sei stanco chiedi una pausa. Con il tuo permesso, registriamo lo schermo del computer durante il test […] 31 Lettera di benvenuto (Estratti)
  • 34. Questionario 1 che riempie il facilitatore 1)Età, Provenienza, Titolo di studio, Lavoro 2)Quante ore la settimana usi internet? (casa+lavoro) 3) Che siti visiti (piacere+lavoro)? Esempi 4)Hai mai seguito un corso online? […] 7) Ti è sembrato facile da seguire? Sì No Poco […] 9) Hai mai fatto una di queste operazioni on line? Biglietto del treno Biglietto aereo Acquisto con carta di credito Prenotazione albergo Ricarica telefonica Atro 32 (Estratti)
  • 35. Attività 1 Osserva la Homepage, osserva tutte le sue parti, puoi scollare (andare su e giù), puoi passare con il mouse sopra gli oggetti, ma non puoi cliccare su nessun oggetto. Mentre osservi dimmi cosa vedi, cosa puoi fare, dove puoi andare, cosa puoi cliccare (senza cliccare!). Attività 2 Entra in Unità 1, vai al FILMATO e avvialo (fallo partire, premi play). Puoi stoppare il video, tornare indietro, riascoltare e interrompere quando vuoi. Attività 3 Entra nella sezione Grammatica e fai l’esercizio: “Di dove sei? da dove vieni?” Attività 4 Invia un messaggio ad un utente on line. 33 Attività da svolgere
  • 36. Questionario 2 (Estratti) 1) Il sito è facile da usare 1 2 3 4 5 (the website is easy to use) 2) Ho capitocosa fare 1 2 3 4 5 ( I understood what to do) […] 5) Il linguaggio è chiaro 1 2 3 4 5(The languageisclear) 6) Scrivi le difficoltà (puoirispondereanche in inglese) Please write down the major difficulties (you can answer in English) 7)Scrivi due o trecosechevorresticambiare(puoirispondereanche in inglese) Please write two or three things you would like to change in the website (you can answer in English) […] 34
  • 37. 35 3 problemi di usabilità individuati Difficoltà con i pulsanti del player Lunghezza variabile dei campi da riempire negli esercizi Non cliccabilità delle icone libro in homepage
  • 38. 36
  • 39. 37
  • 40. 38
  • 41. 39 Grazie Yvonne Bindi yvonnebindi@yahoo.it