Mobile user testing - IAsummit2013
-
Upload
marco-buonvino -
Category
Design
-
view
568 -
download
1
description
Transcript of Mobile user testing - IAsummit2013
Mobile user testingHurry! Let’s test this UI!
VII Summit Italiano di Architettura dell’Informazione / Bologna 15 –16 novembre 2013
By: Marco Buonvino
Who am I?
They say I am a UX designer...
In realtà mi diverto a pensare a metodi di interazione e a come testarli con l’aiuto degli utenti!
Hi!
@marcobuonvino
Utenti nel processo di design
La partecipazione di utenti nel design è vantaggiosa!
● Early testing
● Design più sicuro, basato su dati
● Migliore gestione di correzioni e modifiche
● Controllo proattivo
Il test di usabilitàovvero: “Come ti metto in discussione il design”
Cosa è un test di usabilità● Strumento a supporto
della progettazione
● Indicazioni da utenti reali
● Alta qualità di risultati per costi contenuti
● Varie metodologie adattabili al contesto
I ruoli in un test di usabilità
Facilitatoreillustra i task, assiste l’utente, sprona il metodo thinking aloud
Utenteutilizza l’interfaccia, svolge i task assegnati
Osservatoriraccolgono indicazioni sui comportamenti e sui percorsi di interazione dell’utente
Test, test, test!Qualitativi
● Svolgimento task ○ desktop○ mobile devices○ paper prototypes
● Card sorting
Quantitativi
● Eyetracking
● A/B o multivariate testing
Quante persone?
“Servono tante persone per avere risultati utili!”
WRONG!!
Quante persone?
Nielsen, Why You Only Need to Test with 5 Users, Alertbox, 2000Nielsen, Card Sorting: How Many Users to Test, Alertbox, 2004Tullis and Wood, How Many Users Are Enough for a Card-Sorting Study?, 2004
Steve Krug, Rocket Surgery Made Easy, New Riders, 2010Nielsen, How Many Test Users in a Usability Study?, Alertbox, 2014
x ~5 x ~15 x ~30
Svolgimento task● desktop ● mobile● paper prototyping
Card sorting Eyetracking
Risultati di un test
● Identificazione dei problemi di usabilità riscontrati
● Suddivisione per gravità e priorità di intervento
● Raccomandazioni per la fase di UI design
Cattura flessibile
● Interazione free-hand
● Sia portrait che landscape
● Cattura del volto e dell’interazione
● Braccio flessibile
Reflectorapphttp://www.airsquirrels.com/reflector/
E in più: screen mirroring
Airdroidhttp://www.airdroid.com
Google Glass prototyping
http://ed.ted.com/lessons/rapid-prototyping-google-glass-tom-chi
Prototyping rules1. Find the quickest way
to experience
2. Doing is the best kind of thinking
3. Use materials that move at the speed of thought to maximize your rate of learning
by Tom Chi
Case historyMobile usability testing
The background
Clientesettore banking
Oggettoconcorso estivo a premi, con quiz settimanali, per sponsorizzare un nuovo prodotto
Obiettivo testare l’interfaccia con utenti reali, su più dispositivi
Esperienza responsive
Interazione multipiattaforma
v
v
v
v
How to test it
Obiettivoidentificare problemi usabilità e di interazione
Main challengemetodologia ‘responsive’
Suddivisione campione: totale 9 utenti
Here comes the method
3 users 3 users 3 users
The test
Rischio di usabilità: Scroll interpretato come Tap
Ambiguità aree attive
Allegati PDF desktop
Desktop - una voce di menu apre un PDF in altra tab:problema del ritorno alla tab iniziale.
Allegati PDF mobile (I)
iOS - la voce di menu apre un PDF in altra tab
Allegati PDF mobile (II)
Android - salvataggio del PDF come allegato: poca visibilità dello stato del sistema
Considerazioni
Problemi di interazione● Form su touchscreen davvero noiosi
● Smartphone: schermo piccolo, poca voglia di leggere tutti i contenuti
Che ci portiamo a casa?
Attenzione alle aree di interazione: evitare le ambiguità!
Meanwhile, in iOS7...
Swipe up da appena fuori il viewport = comparsa pannello accesso veloce
Swipe up da dentro il
viewport = scroll
Che ci portiamo a casa?
Input a tastiera non sono sempre il massimo dell’usabilità: bisogna semplificare la vita
Per esempio inserendo il codice fiscale o un IBAN
Metodi di input
Riconoscimento vocale, inserimento testo o ricerca assistita.
(Qualche problema con la punteggiatura e privacy!)
Un altro metodo...
Paper prototyping...basta qualche pezzo di carta.
Paper prototyping
Per fare test di usabilità non serve una centrale nucleare
A volte basta solo qualche pezzo di carta
Paper prototyping
← You can test
Paper prototyping
→ You get results
Paper prototyping test● Particolare test di usabilità
● Rapido, preliminare
● Molto vantaggioso per testare sketch e wireframe veloci
Un ruolo extra
Il Computersimula la risposta dell’interfaccia, mostrando gli stati e le relative pagine, a seguito dell’interazione dell’utente
Beep!
Un esempio
● L’utente indica la propria interazione con una penna o una matita
● Il “computer” aggiorna il sistema posizionando foglietti
https://www.youtube.com/watch?v=Bq1rkVTZLtU
And so...
● Testare quanto prima (e frequentemente)
● Verificare ipotesi di progettazione su ciò che si ha a disposizione
● Massimizzare il risultato sfruttando tecniche rapide
POP - Prototyping on Paperhttps://popapp.in
Ancora più veloci (e belle)!
Mockabillyhttp://www.mockabilly.com
Further reading● Luke Wroblewski
○ Mobile First
● Ethan Marcotte○ Responsive Web Design
● Our Mobile Planet: Italia, Google[http://services.google.com/fh/files/misc/omp-2013-it-local.pdf]
● Steve Krug,○ “Don’t Make Me Think”, ○ “Rocket Surgery Made
Easy”
● Nielsen & Loranger, ○ “Web Usability 2.0”
● Donald Norman,○ “La caffettiera del
masochista”, ○ “Emotional Design”, ○ “Gestire la complessità”
Questions?Grazie per l’attenzione! :D
VII Summit Italiano di Architettura dell’Informazione / Bologna 15 –16 novembre 2013
@marcobuonvino