Impaginaz. Tesi Prova

7/23/2019 Impaginaz. Tesi Prova

1/80


2/80

RelatoreRenato Galasso

AllievoAntonino Crivello


3/80

Indice

4

8

11

14

16

18

44

50

54

68

Introduzione

Ispirazione

Obiettivo

PSR Sicilia

Preview logo

Il logo

Le varianti

Preview sala

I mockups

Il sito web


4/80

1. Introduzione

[Fletcher/ Forbes / Gill]

4


5/80

1. Introduzione > esempi di dinamicit

Uno dei primi marchi flessibili pu essere considerato quello adotta-to dallazienda francese Michelin, la cui mascotte Bibendum (cono-sciuto in Italia come omino Michelin) rappresentata in moltissimevarianti, evolvendo anche il suo aspetto nel tempo.E a partire dagli anni sessanta che si sviluppano i primi progetti con-sapevolmente rivolti a creare un marchio variabile e identit visiveadottabili a diverse situazioni di applicazione.Nel contesto modernista pu infatti essere ricordato il codice visivoprogettato da F.H.K. Henrion per identificare le dodici societ appar-tenenti al gruppo Metra International; il sistema adottava una tramadi punti esagonale dal quale veniva ricavata liniziale di ogni aziendaaffiliata per costruire il marchio individuale, in coerenza con le altre.Pochi anni dopo Paul Rand che cerca di percorrere la strada delcinetismo, sviluppando una versione filmata del marchio della We-stinghouse, disegnato nel 62, in cui una breve animazione mostravail logo nel suo comporsi.Sar Mtv, a partire dalla met degli anni ottanta, a sviluppare una

delle prime identit dinamiche veramente di successo. Nata per rivol-gersi alle nuove generazioni, cariche di anticonformismo e alla conti-nua ricerca di nuove identit che valorizzassero le diverse culturegiovanili, Mtv ha adottato unidentit visiva in continua evoluzione,personalizzata di volta in volta da decine fra animatori, illustratori efilmaker. Nelle centinaia di versioni realizzate il logo di Mtv statotrasformato nelle pi differenti variet stilistiche, dal pop al techno,dallillustrazione al cartonesco, dal fumettistico alle animazioni tridi-mensionali; scegliere e interpretare visivamente le mode e i trendgiovanili diventato il suo elemento identitario. Ogni volta il logo presentato in una versione nuova, per poi tornare sempre allorigina-

le. Adattandosi al medio per cui nata (la televisione), alle mode eprendendo ispirazione dalle stesse novit espressive dei videoclip,

5


6/80

lidentit di Mtv ha cos continuato a svilupparsi presentando semprenuove interpretazioni di se stessa da ormai 25 anni senza sosta.Un altro esempio di rilievo spesso ricordato nei testi di storiadellimmagine coordinata, stato quello di Fiorucci che negli anninovanta, accostando figure di origine differente (da Mickey Mouse aipunti di raffaello), otteneva larmonia degli elementi in situazionisempre imprevedibili e rivelava una totale assenza di sistematicit.>. Gi nel 1987 Aldo Colonnetti affermava che inFiorucci tutto appare . ConFiorucci la disomogeneit sotto controllo diventa il segno di coordi-namento e riconoscimento fondamentale.Proprio da questi esempi tra la fine degli anni ottanta e linizio deglianni novanta inizia a svilupparsi una riflessione teorica sulle necessitdelle aziende di elaborare nuovi modelli di corporate identity.


6


7/80

I fattori tempo, variabilit, flessibilit e dinamicit sono quindi semprepi al centro del design e questo tipo di identit stanno diventandosempre pi diffuse; un esempio tra i pi conosciuti probabilmente illogo di Google, il quale viene reinterpretato in occasioni e momentiparticolari, anche a seconda della localizzazione geografica, per poitornare sempre alla sua versione originale. I designer stanno quindicomprendendo che la variabilit oggi pu essere il valore aggiunto adun progetto di immagine coordinata. Ma molti dei progetti sviluppatinegli ultimi anni non cercano solo di creare da un logo di partenza pi

