Un paio di mesi fa ho cominciato un progetto nuovo (quello per Botanical Archive di cui parlavo alla fine di questo appunto).

Progetto di web design e marketing per un’azienda che si occupa di piante rare.
Progetto con punti diversi da lavorare (analisi da fare, proposte visive, strategie da seguire, giornate passate a disegnare layout).
Progetto che è iniziato sedendosi a tavolino per parlare del logo dell’azienda—bellezza e bestia dei brand—da rifare.

Logo e Brand

I loghi sono brand e il logo non è il brand. Questa è una cosa sempre da chiarire, semplice, ma difficile da metabolizzare.

I loghi sono brand nel senso etimologico della parola: brand vuol dire tizzone, nelle lingue di origine germanica. Brand è il fuoco con cui si scaldava l’utensile per marchiare a fuoco il bestiame. La bestia era marchiata—brandizzata—così.
Quel marchio—logo—voleva dire “questo bestiame è mio” (come strumento di proprietà, prima che come associazione di qualità, provenienza o qualsiasi altro valore). Per estensione—per metonimia—il tizzone è diventato il marchio.  Più o meno semplice..

Estensione della parola brand

Ora, nel corso del tempo le parole cambiano utilizzo, e i sinonimi assumono sfaccettature e sfumature di significato diverse a seconda del contesto e dell’abitudine di utilizzo. Così il marchio è rimasto marchio e il brand è diventato qualcosa di più grande. È famosa la citazione secondo cui “il brand è quello che dicono della tua azienda quando tu non sei nella stanza”. Il marchio è rimasto l’apparato visivo di un’azienda, il brand è diventato la percezione di lui. Non più solo tizzone, ma tutto il fuoco, scintille e racconti intorno a lui, la storia di chi ci si è scaldato, chi ci si è scottato e il giudizio condiviso dalle persone.

Condividere la differenza tra brand e logo con un cliente

Ora, valla a spiegare questa cosa a un cliente: il discorso è semplice, ma difficile da metabolizzare. Più che altro, è spesso difficile creare un nuovo dizionario condiviso. È una roba che richiede tempo, esempi, applicazioni pratiche. Un branding lo può fare un designer, ma creare un brand è un lavoro che si fa a braccetto con un imprenditore. Tempo al tempo. Intanto ci si siede a parlare di logo.

Che bisogna farci con un logo

Questo è il primo discorso affrontato.
Partiamo con l’idea che dobbiamo disegnare un nuovo sito web.
Un sito web per un’azienda nata vent’anni fa.
Un’azienda che lavora online da allora.
Il logo serve su un sito? Certo.
A che serve il logo? Come strumento di identificazione immediata dell’azienda.
Abbiamo un vettoriale? No. Hm.
Cosa abbiamo? C’è un .jpeg da 300px. Hm. No bueno.
Cerchiamo il vettoriale? Non possiamo recuperarlo.
Ridisegnamolo allora. Sì.

Quando non c’è un logo vettoriale

Ridisegnamolo partendo dall’immagine. E approfittiamone per togliere il trademark, visto che il logo non è registrato. Approfittiamone per togliere il “the” nel naming, perché il dominio non lo ha. Ok. Cominciamo.
Qualche ora di pensiero, un’ora pratica di disegno, il tempo di creare tutti i lockup utili e di esportarli per la stampa e per il web.

A che serve il vettoriale?

La risposta semplice è che un vettoriale evita problemi e serve per fare un buon lavoro.
‍La risposta più articolata è che con un vettoriale si può lavorare in maniera fluida quando c’è bisogno di creare adattamenti diversi del logo nel formato (lockup), nelle dimensioni di utilizzo o nelle cromie. Lo si può usare su tutto quel range di applicazioni che va dal web dei siti e dei social alla stampa del materiale tipografico e pubblicitario.
‍Con un vettoriale si lavora nel rispetto della qualità delle linee, dei colori e degli spazi—e lo si fa rapidamente, facilmente e senza compromessi.

Perché? Di base perché un vettoriale è un blocco di informazioni (linee, colori, spessori e forme) che restituiscono un’immagine. I loghi non in vettoriale (i raster, come i .png e i .jpeg) non hanno queste informazioni: sono semplicemente pixel ordinati e colorati. I vettoriali sono Lego con le istruzioni, i raster sono dipinti già incorniciati.

