Protocollo World Design
Principi, linee guida e risorse
Principi di design
Umano
La convinzione che le qualità organiche e imprevedibili dell'essere umano siano fondamentali per l'innovazione.
Universale
Un linguaggio visivo che va oltre ogni confine, cultura e storia, garantendo inclusività, accessibilità e connessione globale.
Ottimista
Credere nell'umanità e nel ruolo che la tecnologia può avere nel migliorare la vita di tutti.
Panoramica del marchio
Tutti gli strumenti fanno parte del marchio principale World.
Identità visiva
Logo World
Il logo World è il punto di riferimento visivo del nostro marchio: semplice, chiaro e universale. Basato su principi di design senza tempo, rappresenta il nostro impegno verso l'accessibilità, l'innovazione e la connessione globale.
Il nostro logo è il cuore dell'identità del nostro brand. Usa sempre il logo com'è e lascia un po' di spazio intorno per renderlo più visibile e di maggiore impatto. Modificarlo, distorcerlo o usare colori non autorizzati può rovinarne l'integrità.
Il nostro marchio è una parte importante dell'identità visiva del nostro brand e va d'accordo con il logo per far capire il nostro nome in modo chiaro e con stile. Non si possono fare modifiche, allungamenti o effetti non approvati al marchio.
Il logo lockup mette insieme il simbolo e il marchio in un unico design, che rappresenta il nostro brand nella sua forma più completa. Questo lockup va sempre usato così com'è, mantenendo le giuste proporzioni, spaziature e allineamenti tra gli elementi. Evita di separare, riorganizzare o ridimensionare i componenti da solo. Segui sempre le linee guida per dimensioni, spaziature e posizionamento per mantenere la sua integrità.
Lo spazio libero è la distanza minima tra il logo e qualsiasi altro elemento in un layout. La larghezza della “o” in world definisce lo spazio libero che circonda il logo.
Quando vuoi mostrare partnership o collaborazioni, il logo World può essere messo insieme al logo di un altro marchio nei seguenti formati.
Colori e gradiente
Crea un gradiente (Tutorial PDF)
- Il gradiente World è un elemento importante del sistema di branding principale. Trasmette speranza e ottimismo e può essere usato come risorsa di branding riconoscibile quando viene usato come sfondo.
- Dovrebbe essere usato solo nei colori indicati.
- Il gradiente deve essere creato come bitmap e poi colorato, assicurandosi che la risoluzione del bitmap segua le linee guida nelle pagine seguenti.
Gradiente — Risoluzione
I colori secondari sono usati sia per dare un tocco espressivo che per scopi pratici nel marchio World. Alcuni esempi sono: usare colori diversi per indicare i livelli di autorizzazione nei badge degli eventi, colori sfumati personalizzati per le bandiere nei materiali di lancio, la semantica dei colori nelle interfacce utente e immagini di supporto espressive.












Tipografia
Lausanne è un font sans-serif moderno e sofisticato, super versatile sia per il testo che per la visualizzazione. Si mette alla pari con i grandi sans-serif classici, ma con le particolarità della tipografia digitale. È l'unico font usato nel marchio World.
Pesi
Di seguito ci sono i tre pesi di Lausanne usati in tutto il marchio World. Sono la base di tutti i contenuti e qualsiasi eccezione o aggiunta deve essere approvata internamente.
In generale, queste regole possono essere usate praticamente in ogni situazione tipografica all'interno dei messaggi del marchio.
Il corpo del testo e le sezioni lunghe sono in peso 300. I titoli e i caratteri grandi sono in peso 400, mentre i sottotitoli e i titoli più piccoli sono in peso 450 per mantenere il grassetto pur essendo leggermente più piccoli dei titoli principali.


