Sometimes I am asked to evangelize about UX (User experience Design). Here I list a series of activities I advice for business companies and communication agencies in Italy. 1. Pianificazione e scoperta Pianificazione UX Intervista stakeholders Workshop Brief di progetto 2. Analisi e ricerca Info mancanti Ricerca con utenti Utenti tipo e contesti Analisi competitiva UX Best practices Patterns di contenuto 3. Design Debrief Principi di design Wireframe lo-fi Scelta dei wireframe lo-fi Flussi Wireframes Microinterazioni Patterns UX 4. Validazione Prototipi Valutazione Test di usabilità Allineamento periodico

1. Attività UXWHITE LABEL
Giuseppe Burdo
UX, IxD
giuseppe.burdo@gmail.com

2. UX Intro
UX è l’acronimo di “User experience” ed
è un’insieme di attività il cui obiettivo è di
progettare soluzioni efficaci, tenendo a
mente i bisogni degli utenti, del business
e delle possibilità tecnologiche.

3. Dove si vede la UX
La user experience riguarda l’interazione
con qualsiasi “touchpoint”, ovvero ogni
momento di contatto con il servizio
offerto da un brand (dispositivo digitale,
un prodotto fisico, un interlocutore, uno
spazio fisico, etc.).

4. Perché è importante
Il rischio maggiore è di realizzare
qualcosa che non dia le aspettative
previste, sebbene dopo aver investito
molto tempo e risorse.

5. Design thinking
Indipendentemente dal prodotto finale,
ci sono due fasi: capire il giusto
problema e utilizzare la giusta soluzione.
Questo approccio si chiama “Design
thinking” ed è una forma mentis
utilizzata anche nel business.
Creare delle scelte
Fare delle scelte
A. Ricerca
B. Progetto
A B

6. Soluzione
Che si tratti di un’app o un sito web, di
un negozio interattivo o realtà virtuale,
la differenza principale sta nella fase di
progettazione, dove la tecnologia ha un
ruolo di differenziazione.

7. Collaborazione
La progettazione richiede momenti di
incontro, a volte molto collaborativi
come “workshops” e “design sprints”
soprattutto se si è nella fase iniziale di
un prodotto.
https://designsprintkit.withgoogle.com/

8. Fasi di lavoro UX
1. Pianificazione e scoperta
Pianificazione UX
Intervista stakeholders
Workshop
Brief di progetto
2. Analisi e ricerca
Info mancanti
Ricerca con utenti
Utenti tipo e contesti
Analisi competitiva UX
Best practices
Patterns di contenuto
3. Design
Debrief
Principi di design
Wireframe lo-fi
Scelta dei wireframe lo-fi
Flussi
Wireframes
Microinterazioni
Patterns UX
4. Validazione
Prototipi
Valutazione
Test di usabilità
Allineamento periodico

9. 1. Pianificazione e scoperta
Pianificazione UX
Intervista stakeholders
Workshop
Brief di progetto

10. Pianificazione UX
Comprendere le attività da fare a
seconda del progetto, contesto,
obiettivi, budget, etc.
https://trello.com/c/astaySkK/2-ux-project-plan

11. Intervista stakeholders
Conoscere le priorità del team di lavoro,
fornitori, partner, investitori, chi decide
http://boxesandarrows.com/a-stakeholder-interview-checklist/

12. Workshop
Allineamento su come funziona al
momento, cosa non funziona e quale
sarebbe lo stato ideale da raggiungere
http://rosenfeldmedia.com/ux-team-of-one/ix-method-of-the-week-opportunity-workshop/
http://rosenfeldmedia.com/ux-team-of-one/ux-method-of-the-week-strategy-workshop/

13. Brief di progetto
Identificare le aspettative del progetto e
le modalità di lavoro, i tempi, i ruoli
https://www.nomensa.com/blog/2016/how-write-great-ux-brief

14. 2. Analisi e ricerca
Info mancanti
Ricerca con utenti
Utenti tipo e contesti
Analisi competitiva UX
Best practices
Patterns di contenuto

15. Info mancanti
Definizione degli aspetti ancora non
conosciuti e piano per ottenere le
informazioni utili.
http://rosenfeldmedia.com/ux-team-of-one/ux-method-of-the-week-learning-plan

16. Ricerca con utenti
Sondare con gli utenti in maniera diretta
(intervista sul luogo, in laboratorio, in
remoto) o indiretta tramite i dati.
https://www.usability.gov/what-and-why/user-research.html

