Dopo aver parlato di Full stack designer e di UX DESIGN: la base da cui partire finalmente siamo arrivati nella parte più “colorata” del nostro processo, l’UI Design.
Per farvi un esempio, se L’UX designer è l’architetto, l’UI Designer è un po’ l’interior designer della nostra casa.
La persona giusta che renderà il nostro prodotto digitale fruibile e appetibile, applicando tutte quelle regole e buone norme che ogni graphic designer conosce dalla notte dei tempi.
Non vi nascondo che per me questa è la parte più divertente perchè la più affine al mondo da cui provengo, il Graphic Design.
Colori, font e sfumature sono solo alcuni degli elementi con cui dovremo avere a che fare. Ovviamente il fatto che usiamo tutta questa roba non ci deve trarre in inganno nell’essere creativi a tutto tondo. Dovremo sempre avere in mente il target per non perdere tutto ciò che di buono ha costruito l’UX Designer.
Dunque attenendoci alle indicazioni che provengono dagli step precedenti, andremo a definire il “look and feel” della nostra app o sito web.
L’UI Designer come fa a creare delle app funzionali?
Senza scomodare i grandi designer del passato, possiamo affidarci agli insegnamenti di una scuola che ha fatto la storia della psicologia della forma e di conseguenza del design, la Gestalt.
Questa fucina di talenti ha riassunto in pochi aspetti alcuni degli elementi che ogni UI Designer deve conoscere.
L’elenco comprende il principio di vicinanza, somiglianza, del destino comune, di continuità, dell’esperienza passata, di chiusura e di figura/sfondo. Li ho elencati senza spiegarli semplicemente perchè ci sono moltissimi blog che ne parlano in modo esaustivo come quello di grafigata.
Ma qui in questo articolo non voglio descrivervi i principi e farvi una lezione prettamente teorica, ma voglio entrare più nel merito. Voglio farvi capire in che modo si possono combinare i principi del graphic design per creare delle interfacce degne di nota.
I primi 3 principi dell’UI Design: equilibrio, ritmo e dominanza
Cominciamo?
1) Il primo punto da ottimizzare è l’equilibrio.
Cosa significa? Semplice, dobbiamo capire che il prodotto sarà creato da più sezioni o blocchi e ognuno di questi blocchi deve essere bilanciato sia in relazione agli elementi interni sia agli altri blocchi che compongono la pagina o la schermata.
Per equilibrare abbiamo un’arma micidiale, lo spazio! Questa parola incute timore nei giovani designer, ma in realtà è la chiave del successo. Una buona spartizione dello spazio tra elementi interni ed esterni è necessario per creare una suddivisione organizzata e non deve far paura l’assenza di contenuto, anzi. A volte è proprio questa assenza a dare importanza (vedere il principio della dominanza) ad un elemento piuttosto che ad un altro, contribuendo a bilanciare le parti in modo da non affaticare i nostro utenti nei loro percorsi. Oltre a equilibrare, le distanze ci aiutano a raggruppare. Elementi vicini saranno considerati facenti parte di un gruppo rispetto ad altri che sono lontani.
2) Il secondo punto è il ritmo, ovvero la ripetizione di elementi a intervalli regolari. Anche questo aspetto deve essere compreso bene, se no rischiamo di perdere il nostro utente nel labirinto di contenuti.
Il ritmo ci aiuta ad aggregare elementi di uno stesso gruppo che ci indicano un qualcosa di comune. Infatti basta vedere come sono strutturati i social per capire come il ritmo è presente per agevolarci nella nostra navigazione, senza farci perdere il focus dell’attenzione.
3) Il terzo punto è la dominanza. Quando ho parlato di spazio ho indirettamente inserito anche il concetto di dominanza e di spazio negativo e positivo.
L’esempio più veloce per capire questo punto è un pallino nero al centro di un foglio bianco. Nonostante il pallino nero sia molto piccolo, la nostra attenzione cadrà su di lui sia per il colore diverso dal foglio sia per la sua dimensione. Ma come direte voi? Il punto è piccolissimo!
Si ma lo spazio che ruota intorno a lui lo rafforza e la sua dimensione percettiva è notevolmente più grande di quella visiva. Quello stesso punto se avesse tanti altri puntini intorno avrebbe una forza minore rispetto al piccolo puntino. In termini di UI design questo significa che se io volessi dare importanza ad un elemento, basterebbe isolarlo e circondarlo di spazio negativo (lo spazio che circonda un elemento) per renderlo importante agli occhi dell’utente.
Questi sono i primi tre principi che ho voluto descrivere. Non ho voluto creare un post troppo lungo per non inserire troppa carne al fuoco. Sono elementi che devono essere assimilati poco per volta per poter essere compresi al meglio.
In questi tre punti possiamo già intravedere come il lavoro dell’UI designer sia incentrato più sul togliere che sull’aggiungere. Non a caso uno dei mantra più famosi del design recita “Less is More”.
Nel prossimo articolo andremo avanti e completeremo con gli altri punti dell’ UI Design
Stay tuned!
