L’interfaccia utente (in inglese user interface, da cui UI) è il primo approccio dell’utente con un prodotto digitale. Per questo motivo è fondamentale che l’UI design sia a regola d’arte. Una buona interfaccia utente deve essere immediata da comprendere, facile da navigare e, ovviamente, accattivante sin da subito.

Tra le variabili da tenere conto ci sono i colori, i font e le immagini. Ma anche le dimensioni del testo, la spaziatura dei blocchi, il layout in generale e l’usabilità. Un’altra caratteristica da non sottovalutare è anche la “familiarità” con altre interfacce di prodotti simili: più un meccanismo sarà conosciuto da un utente, più sarà facile per questo utilizzarlo.

UI design: consigli bonus
UI design: consigli bonus. Molto importante è considerare su quali device dovrà girare il tuo prodotto. Pensa l’interfaccia in base allo schermo, così da non avere problemi di allineamento.

Sommando tutti questi elementi il risultato perfetto è un’interfaccia utente che non viene notata. Chi naviga, infatti, non si deve preoccupare di altro se non di farsi condurre alla scoperta del prodotto, godendosi in background il design. Al contrario, un’UI realizzata male, troppo invadente o macchinosa, può portare l’utente ad abbandonare la pagina. Come fare per evitare quest’evenienza? Facile, basta seguire le 3 regole d’oro per l’UI design!

#1 Coerenza e universalità dell’UI design

L’interfaccia utente dovrebbe parlare il linguaggio degli utenti, anche se non è sempre quello del prodotto. Utilizza termini e frasi semplici per esprimere i concetti principali, lasciando i tecnicismi solo nelle aree specifiche. In questo modo chiunque potrà navigare nel sito facilmente ma, allo stesso tempo, chi ha davvero interesse potrà trovare approfondimenti.

mappatura del sito
La mappatura del sito è una parte importantissima dell’UI: è necessario che sia chiara, possibilmente naturale e che non conduca in vicoli ciechi. Importante è anche la possibilità di navigare da una pagina all’altra anche fuori dai menù, salvo poi avere dei tasti per tornare indietro.

Cerca di strutturare il sito seguendo le convenzioni del mondo reale, anche se dal punto di vista della programmazione possono risultare un po’ più confusionari. Una mappatura naturale è molto più facile da imparare e da ricordare per l’utente.

Una volta definito uno standard, mantieni quello ovunque. Cerca di essere coerente sia con i tuoi contenuti interni che con quelli di altri, esterni. La “familiarità” degli utenti con altri prodotti simili ai tuoi, aiuterà i naviganti a percepire la tua UI come intuitiva e ridurrà le nozioni da assimilare.

#2 Considera e previeni gli errori

Gli errori esistono e gli utenti ne faranno tantissimi durante la loro navigazione. Per quanto possibile, cerca di progettare tutta l’interfaccia in maniera da evitare gli errori più gravi. Pensa a tutto quello che può andare storto, dallo scarso contrasto fino all’immissione di caratteri non consentiti, e previeni. Evita di posizionare elementi ambigui e lascia solo lo stretto indispensabile al buon funzionamento.

Nonostante questo, ci saranno comunque degli errori, specialmente da parte di utenti più esperti che vorranno guidare e non lasciarsi guidare. Se l’utente dovesse mettere un piede in fallo, fallo tornare di un passo indietro e permettigli di correggere immediatamente lo sbaglio. Le azioni dovrebbero essere il più possibile reversibili e chiare.

Delle buone pratiche sono sicuramente quelle di inserire delle uscite di emergenza. Considera un pulsante chiaro ed inequivocabile per uscire dall’azione in corso, supporta la funzione ripristina e permetti di annullare gli ultimi inserimenti.

#3 UI design grafico e minimalista

Less is more. Già conoscerai questa massima, ma in questo caso la dobbiamo estendere a tutto: grafica, nozioni e funzioni. Per quanto riguarda il comparto grafico è importante che non ci siano troppi elementi differenti tra loro. Scegli pochi font appropriati, preferibilmente della stessa famiglia, e limita i contrasti al necessario; piuttosto, gioca con le dimensioni e con le interlinee!

Punta a pochi colori, ma rappresentativi. Ricordati di sceglierne uno di base per gli sfondi, uno che sia in palette per gli elementi importanti ed uno ad alto contrasto per gli accenti. Prediligi le immagini alle parole, ma che siano significanti!

UI design infografiche
Le infografiche sono una parte molto importante: riescono a trasmettere tramite le immagini dei dati che altrimenti sarebbero difficili da assimilare. Nonostante questo è importante non abusarne perché troppo dati potrebbero non essere ricordati dall’utente.

Dal lato delle nozioni cerca di non esagerare. Trova un messaggio breve da trasmettere subito e poi allargalo nelle altre sezioni. Fai attenzione però alla quantità di sforzo che chiedi all’utente: la maggior parte delle persone ricorda tra i 5 e i 7 blocchi di informazioni alla volta… e non è detto che lo voglia fare sempre! Prima convinci l’utente che ne vale la pena e poi cerca di non sopraffarlo!