17. Utenti tipo e contesti
Raggruppare le persone con motivazioni
e bisogni simili e conoscere i contesti e
le situazioni in cui si può predirre il
comportamento utente
https://blog.intercom.com/using-job-stories-design-features-ui-ux

18. Analisi competitiva UX
Comparare il proprio servizio, o quello di
riferimento con altri competitors tramite
una mappatura visiva e metriche.
Questa attività può essere supportata da
social listening, sul proprio servizio o di
competitors.
https://medium.com/@tomwray13/5-whats-a-heuristic-markup-1db09422de22

19. Best practices
Identificare i trend e le soluzioni nello
stesso mercato di riferimento o in altri
che possono tornare utili.
http://www.goodui.org https://www.ventureharbour.com/form-design-best-practices

20. Patterns di contenuto
Mappare la struttura editoriale del
servizio già offerto.
http://v3.danielmall.com/articles/content-display-patterns/

21. 3. Design
Debrief
Principi di design
Wireframe lo-fi
Scelta dei wireframe lo-fi
Flussi
Wireframes
Microinterazioni
Patterns UX

22. Debrief
Rivedere il brief di progetto e fornire
delle indicazioni chiare sugli interventi
da fare, come utenti di riferimento,
funzionalità e personalità, attività
possibili per l’utente.
https://blinkux.com/blog/debrief-2/

23. Principi di design
Capisaldi per la user experience, di
riferimento al team e di percezione per
stakeholders e utenti finali
https://www.gov.uk/design-principles

24. Wireframe lo-fi
Scheletro di base su come
rappresentare i contenuti e funzionalità.
Il vantaggio è di poter creare
velocemente diverse versioni e di
cambiarle in corso.
https://www.smashingmagazine.com/2014/10/the-skeptics-guide-to-low-fidelity-prototyping

25. Scelta dei wireframe lo-fi
Identificazione dei patterns UX che
meglio rispondono agli obiettivi.

26. Flussi
Collegare tutte le schermate così da
avere un quadro chiaro dei “journeys”
dell’utente, dove entra e dove atterra per
ogni collegamento.
https://medium.com/inspiration-supply/wireframes-by-top-ux-designers-d6922d34ddb8

27. Wireframes
Rappresentazioni visive comprensibili
da chiunque e che servono come base
per il resto del team (grafici,
sviluppatori) e di comunicazione
indiretta per documentazione o con
stakeholders e cliente.
https://medium.com/inspiration-supply/wireframes-by-top-ux-designers-d6922d34ddb8

28. Microinterazioni
Assicurarsi di ricevere un feedback da
un’azione, di trarne piacere e di
riconoscere il brand.
http://zurb.com/article/1454/you-re-thinking-too-big-create-impact-wit

29. Pattern UX
Linee guida su come progettare e quindi
perseguire i bisogni del business e degli
utenti tramite l’interfaccia. Non sono da
confondere con i pattern UI che si
esprimono con la rappresentazione
visiva e di brand.
https://www.gov.uk/service-manual/design#find-patterns

30. 4. Validazione
Prototipi
Valutazione
Test di usabilità “quick and dirty”
Allineamento periodico

31. Prototipi
Si utilizzano software o applicazioni
web “point and click” come Invision per
collegare le schermate tra di loro e
lasciarle provare all’utente per verificare
che abbiano senso.
https://www.uxpin.com/studio/blog/what-is-a-prototype-a-guide-to-functional-ux

32. Valutazione
Review delle parti che potrebbero
essere migliorate. A seconda della
complessità si adottano diverse
tecniche.

33. Test di usabilità
Pianificare, condurre e analizzare
l’interazione dell’utente con un
prototipo. Si fa a livello esplorativo
(avere un’idea generica se il prodotto ha
senso per l’utente) e su precise attività
(verificare che l’applicazione sia in linea
con gli standard di usabilità).
https://www.usability.gov/how-to-and-tools/methods/planning-usability-testing.html

34. Allineamento periodico
Un prodotto digitale continua a evolversi
quando viene lanciato, per cui è ottimale
la possibilità di monitorare in maniera
periodica l’andamento, ad esempio
tramite A/B test.
https://blog.bonzaiengineering.com/3-steps-to-a-great-ux-health-check-ccca9e7f358d

35. THANK YOU
Giuseppe Burdo
UX, IxD
giuseppe.burdo@gmail.com