Negli ultimi articoli dedicati al design delle app abbiamo visto come scrivere i documenti preliminari: User Profile, User Story e Business Model. Con questo materiale possiamo affrontare la creazione del mockup che permetterà di valutare e testare il vero volto dell’app.
Dato che il mockup è un disegno preliminare delle videate dell’app, esso può essere eseguito con qualunque strumento, anche con carta e penna. Tuttavia oggigiorno ci sono diversi strumenti online, anche gratuiti, che permettono di ottenere velocemente prototipi animati delle nostre schermate. Basta googlare mockup tools o prototyping tools per averne una bella lista. Questi strumenti contengono già template e icone degli elementi di interfaccia utente più frequenti, quindi si possono disegnare videate con un feeling molto simile a quelle finali.
Selezionato lo strumento, dobbiamo capire di che cosa dobbiamo fare il mockup. Non vi consiglio di mockuppare tutte le videate dell’app, dal login ai setting. La strategia migliore è quella di partire dalle User Story, cioè di fare un mockup per ogni User Story descritta nel documento relativo. In questo modo otterremo la visualizzazione dei soli processi principali dell’app senza essere distratti da tutto il resto, e potremo così avere un prototipo più centrato sulle funzioni più importanti.
Infine qualche consiglio sullo stile. Nelle app, less is more, quindi resistete alla tentazione di aggiungere menu hamburger con ogni genere di funzione. Siate chiari e concisi nell’uso del testo, non dite nulla in più dell’indispensabile, e sfruttate il potere delle immagini e la riconoscibilità delle icone, che spesso valgono più di mille parole. Non fate aprire mai la tastiera, se non quando è proprio necessario evitando il più possibile l’uso di campi di input, e minimizzate il numero di tap per eseguire il processo.
Prima di mettersi all’opera, un buon consiglio è quello di studiare sia i competitor che altre applicazioni simili come processo. Potrete apprezzare alcune loro idee e troverete anche come differenziarvi. È quello che ho fatto prima di partire con il mockup di ToBuy, che potete trovare qui.
È interessante confrontare il mockup con l’app finale che potete provare in preview qui. In effetti le differenze sono minime perché il mockup e l’app condividono lo stesso tema grafico, che è quello nativo del dispositivo.
Con questo articolo concludo questa brevissima panoramica sul design delle app. A questo punto possiamo iniziare a vedere come si passa dal mockup all’app, cioè affrontare le fasi dello sviluppo vero e proprio. Se nel frattempo avete realizzato qualche mockup e volete qualche consiglio su come ottimizzarlo, sono a vostra disposizione.