varianti dello stesso da affiancargli; lobiettivo diviene definire, nelcuore stesso del progetto, una metodologia di variazione che per-mette di sviluppare pi varianti gi in fase progettuale, e la definizionedi un equilibrio tra elementi statici e variabili che formano la strutturae i rapporti alla base dellidentit.


7


8/80

2. Ispirazione

>

8


9/80

Lava unagenzia di comunicazione olandese specializzata nellosviluppo di dynamic identities. Secondo Lava oggi fondamentalesaper sviluppare identit dinamiche: lunica cosa su cui puoi contare il cambiamento. Unidentit non finita quando il manuale conse-gnato e pronto per dettar legge; questo solo linizio. Le organizzazio-ni sono dinamiche: esse sviluppano nuove strategie e servizi perrispondere ai propri clienti e al loro cambiamento. Di conseguenzaLava si propone di sviluppare progetti di identit che possanocrescere con lorganizzazione stessa: flessibili, vivi e sempre rappre-

sentanti le ambizioni correnti e future. Per la societ di produzionetelevisiva Idtv (la seconda dolanda) Lava ha sviluppato unidentitvisiva creata partendo da un sistema modulare basato su 4 differen-ti pixel, ognuno simboleggiante i principali campi di attivit di Idtv(film, tv, eventi e internet). I pixel, elementi base delle immagini televi-sive, costituiscono le fondamenta dellidentit e sono utilizzati comeun DNA; essi vengono utilizzati per comporre un logo, un caratteretipografico ad hoc e textures. Inoltre combinando le quattro formebase in diverse scale e tonalit cromatiche, Lava pu sviluppare pivarianti di ogni elemento dellidentit, dal logo alle pareti della sede.Per il solo logo stato calcolato che siano realizzabili pi di quattromi-la possibili combinazioni, ma ognuna di esse perfettamente ricono-scibile e allo stesso tempo unica.

2. Ispirazione > IDTV

9


10/80

2. Ispirazione > IDTV

10


11/80

3. Obiettivo

[Seneca]

11


12/80

Il mio obiettivo quello di progettare un logo che abbia come carat-teristica principale quella di generarsi da se (autogenerarsi). Il logodeve essere dinamico, capace quindi di modificare la propria formama deve essere ugualmente riconoscibile e infine, deve essere ingrado di tornare alla sua forma iniziale.

3. Obiettivo > Premessa

12


13/80


14/80

4. PSR Sicilia

[Seneca]

14


15/80

4. PSR Sicilia > cos?

Il PSR il Programma di Sviluppo Rurale, il suo scopo quello di pro-muovere lo sviluppo delle aree agricole e per farlo eroga anche deifinanziamenti. il documento programmatico che ogni singola Regione Italiana haprodotto per utilizzare al meglio le risorse finanziarie che la ComunitEuropea destina allammodernamento delle zone rurali, per renderle

maggiormente vive e competitive e per migliorare la sostenibilit am-bientale.Il PSR rappresenta una politica di sviluppo di lungo periodo e pertantoconsente lattuazione degli interventi necessari a sostenere il poten-ziamento del settore agricolo, alimentare e forestale, nonch la con-servazione e valorizzazione dellambiente e la crescita sostenibile deiterritori rurali della regione.Il Programma favorisce interventi finalizzati a rendere competitivalagricoltura, con un particolare riferimento alla sostenibilit ambien-tale, punta a promuovere i processi di ricambio generazionale, lade-guamento e lammodernamento delle aziende agricole, la multifun-

zionalit,tende a sostenere le strategie di filiera orientate alla valoriz-zazione delle produzioni agricole e forestali di qualit e ad operare sulterritorio attraverso un nuovo approccio progettuale di tipo territo-riale e integrato.

15


16/80

5. Preview logo

[Marcel Proust]

16


17/80

17


18/80

6. Il logo


19/80

6. Il logo > brainstorming

Dopo unattenta ricerca sul PSR ho eseguito un brainstormingevidenziando quelli che, per me, sono i punti essenziali: - Agricoltura; -Foresta; - Campi; - Campagna; - Terreno; - Alberi; - Foglia; - Fiore.

19


20/80

