Per diventare UX designer è importante conoscere bene anche la parte visuale della progettazione.
Il visual design è un processo di progettazione che si concentra sull’estetica di un’app e su come è possibile utilizzare tale estetica per migliorare l’esperienza dell’utente.
Si occupa di selezionare e applicare colori, tipografia e stili a un’interfaccia utente, la User Interface.
Il design si differisce dall’arte perché ha sempre uno scopo.
Ci sono una serie di principi chiave a cui i designer si riferiscono quando mettono insieme un design. Tra questi ci sono le leggi della Gestalt del raggruppamento.
Questi principi possono funzionare come un insieme di linee guida per la creazione di layout facilmente navigabili.
La psicologia Gestalt
La psicologia della Gestalt è una scuola di pensiero focalizzata sulla comprensione del modo in cui le nostre menti organizzano ed elaborano il mondo che ci circonda.
Il movimento è stato fondato in Germania intorno al 1912 e da allora ha contribuito a spiegare come le nostre menti elaborano le informazioni. Il principio centrale della psicologia della Gestalt è stato magnificamente riassunto dalla famosa citazione:
“Il tutto è diverso dalla somma delle parti.” KURT KOFFKA
Il principio sostiene che quando vediamo qualcosa, formiamo una percezione, o “gestalt”, dell’oggetto in cui il tutto ha una realtà indipendente dalle sue parti.
Per comprendere il mondo circostante si tende a identificarvi forme secondo schemi che ci sembrano adatti – scelti per imitazione, apprendimento e condivisione – e attraverso simili processi si organizzano sia la percezione che il pensiero e la sensazione; ciò avviene di solito del tutto inconsapevolmente.
Per esempio:
Sono due volti di profilo, o è un calice?
Quello percepiamo è il risultato, derivato, di una complessa organizzazione che guida anche i nostri pensieri.
Perché i principi Gestalt sono importanti
Secondo Nielsen Norman Group, capire questi principi, ed applicarli ci porterà diversi benefici:
- Aumenta l’usabilità. Seguendo questi principi di progettazione visiva si ottengono spesso layout facili da usare. Se associato a un forte design di interazione, il design visivo aumenterà le percentuali di successo delle attività e il coinvolgimento degli utenti.
- Provoca emozione e gioia. Le cose belle suscitano emozioni positive. In effetti, l’effetto estetico-usabilità dice che quando le persone trovano un design visivamente accattivante, possono essere più tolleranti di piccoli incidenti di usabilità.
- Rafforza la percezione del marchio. Un forte sistema visivo crea fiducia ed interesse degli utenti nel prodotto e rafforza in modo appropriato il marchio.
Principi fondamentali
I principi fondamentali del design sono:
- Enfasi,
- Equilibrio e Allineamento,
- Contrasto,
- Ripetizione,
- Proporzione,
- Movimento, e
- Spazio bianco.
Principi gestalt: Enfasi
Principi gestalt: Equilibrio e Allineamento
Non dimenticare mai che ogni elemento inserito in una pagina ha un peso.
Il peso può derivare da colore, dimensione o trama.
Pensa se avessi messo tutti i tuoi mobili in un angolo di una stanza, sarebbe un disordine totale. Allora stesso modo, non puoi ammucchiare tutti i tuoi elementi UI in un’area della pagina che stai progettando.
Senza equilibrio, il tuo pubblico sentirà come se il loro occhio scivolasse fuori dalla pagina.
Il design simmetrico crea equilibrio attraverso elementi equamente ponderati allineati su entrambi i lati di una linea centrale.
Esempio: Design simmetrico
D’altra parte, il design asimmetrico utilizza pesi opposti (come il contrasto di un elemento grande con diversi elementi più piccoli) per creare una composizione che non è uniforme, ma ha ancora equilibrio.
Esempio: Design asimmetrico
Principi gestalt: Contrasto
Il contrasto crea spazio e differenza tra gli elementi del tuo design.
Lo sfondo deve essere significativamente diverso dal colore dei tuoi elementi in modo che funzionino armoniosamente insieme e siano leggibili.
Se hai intenzione di lavorare molto con i testi, capire il contrasto è incredibilmente essenziale perché significa che il peso e le dimensioni della tipografia sono bilanciati.
Principi gestalt: Ripetizione
La ripetizione unifica e rafforza un design.
Se solo un elemento ha uno stile, diverso da tutti gli altri, si può percepire come un errore. Se, invece, tre elementi hanno quello stile, allora hai creato un motivo e hai di nuovo il controllo del tuo design.
In questa immagine, dopo averla guardata 10 secondi, sapremo già raggruppare gli elementi del menu laterale, del menu in alto, delle sezioni della pagina, ecc.
Principi gestalt: Proporzione
La proporzione è la dimensione visiva del peso degli elementi ed il modo in cui si relazionano tra loro.
Spesso aiuta a raggruppare il tuo design in sezioni, anziché nel suo insieme.
La proporzione può essere raggiunta solo se tutti gli elementi del progetto sono di buone dimensioni e posizionati con cura. Una volta padroneggiato l’allineamento, l’equilibrio e il contrasto, la proporzione dovrebbe emergere organicamente.
In questo esempio, la foto del prodotto è relativamente più grande di tutti gli altri elementi nell’interfaccia utente per creare un senso di importanza.
Principi gestalt: Movimento
Movimento significa guidare l’occhio dell’utente verso un percorso predeterminato in una pagina.
Un esempio che descrive bene il movimento su una pagina web è questo:
Principi gestalt: Spazio Bianco
Finora abbiamo visto sempre elementi che si aggiungono al design. Lo spazio bianco (o spazio negativo) è l’unico che si occupa specificamente di ciò che non si aggiunge.
Lo spazio bianco è esattamente questo: lo spazio vuoto attorno agli elementi.
Per i designer principianti può essere una zona pericolosa. Spesso, dare semplicemente più spazio per respirare ad una pagina può trasformare il vostro progetto da mediocre ad eccellente.
Lo spazio bianco crea, in modo indiretto, la gerarchia e l’organizzazione del design. I nostri cervelli associano naturalmente “importante” un ampio spazio bianco attorno a un elemento.
Source: Refactoring UI Book
Ti è piaciuto questo articolo sulla Gestalt? Puoi approfondire l’argomento nel nostro gruppo facebook.
Risorse Extra
Per avere tanti altri contenuti come questo:
- accedi al gruppo esclusivo, e gratuito, di User Experience Italia
- seguici su Instagram
- seguici su Telegram
