Qualche articolo fa (precisamente qui) abbiamo raccontato qualche passaggio del nostro recente “restyling”, un lavoro che ha coinvolto tutta Webit con l’obiettivo di comunicare meglio chi siamo veramente. Nell’analisi della nostra comunicazione e della nostra identità, ovviamente non poteva mancare uno studio approfondito dell’aspetto grafico e della componente visuale di Webit, e chi può raccontarlo meglio di Elisa, la nostra Visual & UI Designer?

Quindi via! A te la parola, Eli!

Come ti rinfresco il logo

Oggi vi racconto la piccola evoluzione del brand Webit o, come mi piace definirlo, il refresh del nostro caro logo. Refresh, perché è una parola che porta con sé caratteristiche di freschezza e innovazione o forse anche perché è un termine comune nell’open space di Webit.
Grazie al lavoro coordinato e già raccontato da Davide, ho avuto il piacere di poter metter mano, (o forse dovrei dire metter mouse) all’identità visiva di Webit, partendo dall’analisi del logo utilizzato dal primo vero restyling effettuato nel 2011: Webit, fatti sentire.

Perché abbiamo scelto di rinfrescare la nostra identità e di fare un piccolo rebranding?
Il rebranding è una fase di rinnovamento, un processo che comprende tante cose, in questo caso un aggiornamento del logo, i colori aziendali e la tipografia.
Ci si rinnova per tanti motivi. Nel nostro caso, il percorso che Webit segue e che vuole comunicare è al passo coi tempi, consapevole della qualità delle risorse interne e, in questo percorso, iniziavamo a percepire il logo un po’ “vecchio”, da rispolverare. Pian piano abbiamo iniziato a non sentirci più rappresentati da quel logo, iniziando a considerarlo forse un po’ spento e freddo. Ci siamo guardati da fuori, partendo dalle competenze di Davide e analizzando tutti insieme la “nostra identità”, la Vision e la Mission aziendale e il nostro tono di voce, delineando un percorso comune e ponendoci alcuni obiettivi.

Siamo partiti da una base solida: la realtà di Webit, con i suoi 23 anni di esperienza sul territorio e tanta competenza tecnica, sempre aggiornata e affidabile, sull’onda del web e con un personale giovane e deciso. Ma sentivamo il bisogno di un vestito nuovo, un tocco fresco, giovane, umano.

Le forme e i colori

Ho passato ore a osservare il logo Webit “2011”, analizzando i suoi possibili punti deboli e pensando al perché stavamo iniziando a sentirlo “vecchio” e poco rappresentativo dell’agenzia oggi.
Avevo l’obiettivo di non stravolgerlo troppo, solo di aggiornarlo. Sono partita dalla struttura del font utilizzato e ho pensato avesse delle linee troppo nette e rigide, a simboleggiare troppo tecnicismo e poco lato umano. Inoltre, le ultime tendenze UI Flat e il Material Design introducono forme morbide, illustrazioni 2D e prediligono i colori, sottolineando l’importanza di elementi come pulsanti e call to action. L’obiettivo è comune: la semplificazione dell’interfaccia utente e il miglioramento della sua usabilità.
Mi sono concentrata sui dettagli, lavorando sulla forma di ogni lettera, cercando di ridurre quella rigidità visiva, smussando gli angoli del font in origine e dell’onda Webit.
Per finire, volevamo rendere il logo più essenziale e minimale, quindi via il vecchio payoff.

Ammorbidire la spigolosità del logo ha subito aiutato a rinfrescarne l’identità, ma mancava ancora qualcosa.

Il colore “verde Webit”, nel corso del tempo, aveva perso un po’ di carattere. Ho quindi approfittato del nostro mezzo principale di comunicazione: il web, capace di supportare la gamma di colori RGB, ricercando una maggiore flessibilità nella scelta cromatica.

Dopo varie prove cromatiche, ho proposto una tonalità di “verde Webit” più vivace, declinando l’onda del marchio secondo design flat, sempre con angoli smussati per coerenza visiva.

Inoltre, con il vecchio logo emergeva spesso un problema: assorbiva i colori di sfondo su cui era posto, in quanto le linee oblique che simulavano l’effetto 3D, erano progettate in trasparenza. Ora, invece, il marchio non è più soggetto al tipo di background utilizzato.

Il primo colore secondario

Credo fortemente nei contrasti visivi, dalla tipografia al tratto grafico di un visual. Un font light e dunque “sottile e leggero” per la sua scarsa quantità di nero, si sposa con uno bold e quindi con una maggiore quantità di nero.

Webit non aveva mai avuto un colore secondario “ufficiale”, e forse proprio per questo il vecchio verde ha iniziato a diventare man mano un po’ banale, piatto e sempre meno rilevante e distintivo.

Quindi perché non introdurre un po’ di colore?

E da quale colore partire se non dal suo complementare? Il nostro cervello ci permette di percepire il colore opposto (rispetto al centro del cerchio del diagramma cromatico), per ripristinare l’equilibrio percettivo. Nel nostro caso, quindi il rosso, sì, ma quale?

Dopo tanti accostamenti cromatici, sono arrivata a proporre una palette definitiva, composta da gradienti che ne determinano l’identità a seconda dell’utilizzo. Eccola qua.

Tipografia

Dopo il restyling grafico per quel che riguarda il logo, ci siamo confrontati sulla tipografia da utilizzare. Abbiamo preferito orientare la scelta per la nostra comunicazione sui Google Font, principalmente per un utilizzo comune da parte di tutto il team, oltre al principale utilizzo finale e perché… ci siamo banalmente innamorati del Lato e del Montserrat! Soprattutto per le loro forme e l’affascinante capacità espressiva che conferiscono.

Infine, non poteva mancare un pizzico di contrasto, dato dal Playfair Display e la contrapposizione di un font serif e due sans-serif.

Questa è la nuova identità di Webit: genuina, colloquiale, amichevole. La guida competente, giovane e aperta.

Il logo è il primo biglietto da visita, cognitivo e immediato. Ecco perché è così importante che emerga subito la nostra identità.