Come ridisegnare un logo.

Ho un .jpeg largo 300px. Non abbastanza per poterlo ricalcare con sicurezza—e rapidamente—su illustrator, ma abbastanza per poter usare quegli strumenti che mi consentano di fare un buon lavoro.

Strumenti utili per le immagini

Primo. Cerco di estrapolare quante più informazioni posso dal logo, ovvero cerco di ingrandirlo. Di strumenti per farlo ce ne sono diversi, uno tanto semplice quanto utile è il Resize Image di I❤️IMG. È gratis, è rapido, fa un ottimo lavoro.
Do in pasto a lui il logo da 300px.
Lo strumento mi tira fuori un logo da 1200px.
4x.
Perfetto.

Parti del logo

Secondo, un logo è fatto da due parti: il marchio e il logotipo. Tolti qui i discorsi sull’etimologia dei nomi delle parti che compongono un logo e sugli utilizzi più o meno giusti delle parole, il succo è questo: un logo ha di solito un’immagine e una parte di testo. Prendi Instagram: l’immagine della macchina fotografica quadrata, viola e arancione; la scritta Instagram in corsivo. Il primo è il marchio, il secondo il logotipo. Ora.
Ho ingrandito tutto, poi ho ridisegnato in vettoriale le parti.

Design del marchio

Il marchio è facile: apri illustrator, prendi il marchio, usi lo strumento di ricalco. Espandi la forma, correggi quelle imperfezioni che possono essere nate dal ricalco. Rapido ed efficace.

Design del logotipo

Il logotipo è più difficile: c’è da trovare il font, da capirne i pesi e il kerning, le dimensioni e le proporzioni. Tutti gli step tranne il primo si possono fare manualmente, con un po’ di pazienza e l’aiuto di griglie geometriche. Il primo si può risolvere solo in tre maniere: o conosci già i font utilizzati, o cerchi a mano, font per font, quello che gli somiglia di più, o usi uno strumento di riconoscimento.

Sui font di questo logo, il primo era facile da capire: Bodoni. Bodoni è uno dei font che hanno fatto la storia—come Baskerville, Futura o Helvetica.
Il secondo, quello sans serif, meno ovvio.

Strumenti utili per i font

What the Font in questi casi è uno strumento splendido: gli ho dato in pasto l’immagine del logo, ho selezionato la parte di testo per cui mi serviva trovare il font, gliel’ho fatta analizzare.
Fatto.

Ultimi step: area di rispetto ed export

A questo punto, come con i Lego, è solo questione di rimettere insieme i pezzi: il marchio vicino al testo, il testo nella dimensione giusta, gli spazi tra le parti ordinati e precisi, funzionali.
L’unica cosa da tenere a mente qui è come l’ordine matematico e quello ottico collaborano tra di loro.

Il penultimo step è assicurarsi che il logo non venga maltrattato.
In alcuni casi serve un manuale di utilizzo, in altri—più semplici—basta fornire due tipi di file: logo puro e logo con area di rispetto.

Area di rispetto

Un logo non vive necessariamente da solo. Come negli sponsor in una locandina, spesso succede che più loghi siano vicini. Nel caso di un sito web, il logo è spesso nell’Header, e ha affianco i link del menù.
L’area di rispetto è la distanza minima a cui il logo vive bene quando posto vicino ad altri elementi.
È più o meno grande in funzione del logo stesso e dei suoi elementi.

Export

Disegnato il vettoriale, creati i lockup necessari e ragionata l’area di rispetto l’ultimo step è esportare i file.
Tutti quelli che servono e nei formati e nelle dimensioni necessarie.
Perché export diversi? Perché non tutte le aziende hanno Illustrator per aprire un .ai e perché un designer che deve progettare un manifesto ha bisogno di un file che non sgrani in stampa.Gli export sono rapidi, l’unica premura è capire la gerarchia utile. File vettoriali + raster > divisi in lockup > ogni lockup diviso per dimensione.

Il gioco è fatto. Ci siamo alzati dal tavolino con un logo pronto.
Roba da un paio di giorni. Poi è cominciato il lavoro vero sul web design.