Come rendere emozionale il design UX attraverso l’illustrazione

Le illustrazioni sono uno strumento di comunicazione indispensabile per l’umanità. Sono nate come pitture rupestri circa 45.000 anni fa e sono ancora oggi utilizzate per rappresentare un’ampia varietà di oggetti e concetti.

Le immagini non sono influenzate dalle barriere linguistiche e non importa il livello di istruzione di una persona. Le illustrazioni aiutano le persone a comprendere ed esprimere stati d’animo e sentimenti complessi che non riescono a trasmettere con le parole. Se pensate a quando eravate bambini e non sapevate leggere, le illustrazioni vi hanno dato la possibilità di imparare molte storie interessanti dai libri per bambini.

Nel contesto della moderna tecnologia dell’informazione, un’illustrazione è in parte una decorazione e in parte un segnale emotivo, che aiuta a fare un’impressione speciale sull’utente attraverso l’uso di una metafora incorporata.

Perché usare le illustrazioni in un sito web?

Le illustrazioni sono uno strumento prezioso per indicare l’umore, il tono o la voce di un marchio.

Ma non confondete icone e illustrazioni solo perché sono immagini. Le icone sono simboli, che il più delle volte devono essere stilisticamente coerenti con le illustrazioni. Un simbolo è una rappresentazione semplificata di un oggetto, di un’idea o di un’azione. Ad esempio, un’azione come “ricerca” è comunemente indicata da una lente di ingrandimento.

Le illustrazioni sono in grado di trasmettere concetti molto più complessi. In particolare, per creare un legame emotivo con il pubblico a cui si rivolge. Le illustrazioni sono anche ottime per trasmettere il significato senza la necessità di aggiungere testo. Se usate correttamente, le illustrazioni aggiungono personalità anche al sito web più semplice e pratico.

Tipi di illustrazioni più diffusi sul web

Gli stili di illustrazione sono numerosi e vari, dai semplici contorni alle immagini dettagliate, realistiche e a colori. Non vi è inoltre alcun limite alla quantità di illustrazioni utilizzate in un sito web.

Ogni stile evoca una determinata emozione e risposta, quindi è molto importante essere consapevoli nella scelta dello stile di illustrazione. Prima di tutto, è necessario considerare lo scopo del sito e il tipo di carattere che si desidera conferirgli.

Potete fare una ricerca sul mercato e vedere quale tipo di illustrazione si adatta meglio al vostro prodotto. Infatti, è quello che faremo ora. Vediamo come i designer utilizzano efficacemente le illustrazioni in quattro categorie.

Leggi anche: un designer ha creato un maestro Yoda con pelle umana, e sembra piuttosto realistico

Siti web finanziari e aziendali

I servizi finanziari, le fintech, le app aziendali e i siti web di grandi aziende utilizzano molto spesso l’illustrazione per umanizzarsi.

Tali organizzazioni aderiscono a uno stile minimalista, utilizzando forme semplici e poche illustrazioni. La prima illustrazione su schermo di Acorns utilizza un semplice motivo di foglie di quercia abbinato al logo Acorns. Anche il resto delle illustrazioni è realizzato con tonalità verdi aziendali.

Il design del sito web crea, tipico delle nuove aziende (Acorns è stata fondata nel 2014). Questo è l’aspetto di molti marchi finanziari focalizzati sul web.

Le organizzazioni più mature e tradizionali utilizzano le illustrazioni per lo stesso scopo. Tuttavia, l’uso di illustrazioni può essere limitato, come nel caso di Danske Bank. Il design sottolinea l’accessibilità del prodotto con illustrazioni nelle sezioni “Chi siamo” e “Sostenibilità”.

Visa limita inoltre l’uso dell’illustrazione a un’area specifica. Ne è un esempio il design della sezione Visa Direct. Di conseguenza, il nuovo servizio si distingue da tutti quelli offerti da Visa.

Un altro approccio sempre più diffuso in questa categoria è la grafica astratta. Gli abstract sono particolarmente utili quando è difficile mostrare ciò che il sito offre. Per esempio, Instabase utilizza composizioni di forme geometriche per attirare l’interesse. Sono realizzati nella stessa palette di colori della favicon.