Mi sono soffermato sulla parola FIORE.Fiore, inteso come elemento principale che accomuna tutti gli altri,elemento minimo, nonch di partenza del mio intero progetto. Pen-sando ai fiori si arriva al pensiero filosofico della ciclicit: essi si gene-rano, crescono ed, infine, appassiscono. Poi nascono nuovamente e

tutto il ciclo si ripete. Tutto ci esprimibile con una sola parola: RIGE-NERAZIONE. I punti essenziali adesso sono: FIORE eRIGENERAZIONE (inteso come il processo di generarsi da se, auto-nomamente). Infatti il logo quello di un fiore ma la sua forma sardel tutto dinamica: dettata interamente dal nome del progetto SVI-LUPPO RURALE.

6. Il logo > ricerca e approfondimento

20


21/80

6. Il logo > costruzione

1 2

3 4

21


22/80

Nella figura (1) ho tracciato una circonferenza dividendola in 26 spic-chi (tanti quanto sono le lettere dellalfabeto). Nella figura (2) ho trac-ciato 26 circonferenze aventi ognuna il diametro pari al raggio dellacirconferenza della figura (1). Nella figura (3) Ho preso le lettere dellafrase SVILUPPO RURALE facendo in modo che ogni lettera non siripetesse pi di una volta e il risultato stato A E I L O P R S U V. Cosho eliminato tutte le altre lettere dalla circonferenza e, con dei seg-menti ho ottenuto un poligono. Nella figura (4) vediamo il nostro fioreche comincia a delinearsi: esso avr le punte che coincidono con ivertici del poligono ottenuto in precedenza. Il logo finale, che dinami-co, sar ottenuto tramite uno studio ben preciso. Esso dinamicopoich varia in base al nome del programma (sviluppo rurale nel

mio caso) e quindi, per lo stesso motivo, si generato un logo uniconel suo genere. Si utilizzer lo stesso procedimento per identificare lezone ben precise o i nomi di determinate sale.

6. Il logo > spiegazione

22


23/80


24/80

6. Il logo > shape ottenuta

24


25/80

Per finire, ho applicato la trasparenza del 50% a ogni petalo in modotale che le zone pi sovrapposte risulteranno pi scure.Viceversa, le zone meno sovrapposte, appariranno pi chiare.

6. Il logo > la trasparenza

25


26/80

RGB CMYK HTML

6. Il logo > il colore

C = 0%

M = 74%

Y = 71%

K = 0%

R = 235

G= 96

B = 71 eb6047

26


27/80

Il logotipo programma di sviluppo rurale un elemento base di iden-tit visiva da utilizzare sempre in combinazione con il marchio.Il logotipo del logo principale sempre del colore cos definito: [C=0,M=74, Y=71, K=0] tranne nei casi di forma negativa in cui deve essereutilizzato in bianco, o nel caso di stampa monocromatica in cui vautilizzato in nero.

Programma, di e rurale hanno un peso differente rispetto a svi-luppo. Per questo motivo, anche se scritto tutto attaccato, svilupporurale, risulta chiaro e leggibile.

6. Il logo > il logotipo

27


28/80

6. Il logo > font

Il font utilizzato il gratuito INTRO. Grazie alla sua struttura forte-mente geometrica esso si inserisce alla perfezione nel contesto,poich il logo stesso il risultato di svariate elaborazioni geometriche.Lutilizzo del logo con dei testi deve rispettare determinate regole.Per i testi su materiale di stampa e/o su altri supporti di comunicazio-ne deve essere impiegato il carattere INTRO nelle versioni regular,italic, bold, bold italic, thin, light, black.

28


29/80

6. Il logo > font

Intro lightabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTU-VWXYZ0123456789

Intro light italicabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTU-VWXYZ0123456789

29


30/80

6. Il logo > font

Intro lightabcdefghijklmnopqrstuvwxyz

ABCDEFGHIJKLMNOPQRSTU-VWXYZ0123456789

Intro light italicabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTU-VWXYZ0123456789

Intro blackabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTU-

VWXYZ012345678930


31/80

6. Il logo > font

Intro lightabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTU-VWXYZ0123456789

Intro light italicabcdefghijklmnopqrstuvwxyz

ABCDEFGHIJKLMNOPQRSTU-VWXYZ0123456789

