Prototipazione digitale

La prototipazione digitale parte può partire da wireframe digitali, o da mokeup visuali  (con il look&fill simile a quello che avrà l’interfaccia utente).

Visual design

fonte

fonte

Il visual design dovrebbe essere la “trascrizione” grafica e visuale, della progettazione emersa attraverso le fasi di studio di ux e stesura dei wireframe.

Un mockup, a differenza di un wireframe che è una rappresentazione schematica, è un modello “in scala” e può essere utilizzato per valutare il design e non solo l’interazione e la disposizione degli elementi.

La produzione dei mockup solitamente è compito del visual designer che si occupa di ridisegnare le informazioni dei wireframe, definendone lo stile grafico, colori, font, icone.

Anche il visual design deve essere un processo iterativo, che riceve feedback ad ogni interazione e diviene sempre più specifico man mano aumenta il grado di fedeltà del prototipo.

Gli strumenti per la creazione del visual design sono diversificati, da Ide complessi per la manipolazioni di immagini, a strumenti online che permettono la creazione di prototipi funzionanti, generando in automatico html e css.

Tool

Per sketch, in particolare sono disponibili diverse librerie di componenti sia per la progettazione in wireframe, sia per i mockup.

La simulazione

Sia che stiate lavorando con un wireframe digitale o con un mokeup esistono diversi tool per rappresentare il flusso di utilizzo.

Nel caso di wireframe digitali, sistemi come balsamiq consentono di creare dei wireframe linkabili tra loro, mantenendo il look schematico, ma consentendo di saltare da una schermata all’altra cliccando sulle aree attive.

Diversamente sia per i mockup statici che per i wireframe digitali statici, quello che andrete a trattare saranno delle immagini o degli elementi grafici che andranno animati, stabilendo i collegamenti tra le tavole. Anche in questo caso sono disponibili diversi tool, quali:

Ecco un esempio di invision:

Approfondimento: Comparazione Proto.io, inviosion, marvell

Lascia un commento

Il tuo indirizzo email non sarà pubblicato.