Una delle chiavi per utilizzare le illustrazioni su questo tipo di siti è trovare un equilibrio tra l’essere amichevoli, umani, avvicinabili e allo stesso tempo seri, affidabili e sicuri. Se esagerate con la giocosità, i potenziali clienti non vi prenderanno sul serio. Sul sito Github, la sezione Enterprise presenta solo alcune illustrazioni con colori piuttosto tenui. Al contrario della home page, dove la prima schermata è costituita da un espressivo Octocat e da illustrazioni più luminose.

Cibo e bevande

Quando si tratta di cibo e bevande, la situazione si fa un po’ più libera. Gli stili sono molto più vari e il look può essere più espressivo e personale. Alcuni preferiscono ancora la leggera piccantezza delle illustrazioni, con aspetti migliorati come il colore e il carattere. Altri siti di questa categoria fanno delle illustrazioni una parte molto più significativa del design.

Palais Kitchen e Caleño seguono la prima strategia, utilizzando disegni al tratto adatti al marchio.

Le illustrazioni animate in stile vintage di My Drink sostituiscono le foto e bilanciano il testo della homepage.

Il sito web di Melopeion Honey non presenta molte illustrazioni, ma ci sono molti altri elementi visivi.

Monkey47 potrebbe essere descritto come un sito concettuale in cui le illustrazioni giocano un ruolo fondamentale. Ogni sezione del sito è affascinante grazie alle illustrazioni.

Industria dell’ospitalità e del tempo libero

In questa categoria, gli utenti desiderano vedere maggiormente le foto, ma anche le illustrazioni possono essere utili. Un’immagine può solo mostrare l’aspetto di qualcosa, mentre un’illustrazione può trasmettere le emozioni associate all’esperienza potenziale.

Protos Car Rental utilizza alcune belle e semplici illustrazioni per sottolineare l’aspetto festivo del suo marchio.

Comptoir Libanais combina fotografie e illustrazioni per creare una personalità speciale.

Anche l’Hotel Frida ha carattere e le fantastiche illustrazioni di animali vittoriani rendono il marchio straordinariamente originale.

Highcourt utilizza illustrazioni semplificate e stilizzate che danno un’immagine più completa degli interni dell’edificio rispetto a una fotografia.

Il sito web di Neverlands non utilizza solo illustrazioni, ma l’intero design è un’esperienza immersiva basata sulle illustrazioni.

Web design consapevole

I siti web che promuovono aziende responsabili dal punto di vista ambientale, prodotti naturali per la cura della pelle, alimenti e bevande naturali o biologici, prodotti vegani, responsabilità sociale e altro ancora tendono a fare affidamento sulle illustrazioni, soprattutto se sono relativamente nuovi.

Molto spesso questo avviene sotto forma di disegni di piante, che alludono in modo semplice alla natura. Inoltre, le illustrazioni sono spesso utilizzate per familiarizzare gli utenti con le informazioni, in modo che non vengano percepite come una lezione.

Wild Souls evita qualsiasi accenno primitivo di orientamento ecologico e randomizza in parte le sue illustrazioni.

Superfood Gin utilizza molte piante nel suo design e, dal momento che stiamo parlando di ingredienti di origine vegetale, si tratta di un concetto molto riuscito.

La pagina iniziale di Capsul’in non è molto interessante, ma il prodotto Zero Impact ha una sezione separata con illustrazioni che ne evidenziano l’unicità.

Donare responsabilmente si avvale di illustrazioni per spiegare alle persone come le buone intenzioni possano causare danni non intenzionali. Le illustrazioni sono abbastanza informative e neutre.

Molti marchi per bambini utilizzano illustrazioni anche se il target effettivo è costituito da adulti e non da bambini. Little Yawn Collective combina un approccio a misura di bambino, mostrando illustrazioni di animali che dormono e sottolineando la naturalezza del prodotto.

Utilizzo di illustrazioni nei siti web

L’illustrazione può essere uno strumento potente nell’arsenale di un designer, ma può essere difficile farla bene. Questo perché l’illustrazione evoca emozioni e le emozioni sono soggettive.

Proprio come un carattere o un colore, l’illustrazione deve essere gestita in modo corretto e attento. Ricordate che a volte meno è meglio. E ci sono volte in cui il posizionamento sbagliato di una grande illustrazione può portare al fallimento.

Questo è solo un esempio dell’ampia varietà di stili e categorie di illustrazioni utilizzate online, ma speriamo che queste informazioni vi aiutino a prendere decisioni importanti su come utilizzare l’illustrazione nei vostri progetti futuri.