Le interlinee e il tracciamento
Allineamento
La collezione Tiempos è una famiglia di caratteri serif moderni pensati per la tipografia editoriale. Tiempos Headline è fatto apposta per titoli di grandi dimensioni, trovando un equilibrio tra praticità ed eleganza.
Pesi
Di seguito ci sono i due pesi di Tiempos Headline usati in tutto il marchio World. Qualsiasi eccezione o aggiunta deve essere approvata internamente.
Tiempos Headline è il nostro secondo font, usato solo in alcuni casi specifici, soprattutto quando il marchio si rivolge direttamente all'utente e vuole creare un senso di vicinanza.
Può essere utilizzato per pubblicità, merchandising e alcune schermate nella UX. Tutti i contenuti e qualsiasi eccezione o aggiunta devono essere approvati internamente.
Ruolo del font
Post sui social media, campagne, esclusività
Tiempos aggiunge un tocco umano e una voce diretta al linguaggio visivo del marchio. È perfetto per creare un tono accogliente, accessibile e raffinato in situazioni specifiche, quando si vuole comunicare in modo più intimo con gli utenti.


Usiamo il font Noto insieme ai nostri caratteri tipografici latini principali per garantire un supporto completo a tutti gli alfabeti non latini. Noto è stato scelto perché copre un sacco di lingue del mondo, offrendo una tipografia coerente e visivamente armoniosa in diversi alfabeti, come cinese, arabo, cirillico e giapponese.
Questo ci permette di mantenere la coerenza e l'inclusività del marchio, assicurando che la nostra comunicazione raggiunga gli utenti di tutto il mondo nelle loro lingue native, senza compromettere la leggibilità o la coerenza estetica.
Quando non puoi usare Lausanne, tipo in Google Slides, puoi usare un altro font dalla libreria Google Fonts: per il testo, usa il font Inter; per i titoli, usa il font Inter Tight. Puoi usare solo questi font dalla libreria Google Fonts e solo se non puoi usare Lausanne.
Composizione
La griglia è uno degli strumenti più importanti nel sistema di progettazione. È fondamentale per tutti i layout e le composizioni e va usata sempre. Che sia una griglia a 2, 4, 6 o 8 colonne dipende dalle dimensioni della tavola da disegno e da quanti elementi ci sono dentro, ma tutti gli elementi in una composizione dovrebbero essere allineati alla griglia sottostante e distanziati in modo proporzionale ai margini.
Materiali interni
Per tutto il materiale interno e il materiale promozionale del marchio, dove il logo compare insieme ad altre risorse e contenuti, il logo va messo nell'angolo in alto a sinistra del layout per garantire la coerenza.
Logo singolo
Nei layout in cui il logo è l'unico elemento, come le schede video o alcune campagne o annunci, il logo viene messo al centro del layout.
Profili social media
Logo su gradiente
Quando posizioni il logo sullo sfondo sfumato, assicurati di metterlo sempre nella parte chiara, così non si confonde e si legge bene.








Illustrazione
Ogni prodotto principale di World ha un'immagine che lo rappresenta, ispirata alla natura del prodotto o a quello che offre.
Anche se ci sono tanti modi per mostrare i dati, è meglio usare uno stile coerente. Contorni, forme geometriche per grafici e tabelle, usi delicati e mirati di riempimenti e colori sono gli elementi che rendono coerente la grafica di visualizzazione dei dati.
Le griglie a gradiente servono come grafiche colorate ed espressive e sono usate in due modi:
- Come rappresentazioni locali usando i colori della mappa di un paese come input per la transizione del gradiente
- Grafiche ambientali, non legate a specifici colori ma semplicemente espressive di uno stato d'animo o energia
Iconografia
Per agevolare identificazione e navigazione, ogni prodotto ha un'icona associata, sviluppata come forma abbreviata della relativa illustrazione di prodotto.
Le icone di prodotto devono mantenere lo stesso aspetto e spessore visivo attraverso le diverse dimensioni. Il peso di base usato è 1,0 px quando l'icona è impostata a 60 px di larghezza e, se viene ingrandita o ridotta, il peso dovrà adattarsi per preservare lo stesso impatto ottico del peso di base.
Quando le icone sono usate in contesti con altri elementi di un layout, come sul web, devono essere sempre allineate nell'angolo in alto a sinistra. In alcune situazioni, quando le icone sono mostrate insieme, senza altri elementi, possono essere posizionate al centro della composizione.
Risorse
Risorse per immagini hero, sfumature, simbolo della valuta WLD, Orb, World App, World Chain, ecc.



