Concettualmente fin dalla nascita di un progetto si nasconde al suo interno un prototipo.

Dalla sua ideazione, alle linee guida, brief, analisi ecc.. andiamo verso la costruzione in senso astratto del nostro prodotto finale.
Oggi la prototipazione è un aspetto fondamentale nell’ambiente del design perché ci permette di capire come sarà un prodotto (nel nostro caso l’e-Commerce, landing, siti web) e la sua interazione con i suoi utenti ancora prima di procedere con la sua realizzazione.

Il prototipo rappresenta quindi la creazione di quello che sarà verosimilmente il prodotto finale. A differenza del wireframe, il prototipo è interattivo ma in linea di massima i principi della loro realizzazione sono i medesimi: velocitàflessibilità e facilità nell’apportare modifiche in fase di sviluppo.

Sicuramente produrre un prototipo costa molto più tempo rispetto ad un wireframe, ma rappresenta il mezzo più potente in fase di sviluppo in quanto questo genere di documentazione  permette all’utente di testare l’esperienza di navigazione, e validare, cioè confermare, alcune specifiche che si erano messe su carta.

Le pagine di un prototipo possono essere realizzate in maniera molto fedele al sito finale, ma saranno comunque composte da pochi contenuti indispensabili, giusto quelle necessarie ad esporre in maniera coerente il progetto.

Uno strumento fondamentale per il design e la prototipazione: Adobe Xd

Negli ultimi anni si sono affacciati molti software web-based, cioè online, in grado di “prototipare”, chi invece lavora già nel settore della UX/UI, ha sempre dovuto usare diversi software alternativi come SketchInvision o Figma ma Adobe con Adobe Xd, o eXperience Design (il suo nome completo) entra in questo fa parte dei tool che ogni designer dovrebbe saper usare.

Questo software disponibile su Adobe Creative Cloud è stato appositamente pensato per fare UX/UI.
Si tratta di un programma semplice da imparare per chi conosce già gli altri applicativi Adobe grazie ad un’interfaccia di immediata ed intuitiva.

La cosa molto interessante di questo strumento è la possibilità di creare dei veri prototipi interattivi per simulare e testare l’esperienza digitale che si sta progettando.

Non sempre questo tipo di approccio è applicabile, pensiamo alle micro-landing page, non sarebbe neanche sensato, diviene invece fondamentale quando parliamo di Web App o Siti Web molto vasti e con interazioni con l’utente molto articolate.

Con pochi clic si passa dal mock-up al prototipo

L’aspetto più interessante per il cliente ma anche soprattutto per noi designer è che è possibile mostrare il risultato finale di un menu senza dover realizzare prima tutto l’html.
Come è possibile vedere nell’immagine qui sotto una volta realizzati i vari mock-up o layout, in questo caso cart-menu che scorre, è possibile collegarli tra di loro e definire che tipo di transizione avranno. Se il tipo di movimento o si ritiene che sia difficile o poco efficace il modo di comunicare questo aspetto potrà essere agevolmente cambiato facendo risparmiare sia al cliente che all’agenzia tempo e denaro, aumentando così sia l’efficienza del designer che la soddisfazione del cliente.

Concludendo

Quanto spiegato prima è solo una piccola guida introduttiva che vuole gettare le basi ad un mondo molto vasto. Non c’è un miglior modo o metodologia per prototipare. Tutto dipende dal tempo e dalle risorse, è una fase più o meno lunga che permette di mettere in discussione varie idee e possibilità ed errori. Se anche tu ti stai chiedendo come potrebbe essere realizzato un progetto questo è il miglior approccio adottabile. Scrivici per saperne di più.