Intro blackabcdefghijklmnopqrstuvwxyz

ABCDEFGHIJKLMNOPQRSTU-

VWXYZ012345678931


32/80


33/80

6. Il logo > a colori, in b/w e negativo

Versione positiva a colori

Per quanto possibile nella comunicazione deve essere utilizzata laversione a colori.

33


34/80

Versione positiva in bianco e nero

Utilizzata solo nei casi in cui lunico colore di stampa sia il nero (p. es.stampa su quotidiano, fax, stampa laser o ink-jet in bianco e nero) enon sia possibile adottare la versione a colori.


3


35/80

Versione negativa in bianco e nero

Utilizzata solo nei casi in cui lunico colore di stampa sia il nero (p. es.stampa su quotidiano, fax, stampa laser o ink-jet in bianco e nero) enon sia possibile adottare la versione a colori.


35


36/80

Le dimensioni ottimali del logo sono determinate dallutilizzo finale

dello stesso ai fini dalla sua leggibilit e vengono definite caso percaso.La larghezza minima consentita del logo per il formato tipografico di20x32 mm.

La larghezza minima consentita del logo per la visualizzazione a video di 300x385 px

20x32 mm. 300x385 px

6. Il logo > misure minime

36


37/80

6. Il logo > accorgimenti

Per una maggior chiarezza e armonia necessario effettuare deipiccoli, ma significativi, accorgimenti.Normalmente la traccia del rettangolo che contiene il logo spessa3pt. Pi il logo si rimpicciolisce, pi si deve diminuire lo spessore, finoad arrivare a 1pt nel logo con larghezza di 20mm.Stesso accorgimento deve essere usato per le la traccia delle celleche compongono i petali: qui si passa da una traccia di 0,5pt a una di0,3pt nel logo con largezza di 20mm.

37


38/80

X

Y/13

Y/13

Y/13

Y(X 1,3)

6. Il logo > proporzioni

38


39/80

6. Il logo > area di rispetto

La leggibilit migliore se lo spazio che circonda il logo sufficiente-mente ampio. Lo spazio minimo da rispettare tra Logotipo ed even-tuali altri elementi (testi, foto, illustrazioni) definito dallaltezza dellabarra verticale della lettera s ripetuta 3 volte. Come riportato infigura la distanza tra il logo e altri elementi visivi vicini deve esserecome minimo 3 volte laltezza dellunit di misura (s di sviluppo).Questo spazio da considerarsi minimo, pertanto, quando possibi-

le, bene venga incrementato.

39


40/80

Lorem ipsum dolorsit amet, consecte-tuer adipiscing elit.Aenean commodoligula eget dolor.Aenean massa.Cum sociis natoquepenatibus et magnisdis parturientmontes, nasceturridiculus mus. Donecquam felis, ultriciesnec, pellentesque

eu, pretium quis,sem. Nulla conse-quat massa quisenim. Donec pedejusto, fringilla vel,aliquet nec, vulputa-te eget, arcu. Inenim justo, rhoncusut, imperdiet a,venenatis vitae,justo.

Etiam ultricies nisivel augue. Curabiturullamcorper ultriciesnisi. Maecenastempus, tellus egetcondimentum rhon-cus, sem quamsemper libero, sitamet adipiscingsem neque sedipsum. Nam quamnunc, blandit vel,luctus pulvinar, hen-

drerit id, lorem.Maecenas nec odioet ante tincidunttempus. Donecvitae sapien utlibero venenatisfaucibus. Nullamquis ante. Etiam sitamet orci eget erosfaucibus tincidunt.Duis leo.

Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in,viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum.Aenean imperdiet. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sedconsequat, leo eget bibendum sodales, augue velit cursus nunc.

6. Il logo > esempio area di rispetto

40


41/80

6. Il logo > errori da evitare

Il marchio ha un solo andamento verticale e va utilizzato rispettandola forme descritte in questo manuale.Qui sotto sono riportate alcune ipotetiche scelte dutilizzo scorrette.Il marchio non va rappresentato con nessuna rotazione e con nessu-na inclinazione; il simbolo non pu essere diviso dal logotipo e rias-semblato con un diverso assetto da quello stabilito in questo progetto.

