Prototipazione (molto) rapida

Qualche tempo fa mi è venuta voglia di fare un corso sulla prototipazione rapida di applicazioni che ho trovato su Udacity, ma negli ultimi tempi non mi è servito fare alcun prototipo… finché al lavoro – meno di un mese fa – non abbiamo dovuto cominciare da zero lo sviluppo di una nuova applicazione per Android.

Corso Udacity sulla prototipazione rapida

Corso Udacity sulla prototipazione rapida

Ci poteva stare lavorare inizialmente a prototipi per definire l’interfaccia utente, ma per evitare frizioni con i colleghi designer e per “risparmiare tempo” ho preferito evitare. Finché un bel giorno mi arriva la notizia di un tirocinante del quarto superiore in cerca di qualcosa da fare per una settimana, al che gli affido il corso web, l’analisi funzionale dell’applicazione da sviluppare e un blocco note.
Ebbene un ragazzo del quarto superiore totalmente nuovo al mondo della UX design dopo tre giorni mi ritorna con un prototipo di applicazione interattiva disegnata con la matita, e negli ultimi due giorni di test e raffinamenti progressivi ci siamo ritrovati con una bozza da cui prendere spunto fatta da un ragazzo inesperto e apparentemente “inutile”.

Per carità, se non si ha bisogno di progettare un’interfaccia utente innovativa e l’applicazione in oggetto sarà uno strumento di lavoro probabilmente può bastare seguire le linee quida del material design e utilizzare solo componenti standard per ottenere un buon risultato. Ciò non toglie però che per definire l’ordine delle voci di menù, la posizione di campi e pulsanti, l’interattività tra le varie componenti, fa comodo capire come ragionano gli utenti tipo dando loro in mano qualcosa da provare, possibilmente prima di mettersi a sviluppare.

Mockup, wireframe, sketch

Di strumenti per disegnare bozze delle proprie maschere ce ne sono tanti. Tra quelli gratuiti e open-source il migliore che conosco è Pencil, ma per la mia (poca) esperienza all’inizio conviene lavorare di carta e penna, o di tavoletta grafica quando se ne ha una.
Gli strumenti consigliati nel corso

InVision

Secondo me i prototipi sono belli se interattivi. Va bene che tutto fa brodo, e anche delle maschere disegnate su un blocco note e mostrate a un potenziale utente sono ottime per raccogliere informazioni, ma non c’è niente come osservare quell’utente mentre cerca di capire i meccanismi dell’applicazione e come raggiungere i suoi obiettivi. Per fare questo il miglior mezzo che ho trovato finora è InVision, e non a caso lo consigliano sul corso.

I tipi di prototipi disponibili

I tipi di prototipi disponibili

Aggiunta di hotspot alle proprie bozze

Aggiunta di hotspot alle proprie bozze

Aggiunta di commenti

Aggiunta di commenti

Chat di gruppo

Chat di gruppo

Condivisione del prototipo

Condivisione del prototipo

In questa breve carrellata ho elencato le funzionalità più interessanti secondo me, dalla scelta del tipo di dispositivo alla condivisione del risultato. InVision si può usare partendo da disegni a matita ma anche da prototipi più fedeli fatti con Pencil o altri strumenti simili, e il suo funzionamento è molto intuitivo. Per chi fa il corso su Udacity dovrebbe esserci anche una licenza gratuita di alcuni mesi, ma anche senza di questa i prototipi si possono fare (in numero limitato) e condividere.
Volendo c’è anche un’applicazione in stile Dropbox che aiuta a mantenere sincronizzate le immagini caricate sul prototipo con quelle sul proprio computer, così da poterle modificare più facilmente.

Per smartphone c’è un’applicazione simile chiamata POP che però secondo me è meno comoda e intuitiva. Un’applicazione web si utilizza più facilmente e InVision è difficilmente migliorabile.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.