User Experience Design
Definizioni, principi e tecniche essenziali
Autori: Jacopo Pasquini, Simone Giomi
userexperience.boutique
userexperience.boutique
Indice
Introduzione
1
Che cosa è la UX
3
UX, UI o IXD, IA?
5
Che cosa fa lo User Experience Designer?
7
Siti web: 3 fasi per progettarli, 1 disciplina per domarli
9
Le 10 Euristiche
16
UX Mantra
17
Conclusioni
18
userexperience.boutique
Autori
Jacopo Pasquini
Consulente e docente specializzato in marketing
e comunicazione digitale, si occupa di Web
Marketing e User Experience Design.
www.doctorbrand.it
Simone Giomi
User experience designer ed esperto di usabilità
con 10 anni di esperienza nella progettazione e
valutazione di interfacce ed esperienze d’uso per
sistemi digitali interattivi.
www.simonegiomi.com
Ci hanno aiutato:
Andrea Galanti (Graphic Designer)
Jessica Paoli (Editor)
userexperience.boutique
Introduzione
“Se un sito funziona non se ne accorge nessuno: è quando non funziona che se ne
accorgono tutti (Sofia Postai)”
E forse è proprio per questo che sei arrivato fino a qui: perché hai
bisogno di sapere come rendere il tuo sito web a prova di utente. La
soluzione, spesso completamente ignorata, è un approccio alla
progettazione che ha un nome ben preciso: User Experience Design.
Un esempio di oggetto non “usabile”, le
cosiddette “Norman Doors”
La UX è una disciplina pervasiva, presente in ogni ambito della nostra
vita analogica e digitale. Una pratica multidisciplinare che sta alla base
!
della progettazione di qualsiasi prodotto.
!1
userexperience.boutique
Ancora buio totale? Facciamo subito qualche esempio. Quante volte avete
spinto una porta su cui c’era scritto “tirare”? Beh, quella porta non aveva
una buona esperienza d’uso.
Se come ci insegna Norman è così facile sbagliare con oggetti semplici
come le porte, immaginatevi cosa può succedere con strumenti
complessi come siti web, applicazioni mobile, e-commerce, dove un
semplice errore può influire negativamente sul soggiorno di un utente del
vostro sito e inesorabilmente sulle performance della vostra presenza
online.
D’altra parte, se sei arrivato fino a qui, è proprio perché vuoi sapere come
aumentare le visite e il tempo di permanenza sul tuo sito web, perché
vuoi aumentare le conversioni e la fidelizzazione verso il tuo brand,
perché vuoi ridurre le lamentele e, di conseguenza, le richieste di
assistenza tecnica sui tuoi prodotti o servizi. In altre parole vuoi
migliorare la customer satisfaction dei tuoi clienti. Per fortuna sei capitato
!
nel posto giusto: non è magia, è User Experience Design.
!2
userexperience.boutique
Che cosa è la UX?
“UX” sta per “User Experience” cioè “esperienza d’uso”. Cercando di
definire nel modo più sintetico possibile questa disciplina possiamo
affermare che essa rappresenta una pratica di design dove l’esperienza
d’uso di un prodotto o servizio viene progettata a partire dai bisogni,
dalle aspettative e dagli obiettivi degli utenti.
La User Experience tiene conto dell’utente, di
come e dove utilizza un prodotto
Perché prodotto o servizio, e non solo sito web e applicazioni digitali?
Perché lo User Experience Design è ovunque: è qualcosa di intangibile e
trasversale che porta un utilizzatore di qualsiasi oggetto fisico o digitale
alla soluzione immediata al suo problema con il minimo sforzo. Non a
caso abbiamo preso ad esempio un oggetto super quotidiano come le
Norman doors chiamate così in onore di Donald Norman guru e padre
!
fondatore dell’UX design.
!3
userexperience.boutique
Obiettivo dello User Experience Design è rendere semplice e chiaro
tutto ciò che è complesso: il prodotto o servizio deve suggerire la
modalità di utilizzo per accorciare la curva dell’apprendimento
dell’utente, caratteristica più importante che mai quando parliamo di
web.
Ad esempio, un “bottone” - sia esso fisico o digitale - per essere usato
facilmente dovrebbe suggerire l’azione di essere premuto (la sua
“pulsantosità” per usare un buffo neologismo).
Questa regola affonda le radici in uno dei principi più importanti di
usabilità: in gergo tecnico si parla infatti di affordance. Quando nei
sistemi interattivi (o sistemi uomo-macchina) questa caratteristica viene a
mancare, “Houston abbiamo un problema”.
Un oggetto deve suggerire all’utente il suo uso:
un bottone, deve essere premuto.
Per raggiungere l’obiettivo principale di rendere semplice e unica
un’esperienza d’uso per l’utente, lo UX Design mette sempre la persona
al centro, cercando di comprendere la sua mente (come pensa, a cosa
presta attenzione, come sceglie) e il suo cuore (cosa lo emoziona, a cosa si
affeziona) attraverso un processo continuo fatto di analisi, progettazione
!
e valutazione.
!4
userexperience.boutique
UX, UI o IXD, IA?
Abbiamo detto che la User Experience è strettamente legata ai pensieri e
alle emozioni degli utenti durante l’uso di un prodotto: sentimenti,
riflessioni, aspettative, frustrazioni.
Per affrontare questo ampio spettro di variabili nasce lo User Experience
Design (UXD). Una metodologia che, in definitiva, è il risultato di più
discipline che concorrono insieme verso un unico scopo: favorire il
successo di un prodotto o servizio. In letteratura esistono molte
discipline similari che danno vita ad altrettanti acronimi e che spesso
creano confusione per chi si approccia per la prima volta design centrato
sugli utenti.
Proviamo a fare chiarezza:
● UI (User Interface) Design: riguarda la progettazione della
componenti più estetiche (più “superficiali”) dell'interfaccia. Nel
caso di siti web, sì, stiamo proprio parlando di ciò che viene
comunemente indicato con il termine ”grafica” o talvolta “web
design”.
● IXD (Interaction Design): riguarda la progettazione
dell'interazione all’interno di un sistema uomo-macchina, dove in
estrema sintesi la componente umana si relaziona con la macchina
attraverso uno scambio di input e di output (questa componente
viene infatti spesso chiamata anche interazione uomo-macchina).
● IA (Information Architecture): è la disciplina che riguarda
l’organizzazione, la classificazione e l’etichettatura delle
informazioni di un sito web. Serve per progettare contenuti
!
trovabili e menu di navigazione intuitivi.
!5
userexperience.boutique
● Usabilità: è l’unica componente che non viene sintetizzata con una
sigla (per fortuna!). Essa riguarda l’efficacia, l’efficienza e la
soddisfazione con cui specificati utenti raggiungono specificati
obiettivi in particolari ambienti. Per dirla con un motto: “Un
prodotto usabile, non dovrebbe aver bisogno di un manuale di
istruzioni”.
Tutto ciò dovrebbe aiutarvi a capire un punto molto importante e spesso
travisato della materia: lo User Experience Design non riguarda solo
l’aspetto grafico di un sito web o di un’app.
Dal punto di vista dell’esperienza utente la grafica è solo la parte finale del
design, di cui bisogna occuparsi solo dopo aver progettato lo scheletro e
la struttura logica dello strumento. Nel caso dei siti web la grafica (UI)
viene dopo la fase di mappatura dei contenuti e l’architettura delle
informazioni (IA), del disegno schematico delle singole pagine, dei flussi
di navigazione tra di esse (ID) .
Perché un sito web di successo deve essere prima di tutto utile e
!
funzionale, poi bello.
!6
userexperience.boutique
Che cosa fa lo User Experience Designer?
Lo User Experience Designer è colui che si occupa principalmente di:
● Comprendere i bisogni dell’utente;
● Comprendere i bisogni dell’azienda;
● Fornire la soluzione migliore per rispondere a questi bisogni.
Lo User Experience Design è come un ombrello
sotto cui si trovano diverse discipline
Lo UX Designer si domanda continuamente: chi userà davvero il
prodotto finale? Quali attività dovrà supportare lo strumento per
consentire all’utente di raggiungere i suoi obiettivi? In quale contesto il
prodotto sarà utilizzato?
Lo UX Designer è quella persona che partecipa allo sviluppo del prodotto
!
in tutte le fasi del processo di design:
!7
userexperience.boutique
• Durante l’analisi esegue la profilazione degli utenti e la mappatura delle
attività;
• Durante la progettazione concepisce la struttura generale del prodotto a
livello di funzionalità, navigazione e architettura dell’informazione;
• Durante la valutazione testa con gli utenti gli avanzamenti dello
sviluppo per garantire che le soluzioni ideate siano efficaci e facilmente
comprensibili.
Per fare tutto questo lo User Experience Designer deve padroneggiare
competenze diverse: dal marketing alla psicologia, dall’ergonomia alla
tecnologia. Da questo punto di vista il suo apporto alla progettazione è di
livello alto perché si pone sia come designer che come supervisore e
facilitatore dello sviluppo del prodotto. Da lui dipende davvero il
successo di un prodotto o di un servizio: con la sua visione d’insieme
accompagna e sostiene il lavoro delle altre figure coinvolte nel progetto,
aiutando sia gli strategist nella fase iniziale di concept del prodotto sia gli
!
“operativi” (grafici, developer) nell’assicurare la corretta implementazione
!8
userexperience.boutique
Siti web: 3 fasi per progettarli, 1 disciplina
per domarli
Abbiamo visto che lo User Experience Design è un’attività che attraversa
il ciclo di vita del prodotto dall’inizio alla fine, un processo in cui si
alternano, in un ciclo continuo, principalmente tre fasi: ricerca e analisi,
progettazione e valutazione.
Ricerca e Analisi
Ogni progettazione che si rispetti inizia con una fase di ricerca e analisi,
in cui vengono indagati sia i bisogni degli utenti sia i requisiti del
prodotto (nel caso della web usability di un sito web o un’app).
Lo UX design è un processo ciclico e iterativo
L’analisi degli utenti e dei loro bisogni serve principalmente per capire
chi è, cosa fa, cosa cerca e in quale contesto si muove il nostro target di
riferimento. Spesso sono presenti più segmenti di utenza che devono
!
essere tenuti in considerazione con i loro diversi bisogni, comportamenti
!9
userexperience.boutique
e aspettative. La ricerca sugli utenti viene condotta dalla combinazione di
dati provenienti:
● Esternamente, da ricerche di mercato, interviste e focus group
realizzati ad hoc per il prodotto o servizio di nostro interesse;
● Internamente, da database aziendali e dagli strumenti di analisi del
sito web (analytics e strumenti di tracking) e dei social network
proprietari.
L’analisi dei requisiti del prodotto invece inizia con un benchmark sui
competitor, ovvero un’analisi comparativa della concorrenza per
indagare vantaggi competitivi, aree di miglioramento e best practices da
cui trarre ispirazione.
Strumenti e tecniche
● Task Analysis: serve per mappare con precisione e completezza
tutti gli step necessari all’utente per svolgere un’attività legata al
raggiungimento di un certo obiettivo.
!
Un esempio di Task Analysis: l’utente deve
iscriversi alla newsletter
!10
userexperience.boutique
● Personas e Scenari: due strumenti utilissimi descrivere i diversi
profili degli utenti target e le diverse casistiche di utilizzo del
prodotto. Le personas sono personaggi fittizi creati su dati reali,
rappresentativi del target, mentre gli scenari descrivono come gli
utenti userebbero un prodotto per raggiungere un obiettivo in
particolari situazioni, solitamente le più frequenti o critiche.
Le Personas devono essere molto dettagliate e accompagnate da
foto, in modo da rendere l’utente fittizio reale.
Progettazione
Solo dopo aver inquadrato con precisione i reali bisogni e
comportamenti degli utenti possiamo iniziare a progettare, cercando
soluzioni di design in grado di soddisfare i requisiti individuati. In questa
fase non c’è una regola precisa per fare buon design: tutto comincia
dall’esplorazione di idee. Idee che vengono “generate” dal team durante
sessioni di brainstorming e attraverso la creazione di moodboard,
bacheche fisiche o digitali dove appuntare tutte le ispirazioni nate nella
fase creativa del design.
Una volta generate un numero sufficiente di idee, esse vengono
!
selezionate e gradualmente prototipate. È il momento di concretizzare in
!11
userexperience.boutique
oggetti visibili, tangibili e condivisibili quello che abbiamo solo
ipotizzato.
Ritagli, post-it, appunti: la moodboard deve ispirare
Strumenti
● Sketch cartacei: le idee iniziano a prendere forma da semplici, ma
utilissimi “scarabocchi” fatti con carta e penna: sono immediati da
realizzare, veloci da modificare e facili comunicare, uno strumento
potente (a basso impatto tecnologico!) da cui nessun designer può
prescindere.
!
Carta e penna sono due strumenti immediati
per dare sfogo alle prime idee
!12
userexperience.boutique
● Wireframe: una volta raccolti i primi feedback sugli sketch si passa
alla creazione di modelli più concreti, attraverso il disegno dei
wireframe, schemi di pagina “in fil di ferro” (o, per capirsi meglio, in
bianco e nero) realizzati con appositi software di design. Essi
rappresentano lo scheletro e l’impianto logico del prodotto. Nel
wireframe la struttura e il contenuto, la gerarchia, l’interfaccia e i
comportamenti del prodotto iniziano a prendere forma. I disegni
sono arricchiti da annotazioni che ne descrivono i dettagli, le
funzionalità e i cambiamenti senza intervenire, per il momento, nel
campo della veste grafica.
!
Il wireframe viene fatto anche per la versione mobile
!13
userexperience.boutique
● Mockup grafici: una volta “sigillata” la struttura della pagine dei
wireframe è possibile procedere alla parte visual e “artistica” della
progettazione. Il mockup rappresenta infatti la proposta grafica del
sito web, non ancora definitiva ma contenente il look & feel del
prodotto. Come avevamo accennato sopra, insomma, la scelta del
web design è l’ultimo step nella progettazione della user
experience, e non la prima, come spesso accade.
!
Esempio di mockup grafico per app mobile
!14
userexperience.boutique
Valutazione
Last but not the least, la valutazione è la fase più importante,
complementare e pervasiva in ogni fase della progettazione della UX. La
valutazione infatti avviene durante tutti gli stadi proprio per avvicinarsi
alla migliore soluzione e non perdere mai di vista l’obiettivo principale:
l’utente.
!
Nel test di usabilità l’utente viene direttamente coinvolto
nella valutazione
!15
userexperience.boutique
Le 10 euristiche
Le euristiche più utilizzate e più famose sono quelle teorizzate da Molich
e Nielsen, due guru dello User Experience Design, applicabili alla
progettazione di un qualsiasi prodotto o servizio. Mentre sul web le
!
euristiche si fanno più specifiche:
!16
userexperience.boutique
UX Mantra
Ovvero le 6 frasi da imparare a memoria e da ripetere tutte le sere prima
di andare a letto… :)
“La sapienza è figliola dell’esperienza”
(Leonardo da Vinci)
“L’interfaccia utente è come una barzelletta:
se devi spiegarla c’è qualcosa che non va”
(Anonimo)
“I dettagli non sono dettagli.
Sono il design”
(Charles Eames)
“La perfezione è raggiunta non quando non c’è più niente da aggiungere,
ma quando non c’è più niente da togliere”
(Antoine de Saint-Exupéry)
“La trovabilità procede l’usabilità.
Non puoi usare una cosa che non trovi”
( Jakob Nielsen)
“Less, but better”
!
(Dieter Rams)
!17
userexperience.boutique
Conclusioni
Abbiamo visto che cos’è lo User Experience Design e in cosa si
differenzia dalle altre discipline, come progettare un’esperienza utente di
successo e il ruolo che un UX Designer riveste nei progetti.
Abbiamo visto quindi come garantire all’utente un’esperienza migliore
sul web affinché:
● Possa tornare su un sito web, portando un aumento delle visite e
dei visitatori di ritorno;
● Possa trascorrere più tempo su un sito web o un’app, aumentando il
tempo di permanenza e diminuendo la frequenza di rimbalzo sul
sito web;
● Possa effettuare un acquisto o una registrazione in sicurezza e senza
preoccupazioni, permettendo un conseguente aumento della
fiducia e quindi delle conversioni per il brand;
● Voglia condividere la sua esperienza anche con altri, contribuendo
così all’aumento dei visitatori sul sito web e relativamente della
brand awareness.
Abbiamo visto che lo User Experience Design può essere di grande aiuto
per la progettazione o la riprogettazione di un prodotto o servizio, sia
analogico che digitale. Ma questa è soltanto la punta dell’iceberg…
!
Buona UX!
!18
Corsi UX Design. 20€ per te!
Milano, Firenze, Roma
Scrivi “EBOOK20” nel campo coupon del modulo di
iscrizione a qualsiasi nostro corso e lo sconto 20€ è tuo!
COUPON SCONTO 20€
userexperience.boutique
Libro Web Usability
Guida completa alla UX e all’usabilità
Autori: Jacopo Pasquini e Simone Giomi
Editore: Hoepli (26 giugno 2014)
Collana: WebPro+
Copertina flessibile: 248 pagine
ISBN-10: 8820363399
ISBN-13: 978-8820363390
EBOOK 14,99€
CARTACEO 21,17€
userexperience.boutique
© 2016 UX Boutique
Tutti i diritti riservati.
userexperience.boutique