Principi di UX e Prototipazione Wireframes: Risorse

Introduzione

Questo post è stato creato da supporto alle lezioni del modulo Principi di UX e Prototipazione Wireframe, legato al corso di Full Stack Development di Uniform Servizi. Non avendo molti punti di riferimento in Italiano, ho ususfruito delle risorse da cui prendo spunto quotidianamente (in Inglese).

L’obiettivo è di tradurre i concetti base per ognuno dei posts che andrò ad aggiungere. Questa risorsa crescerà con libri, video e podcasts sugli argomenti che abbiamo trattato in classe.

In ogni caso, se hai problemi con l’inglese e volessi leggerti gli articoli indicati, usa Google Translate oppure DeepL. Ti aiuterà a migliorare la conoscenza della lingua Inglese

Obiettivi

Integrando l’informazione di questo post alle lezioni fatte in classe, dovresti essere in grado di elaborare:

1. Il concetto di User Experience da varie prospettive.

2. Benefici e impatto della UX sui costi aziendali e aumento delle entrate.

3. Differenza tra UX e UI, significato di user flow e principi di usabilità.

4. Perché è essenziale progettare da una prospettiva user-centered (centrata sull’utente).

5. Concetti fondamentali legati alla user research.

6. Impatto del contesto d’utilizzo e uso della contextual enquiry.

7. Metodi per classificare e organizzare informazioni (affinity diagramming, user stories, etc).

8. Come organizzare le informazioni scaturite dalla user research in affinity diagramming.

9. Metodologie pratiche di product design: introduzione al Design Sprint 2.0 process.

10. Principi di wireframing e strumenti per creare prototipi di wireframes efficaci.

11. Strumenti e risorse essenziali.

1. Principi di UX

Le risorse di questa sezione sono legate alle ragioni per cui è essenziale progettare da una prospettiva user-centered. Ti introdurranno ai principi fondamentali dell’usabilità di un sistema, e del process principale che sta alla base di tutte le metodologie di UX design.

Punti chiave della sezione

1. La UX (Esperienza Utente) comprende tutti gli aspetti dell’interazione tra utenti finali con l’azienda, i servizi e i suoi prodotti.

2. Fare UX significa comprendere sia le esigenze degli utenti che delle aziende, e fornire loro l’esperienza più soddisfacente attraverso prodotti e servizi che aiutino entrambi a raggiungere i loro obiettivi.

3. Il processo di design è implementato prima, durante e dopo un progetto, e poi ripetuto tutte le volte necessarie.

4. Migliorare la UX aumenta le entrate (anche) perchè gli utenti non dovranno confrontarsi con gli ostacoli che impediscono un flusso di vendita veloce.

5. Con una migliore UX si riducono i costi perchè i problemi di usabilità vengono risolti nelle prime fasi del processo di sviluppo.

6. UX si concentra sull’ottimizzazione di un prodotto per un uso efficace e soddisfacente. Il design dell’interfaccia utente (UI), riguarda l’aspetto grafico, la presentazione e l’interattività di un prodotto.

7. Lo User Flow è il percorso dell’utente attraverso un sito mentre tenta di completare un’attività/raggiungere un obiettivo.

8. L’usabilità riguarda la facilità d’uso con cui un utente può interagire con il tuo sito.

9. Il design si basa su una comprensione esplicita di utenti, obiettivi e ambiente.

2. User Research

Questa sezione ti introduce al vasto argomento della user research. Vediamo quali sono i metodi principali per conoscere a fondo gli utenti che andranno ad utilizzare il nostro prodotto digitale/sistema.

Punti chiave della sezione

1. Gli user tests devono essere eseguiti con gli utenti reali del sistema, non persone simili a utenti reali o che parlano per loro.

2. Le caratteristiche strettamente demografiche hanno un uso limitato nella user research.

3. Le caratteristiche comportamentali, il contesto di utilizzo e l’approccio passato dell’utente verso lo stesso obiettivo ci forniscono dati più accurati di quanto possano fare le caratteristiche demografiche.

4. Le persone non hanno una buona conoscenza dei loro bisogni specifici in relazione ad un software o sistema.

5. Qualsiasi ricerca dovrebbe essere effettuata con utenti reali, non con personale interno.

3. Design Process

Oggi la UX si evolve in design che non riguarda più soltanto gli utenti. Come progettisti di prodotti digitali dobbiamo fornire soluzioni di design che soddisfino sia gli obiettivi degli utenti che dell’azienda. Grazie a metodologie di product design come il Design Sprint, possiamo trasformare idee di business in ipotesi verificabili, problemi di design in opportunità.

Punti chiave della sezione

Il Design Sprint originale (di Jake Knapp ) nasce come un processo di 5 giorni per risolvere grandi problemi e testare idee.

2. Con il Design Sprint 2.0 (di AJ&Smart) puoi testare le tue ipotesi e risolvere problemi di design in soli 4 giorni.

3. Il Design Sprint è un metodo pragmatico per testare i prodotti il più in fretta possibile senza sprecare settimane, mesi o anni rischiando di creare il prodotto sbagliato.

4. La prima fase del Design Sprint 2.0 è dedicata al chiarire quali siano i (veri) bisogni del cliente, il challenge da affrontare e come risolverlo.

5. Nella 2° fase del DS 2.0 si decide quali sketch considerare (e quindi trasformare in high-fidelity prototypes).

6. Nella 3° fase del DS 2.0 l’obiettivo è quello di rendere i prototipi il più fedele possibile, in modo che gli utenti si sentano come se stessero usando un prodotto reale (o il più simile possibile al prodotto finale/MVP).

7. Nella 4° fase del DS 2.0 vedremo se il nostro process ha funzionato grazie a sessions finali di user testing.

8. Le modalità per trovare i beta testers dipendono dall’industria per cui si sta lavorando ma, in generale, i metodi sono simili. Per esempio si usano FB ads, proponendo dei vouchers in cambio.
Oppure attraverso forums e Reddit, proponendo in cambio (es.) periodi di membership gratis.

4. Prototipazione Wireframes

Ora che abbiamo preso alcune decisioni sulla strategia appropriata per aiutare l’utente e l’azienda a raggiungere i loro obiettivi, possiamo trasformare tutto in un formato visivo preliminare che funga da impalcatura per la nostra visione ultima.

Punti chiave della sezione

2. I wireframes sono semplici disegni a linee che definiscono le dimensioni e la struttura degli elementi della pagina, la navigazione e le funzionalità del sito. 

3. Aiutano il team e le parti interessate a concentrarsi nel comprendere i flussi, il contenuto e gli elementi del design.