DESIGN SYSTEM
Il visual style del progetto AND è definito come un sistema visivo coerente e modulare,
progettato per garantire uniformità e continuità su tutti i supporti.
Il logo
Il logo nasce dall’unione di due simboli “&".
Questo richiama visivamente il concetto
di incontro, relazione e dialogo tra persone
La parola inglese “and” unisce elementi diversi senza annullarne le specificità, diventando una metafora della pluralità culturale.
Palette colori
La palette si caratterizza attraverso l’utilizzo del rosso, del blu e del giallo, selezionati come colori distintivi del progetto.
La scelta cromatica deriva dall’osservazione degli stemmi delle storiche famiglie di Perugia, nei quali queste tonalità ricorrono frequentemente, alternandosi e combinandosi come elementi simbolici ricorrenti della tradizione visiva locale.
Test del contrasto
Il test del contrasto visivo definisce le corrette modalità di utilizzo del logo su fondi in scala di grigi, verificandone leggibilità, riconoscibilità e stabilità percettiva.
Variazioni di colore
Lo stesso logo viene applicato su sfondo colorato e bianco, in base all'utilizzo delle sue varianti colore.
Usi impropri
1) Distorsione orizzontale
2) Distorsione verticale
3) Inclinazione del logo
4) Modifica cromatica
5) Alterazione delle proporzioni
6) Alterazione del posizionamento
7) Modifica tipografica
8) Applicazione di contorni
Tipografia
Lexend è una famiglia tipografica sans-serif progettata con l’obiettivo di migliorare la leggibilità e la velocità di lettura.
Il font nasce da un progetto sviluppato in collaborazione con Google e il team di Lexend, con un approccio basato su principi di accessibilità e ricerca cognitiva.
Il Vercetti è un carattere sans-serif contemporaneo progettato da Filippos Fragkogiannis e Richard Mandona e pubblicato nel 2022.
Il font include oltre 300 glifi, con supporto per le principali lingue europee, e integra funzionalità OpenType come legature e varianti tipografiche.
LEXEND 400
abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
1234567890
LEXEND 700
abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
1234567890
Test del contrasto
Il test del contrasto visivo definisce le corrette modalità di utilizzo del carattere tipografico su fondi in scala di grigi, verificandone leggibilità e stabilità percettiva.
Variazioni di colore
Lo stesso carattere viene applicato su sfondo colorato e bianco, in base all'utilizzo delle sue varianti colore.
Palette colori
Nelle applicazioni di co-branding, il marchio AND viene affiancato al secondo logo attraverso una composizione orizzontale studiata per mantenere equilibrio visivo, seguendo i rapporti della sezione aurea.
Quando il secondo marchio presenta una larghezza proporzionalmente simile a quella di AND, i due loghi possono essere mantenuti alla stessa altezza.
I due marchi sono separati da una sottile linea divisoria.
La distanza tra ciascun logo e la linea centrale corrisponde a 3X, mentre l’area di rispetto esterna dell’intero sistema è definita da un margine pari a 2X.
Varianti del logo
Il sistema visivo consente la generazione di 22 diverse interpretazioni, nelle quali “l’anello” in alto a sinistra è l’unico elemento grafico che non cambia nella generatività.
Le variazioni del logo sono state sviluppate a partire da una sperimentazione manuale condotta attraverso la manipolazione di un filo che rappresenta metaforicamente il legame tra persone, culture ed esperienze differenti.
Pattern
Il pattern istituzionale di AND Project è un elemento grafico dinamico e fluido, utilizzato come sfondo o texture d’accento.
Dal punto di vista applicativo, il pattern può essere mostrato anche solo parzialmente all’interno del layout, con la linea che fuoriesce dai margini o viene tagliata al vivo, rafforzando l’idea di un flusso continuo e in costante evoluzione.
Manifesti
I manifesti rappresentano una declinazione del sistema visivo sviluppato a partire dai simboli individuati durante la ricerca condotta presso la Biblioteca Augusta.
L’obiettivo è valorizzare e rendere riconoscibili gli elementi grafici emersi dall’analisi, trasformandoli in protagonisti della comunicazione visiva del progetto.
Wireframes
Wireframes del sito web di AND Project.
HOME
DIZIONARIO
CHI SIAMO
STYLE GUIDE
