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

Ci hanno aiutato:

Andrea Galanti (Graphic Designer)

Jessica Paoli (Editor)

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

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.

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

Un esempio di oggetto non “usabile”, le cosiddette “Norman Doors”

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.

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

La User Experience tiene conto dell’utente, di come e dove utilizza un prodotto

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”.

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

Un oggetto deve suggerire all’utente il suo uso: un bottone, deve essere premuto.

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 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

Lo User Experience Design è come un ombrello sotto cui si trovano diverse discipline

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).

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

Lo UX design è un processo ciclico e iterativo

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.

! !10

Un esempio di Task Analysis: l’utente deve iscriversi alla newsletter

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.

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

Le Personas devono essere molto dettagliate e accompagnate da foto, in modo da rendere l’utente fittizio reale.

userexperience.boutique

oggetti visibili, tangibili e condivisibili quello che abbiamo solo

ipotizzato.

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.

! !12

Ritagli, post-it, appunti: la moodboard deve ispirare

Carta e penna sono due strumenti immediati per dare sfogo alle prime idee

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.

! !13

Il wireframe viene fatto anche per la versione mobile

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.

! !14

Esempio di mockup grafico per app mobile

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.

! !15

Nel test di usabilità l’utente viene direttamente coinvolto nella valutazione

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