41


42/80

6. Il logo > errori da evitare

Il ridimensionamento del marchio va sempre effettuato in modo gra-duale e quindi mantenendo le proporzioni.Inoltre, il ridimensionamento va effettuato entro i valori delle misureminime indicate a pagina 36 (figure minime). Sono qui sopra rappre-sentate delle varianti infelici di ridimensionamento.

42


43/80


44/80

7. Le varianti

[Paul Graldy]

44


45/80

45

Lo scopo principale quello di dare una distinzione abbastanza netta al logodelle singole sale, senza per mai allontanarsi dal logo di partenza. Variaresolamente la forma non era ci che volevo, poich chi guarda per la primavolta il logo, magari non coglie subito la differenza con il logo principale e quindidifficilmente ricorder che tipo di sala ha appena visitato. Per questo motivoho deciso di dare un color identity differente per ogni sala e non solo unavariazione di forma, in modo che chiunque possa assimilare facilmente formae colore e quindi ricordarsi di che sala si tratta.La scelta dei colori stata dettata da una ricerca che ho effettuato riguardoi fiori spontanei che crescono nel suolo siciliano. Dopo aver trovato il nome delfiore bastato effettuare un campionamento colore, cos da scegliero quello

che pi mi interessava per il progetto. Ecco di seguito la lista dei fiori che hoscelto:

Anagallis arvensis Enula marina

Malvone perenneSilene gallica

7. Le varianti > spiegazione colori


46/80

46

7. Le varianti > campionamento colori

CMYK

HTML

C = 0%

M = 74%

Y = 71%

K = 0%

eb6047


47/80


CMYK

HTML

C = 0%

M = 44%

Y = 76%

K = 0%

f5a249

47


48/80


CMYK

HTML

C = 1%

M = 62%

Y = 31%

K = 0%

ef808c

48


49/80


CMYK

HTML

C = 33%

M = 78%

Y = 31%

K = 15%

a14b6e

49


50/80

8 Preview sala > sala amministrativa

50


51/80

8. Preview sala > sala direzione

51


52/80

8. Preview sala > sala conferenze

52


53/80


54/80

9. I mockups

[Bruno Munari]

54


55/80

9. I mockups > porta dingresso

55


56/80

9. I mockups > vari

56


57/80

9. I mockups > furgone psr

57


58/80

9. I mockups > T-Shirt 1

58


59/80

9. I mockups > T-Shirt 2

59


60/80

9. I mockups > timbro

60


61/80

9. I mockups > biglietto da visita

61


62/80

9. I mockups > magazine

62


63/80

9. I mockups > varie

63


64/80

64

9. I mockups > bag


65/80

65

9. I mockups > app


66/80

66

9. I mockups > app


67/80


68/80

68

10. Il sito web

[Tim Berners-Lee]


69/80

69

10. Il sito web > misure

Il sito web strutturato in 12 colonne ognuna delle quali larga 100pxintervallate da uno spazio di 13px.E strutturato in one page site, ovvero tutto in una pagina: in altotroviamo il men orizzontale con un meccanismo a scomparsa, adestra i 3 link istituzionali della Regione Siciliana, del Ministero dellePolitiche Agricole e dellUnione EuropeaA sinistra troviamo il logo con i colori principali.La sezione news sar in continuo aggiornamento.


70/80

70

10. Il sito web > preview

Preview della pagina del sito.


71/80

71

10. Il sito web > preview

Preview del sito con barra del men superiore in azione.


72/80

72

10. Il sito web > il codice


73/80


74/80

11. Le fonti consultate


75/80

11. Le fonti consultate > bibliografia & web

Il manuale del Deisn Grafico - Daniele BaroniIl mestiere del copy. Manuale di Scrittura Creativa - Michelangelo CovielloDesign e Comunicazione Visiva - Bruno Munari

www.google.itwww.aforismario.itwww.wikipedia.itwww.mtv.itwww.psrsicilia.itwww.colourlovers.com


76/80


77/80


78/80


79/80


80/80

Impaginaz. Tesi Prova

Documents

Transcript of Impaginaz. Tesi Prova