Come comunicare il giusto messaggio: i 5 principi della gerarchia visuale

Mentre ogni Graphic Designer si sforza di rendere visivamente piacevole il proprio lavoro, la creazione di cose belle non dovrebbe essere l’unico obiettivo, questo vale soprattutto per il web!

E’ molto importante comunicare efficacemente il messaggio giusto ad uno spettatore ed abbiamo diversi metodi e trucchi per farlo.⁠

Uno di questi “trucchi” è la gerarchia. Questo strumento ci aiuta a richiamare l’attenzione su ciò che vogliamo che una persona guardi per prima e porti meno attenzione alle cose che vogliamo che tu guardi alla fine.

Esistono 5 principi di progettazione di base che possiamo utilizzare per aiutarci a raggiungere una corretta gerarchia:

  • dimensione
  • colore
  • contrasto
  • allineamento
  • prossimità

Dimensione

Dimensione gerarchia visuale web-design
La dimensione è uno strumento efficace per guidare l’osservatore verso un elemento specifico di un design perché gli oggetti più grandi attirano l’attenzione di più rispetto agli oggetti più piccoli.
Le nostre menti associano le dimensioni all’importanza, quindi gli elementi più grandi di un disegno dovrebbero essere i più importanti e gli elementi più piccoli dovrebbero essere i meno importanti

Colore

colore gerarchia visuale web design
Il colore, come le dimensioni, è un altro strumento di organizzazione visiva utilizzato per attirare l’attenzione su un determinato elemento di un disegn/illustrazione. I nostri occhi sono immediatamente attratti da colori audaci e contrastanti

Contrasto

Contrasto gerarchia visuale web design
Drammatici cambiamenti di colore delle dimensioni del testo indicano che qualcosa è diverso, che attira l’attenzione.
Cambiare da un colore chiaro a un colore scuro o da un carattere sottile in corsivo ad un carattere pesante e moderno crea contrasto.

Allineamento

allineamento gerarchia visuale web design
L’ordine tra elementi di un design viene spesso creato attraverso l’allineamento. Guida l’occhio di chi guarda attorno a una pagina permettendogli di seguire inconsciamente le linee. Questo è spesso usato nel web design attraverso colonne e griglie.

Prossimità

Prossimità gerarchia visuale web design
La Prossimità viene utilizzata per separare e raggruppare elementi di un design. È il modo più rapido per mettere in relazione contenuti simili o distinguere un gruppo di contenuti da un altro. Gli oggetti vicini sono spesso associati l’uno con l’altro.