{"id":1664,"date":"2013-12-27T23:54:32","date_gmt":"2013-12-27T22:54:32","guid":{"rendered":"http:\/\/www.didatticarte.it\/Blog\/?p=1664"},"modified":"2016-11-21T23:44:09","modified_gmt":"2016-11-21T22:44:09","slug":"didatticarte-genesi-un-marchio","status":"publish","type":"post","link":"https:\/\/www.didatticarte.it\/Blog\/?p=1664","title":{"rendered":"Didatticarte, genesi di un marchio"},"content":{"rendered":"

S\u00ec, lo so. \u00c8 un post piuttosto autoreferenziale<\/strong>. Ma, come in altri casi, mi interessa presentare il disegno del marchio Didatticarte non per autocelebrazione ma come esempio di metodo progettuale<\/strong> nella grafica.<\/span><\/p>\n

Fino a questo momento non avevo avuto nulla che potesse essere definito “marchio”: l’icona scelta per il profilo Facebook<\/strong> di Didatticarte consisteva, infatti, nell’immagine di un libro<\/strong>, una roba temporanea ma, si sa, nulla \u00e8 pi\u00f9 definitivo di ci\u00f2 che \u00e8 provvisorio!<\/span><\/p>\n

\"\"<\/span><\/p>\n

\u00c8 rimasto l\u00e0 indisturbato per pi\u00f9 di due anni. Ma qualche settimana fa ho deciso che era\u00a0arrivato il momento di lavorare su un\u00a0simbolo<\/strong>\u00a0pi\u00f9 ragionato…<\/span><\/p>\n

Come ho proceduto? Innanzitutto con la fase di “briefing”<\/strong>, l’operazione nella quale il cliente d\u00e0 all’operatore tutte le istruzioni relative alla sua richiesta. Naturalmente, in questo caso, committente e grafico coincidono\u2026\u00a0Ecco, allora, cosa mi sono detta:<\/span><\/p>\n

1 – Voglio un marchio semplice<\/strong>, molto lineare<\/strong><\/span><\/p>\n

2 – Non deve essere figurativo<\/strong>; quindi niente tavolozze, pennelli o altri oggetti che possano essere correlati alla pittura; d’altra parte Didatticarte non \u00e8 un progetto legato solo a questa forma artistica e, inoltre, qualsiasi oggetto rischia di rendere il marchio banale o lezioso<\/strong><\/span><\/p>\n

3 – Deve essere riconoscibile in formati anche molto piccoli<\/strong> come la <\/span>favicon<\/a><\/strong> o l’<\/span>avatar<\/a><\/strong> di Facebook<\/span><\/p>\n

4 – Deve essere anche adattabile all’<\/span>icona<\/a><\/strong> di un’app<\/strong> per iPad<\/span><\/p>\n

Detto questo ho cominciato a lavorare sul “concept”<\/strong>, la fase nella quale si sviscerano tutte le possibili configurazioni del marchio e si arriva all’idea finale<\/strong>. Per evitare ogni elemento figurativo il progetto si \u00e8 orientato subito verso un logotipo<\/strong> cio\u00e8 un marchio composto dalla parola stessa <\/strong>(come \u00e8 scritto nella testata del <\/span>sito<\/a><\/strong>) ma Didatticarte \u00e8 un nome molto lungo, non potrebbe funzionare nei formati piccoli come una favicon.<\/span><\/p>\n

\"\"<\/span><\/p>\n

Allora ho deciso di lavorare sulle iniziali<\/strong> delle due parole che compongono il nome: Didattic-Arte<\/strong>, quindi la d<\/em><\/strong> e la a<\/em><\/strong>. Il primo tentativo \u00e8 piuttosto disorganico; affiancare o sovrapporre<\/strong> leggermente una D e una A maiuscoli non crea il senso di unicit\u00e0 e integrazione<\/strong> tra le due lettere.<\/span><\/p>\n

In queste prime fasi affianco lo schizzo a matita<\/strong> alle prove con <\/span>Adobe Illustrator<\/a><\/strong>. \u00c8 fondamentale non cedere alla tentazione di lavorare subito solo in vettoriale: lo schizzo a matita \u00e8 importante per avere una risposta immediata, una lavorazione quasi artigianale dell’idea<\/strong>.<\/span><\/p>\n

\"\"<\/span><\/p>\n

Il passo successivo \u00e8 venuto fuori dall’osservazione che la a e la d minuscoli, in alcuni caratteri tipografici come Century Gothic<\/strong>, Futura<\/strong>\u00a0o Monaco<\/strong>, hanno la pancia<\/strong> in comune. Cos’\u00e8 la pancia? \u00c8 quell’occhiello<\/strong> che hanno alcune lettere (ad esempio la p, la d e la g), come si pu\u00f2 vedere da questa nomenclatura.<\/span><\/p>\n

\"\"<\/span><\/p>\n

Tornando alle mie due lettere, allora basta disegnare una d e sovrapporre la a<\/strong>. In pratica si tratta di una a<\/em> con un tratto ascendente di un altro colore.\u00a0Il risultato per\u00f2 non \u00e8 soddisfacente: credo che non sia cos\u00ec immediato individuare le due lettere<\/strong> come elementi distinti e poi sovrapposti.<\/span><\/p>\n

\"\"<\/span><\/p>\n

Continuando a manipolare la d<\/em> e la a<\/em> ho notato che funziona meglio una sovrapposizione parziale<\/strong>, quasi che la d sia l’ombra della a<\/strong>. Il font con cui questo funziona meglio \u00e8 il Futura<\/strong>. Perch\u00e9 non cerco un carattere pi\u00f9 “sofisticato”, qualcosa di meno comune?\u00a0In altri casi l’avrei fatto ma stavolta credo che sia meglio utilizzare un font di sistema<\/strong> in modo che, se avessi bisogno di ridisegnare il marchio in vettoriale su un qualsiasi altro computer, so di avere sicuramente il carattere che mi occorre.<\/span><\/p>\n

\"\"<\/span><\/p>\n

A questo punto il marchio \u00e8 deciso. Occorre definirne i dettagli<\/strong>: proporzioni<\/strong>, eventuale sfondo<\/strong>, colori<\/strong>, versioni monocromatiche e in negativo<\/strong>, per non parlare di tanti piccoli accorgimenti per migliorare la sovrapposizione (modifica di alcuni spessori<\/strong>, allungamento<\/strong> di alcune aste etc.).<\/span><\/p>\n

La versione con sfondo \u00e8 quella pi\u00f9 completa. Lo sfondo non pu\u00f2 che essere un quadrato con angoli arrotondati<\/strong> che ricalchi la forma dei tasti delle app<\/strong>.\u00a0Ho provato anche ad usare uno sfondo circolare<\/strong> ma entrava in conflitto con le curvature delle lettere indebolendone la forza grafica<\/strong>.<\/span><\/p>\n

\"\"<\/span><\/p>\n

All’interno del fondo quadrato (che decido di riempire con un tono grigio sfumato<\/strong>, proprio come in molte icone) devo collocare le due lettere e stabilirne definitivamente le proporzioni<\/strong>.<\/span><\/p>\n

Provo con un rettangolo aureo<\/strong> che contenga la d e la a ma mi sembra che il marchio sia troppo allungato e, nel caso di riduzione a favicon, cio\u00e8 in formato 48 x 48 pixel, le pance delle due lettere diventano quasi invisibili.<\/span><\/p>\n

Allora opto per un altro proporzionamento, quello del rettangolo diagoneo<\/strong>, un rettangolo creato dal ribaltamento della diagonale di un quadrato<\/strong>. \u00c8 una forma geometrica dinamica, un rettangolo irrazionale<\/strong> in quanto i due lati sono in rapporto pari a radice quadrata di 2<\/strong>, ed \u00e8 il rettangolo sul quale si basano i formati di carta UNI<\/strong> (tra i quali il comunissimo foglio A4<\/strong>). Dalla scelta delle proporzioni delle due lettere discendono anche le misure del quadrato di sfondo<\/strong>.<\/span><\/p>\n

\"\"<\/span><\/p>\n

Per quanto riguarda il colore decido di usare una tinta simile al\u00a0rosso porpora<\/strong>\u00a0(C=0, M=100, Y=100, K=20) per la a<\/em> e un grigio medio<\/strong> (C=0, M=0, Y=0, K=40)\u00a0per la d<\/em> in modo che questa sembri l’ombra della a. Nel caso della versione con sfondo, il grigio appartiene al quadrato (con sfumatura dal grigio 30% al 50%) e la d<\/em> diventa bianca.<\/span><\/p>\n

\"\"<\/span><\/p>\n

L’importante \u00e8 che i tre colori siano abbastanza diversi per tinta e luminosit\u00e0<\/strong> da non confondersi mai tra di loro, soprattutto nelle riduzioni del marchio.<\/span><\/p>\n

\"\"<\/span><\/p>\n

Ho fatto alcune prove con altre tonalit\u00e0 calde<\/strong> ma tendevano a “pasticciarsi” facilmente.<\/span><\/p>\n

\"\"<\/span><\/p>\n

Perch\u00e9 alla fine ho scelto il porpora<\/strong>? No, qui non c’\u00e8 un motivo progettuale in senso stretto: \u00e8 semplicemente il mio colore preferito<\/strong>!\u00a0E le versioni monocromatiche<\/strong> sono fatte proprio con questo colore.<\/span><\/p>\n

\"\"<\/span><\/p>\n

Non ho proseguito, al momento, con altre declinazioni del marchio<\/strong> (cio\u00e8 l’immagine coordinata<\/strong>), dunque niente carta intestata o altro. Per ora mi serve solo per il sito, il blog e i social network, poi si vedr\u00e0.<\/span><\/p>\n

Non so se alla fine il risultato sia un buon marchio\u2026 \u00e8 perfettibile e criticabile ma, di sicuro, c’\u00e8 dietro un ragionamento coerente<\/strong> e un iter progettuale logico e conseguenziale<\/strong>.<\/span><\/p>\n

\"schermata-2016-11-11-alle-12-12-30\"<\/p>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

S\u00ec, lo so. \u00c8 un post piuttosto autoreferenziale. Ma, come in altri casi, mi interessa presentare il disegno del marchio Didatticarte non per autocelebrazione...<\/p>\n","protected":false},"author":1,"featured_media":1755,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6,521,4,520],"tags":[21,41,44,59,76,96,122,124,152,154,185,195,241,242,258,270,351,352,357,372,408,410],"class_list":["post-1664","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-com-vis","category-creat","category-didattica-arte","category-dise","tag-app","tag-aureo","tag-avatar","tag-briefing","tag-cerchio","tag-concept","tag-diagoneo","tag-didatticarte","tag-favicon","tag-figura","tag-grafica","tag-icona","tag-logo","tag-logotipo","tag-marchio","tag-metodo","tag-progetto","tag-proporzioni","tag-quadrato","tag-rettangolo","tag-sfondo","tag-simbolo"],"_links":{"self":[{"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=\/wp\/v2\/posts\/1664","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1664"}],"version-history":[{"count":5,"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=\/wp\/v2\/posts\/1664\/revisions"}],"predecessor-version":[{"id":8503,"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=\/wp\/v2\/posts\/1664\/revisions\/8503"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=\/wp\/v2\/media\/1755"}],"wp:attachment":[{"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1664"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1664"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.didatticarte.it\/Blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1664"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}