Copy
# 055 — 14/12/2020 • Vai alla versione web

Stai leggendo un numero di Dispenser.Design, una newsletter che parla di design, tipografia, web e dintorni.

Per riceverla iscriviti qui.


Buongiorno (o buonasera), a seconda di quando aprirete questa email. In questo nuovo numero si parla di sistemi di design, in generale, che siano manuali d’uso del marchio o linee guide per comporre interfacce.

Si prosegue poi con le solite rubriche: un magazine, tre link e un font che valeva la pena segnalare.

Se non avete tempo di leggere tutta l’email ora e dovete scappare, vi metto qui comodo il link a una cosa da vedere. Una serie di manifesti realizzati da vari designer per la rivista Grafik


Questa newsletter ha un Canale Telegram, un profilo Instagram e un sito web.

È possibile lasciare un feedback a questo link, oppure scrivendo a email@dispenser.design, o su Twitter o su Facebook.

Progettazione e implementazione


Nel 2015 una piccola casa editrice indipendente di New York, Standards Manual1, ha lanciato una campagna di raccolta fondi su Kickstarter per la ristampa del manuale del marchio della Nasa del 1975. La campagna ebbe un enorme successo, raccogliendo quasi un milione di dollari. Buona parte di quel manuale, progettato dallo studio Danne & Blackburn, è disponibile anche in formato PDF sul sito della NASA. In quelle circa 100 pagine sono specificati i caratteri tipografici e i colori da usare; viene spiegato come applicare il marchio a una carta intestata o a una bolla di accompagnamento, come impaginare una brochure o una locandina, con anche suggerimenti al tipo di griglia e struttura del layout.

Circa un anno prima Standards Manual aveva avviato la campagna fondativa della casa editrice, quella per la ristampa del manuale d’uso della segnaletica della metropolitana di New York, realizzata da Massimo Vignelli e Bob Noorda (con il loro studio Unimark) alla fine degli anni ’602.

Scopo di quei manuali era di definire regole, processi e procedure affinché una nuova pubblicazione o una brochure (nel caso della Nasa), una nuova stazione o una nuova segnaletica (nel caso della metro di New York), fosse sempre coerente con il resto della produzione grafica.

Stabilire regole, processi e procedure è una fase importante e necessaria della progettazione grafica. È la fase in cui si definisce il sistema con cui bisognerà realizzare gli artefatti grafici, come costruirli e organizzarli. In settori in cui il design è integrato nel prodotto, pensiamo all’editoria o ai prodotti digitali moderni, stabilire cosa viene dopo diventa ancora più determinante. Diventa esso stesso un elemento di identità e branding. Pensiamo alle case editrici e ai loro prodotti: i libri. Le copertine, il formato, il font sono elementi che definiscono una casa editrice e una determinata collana. Andando più nel dettaglio si può vedere come gli elementi che compongono un libro abbiano poi le proprie regole a seconda della casa editrice. Il colore del dorso, il verso con cui il testo è stampato sul dorso3, come appare una nota, come si gestisce un dialogo in un romanzo4.

Nei prodotti digitali moderni succede qualcosa di simile, oltre alle identità visive si definisce un sistema di processi e procedure che aiuta il prodotto a essere coerente, e riconoscibile. Oggi i manuali girano più sotto forma di sito web che di libro stampato, spesso sono anche accessibili a tutti. Possiamo consultare e leggere online il Design Language di IBM, e vedere come viene applicato al Carbon, il sistema di design open source di IBM, per prodotti ed esperienze digitali. L’IBM Design Language definisce l’uso del marchio, dei colori, del font, della tipografia. Definisce lo stile, il tipo di illustrazione e di fotografia da usare, o commissionare. Definisce il tipo di layout che rende meglio la loro idea di Design, con consigli pratici su allineamento e spaziature. All’interno di IBM quel manuale si consulta ogni volta che c’è da fare una brochure, una locandina, un manifesto o una campagna. Quando si progettano prodotti digitali si guarda a Carbon, che prende i principi di base del Design Language e li applica ai componenti con quali si costruiranno le interfacce: bottoni, modali, card, ecc.

Un sistema di design è un’insieme di cose. È prima di tutto la definizione di linguaggio visuale comune, che permetta a chi si occupa di una campagna o di un’app di rendere sempre riconoscibile IBM. È poi una cassetta degli attrezzi, che permetta a chi si occupa dell’app di renderla coerente non solo con il marchio, ma anche con le altre app. Funziona su almeno due livelli, quello generale, relativa all’identità visuale e quello che si applica uno specifico prodotto o uno specifico artefatto.

Nel numero #051 avevamo fatto l’esempio di un servizio digitale dedicato ai viaggi, WeTravel. In allegato a quel numero c’era questo documento Figma che mostra le cose che si dovrebbero fare, lato prodotto e lato comunicazione. Nella colonna comunicazione, tra Blog, Help Desk, Guide all’uso ci sono almeno tre esempi in cui probabilmente ci sarà un sistema di design che applica e declina i principi di base del “linguaggio di design” di WeTravel. Tre sistemi che avranno molto in comune, ma non tutto, perché hanno esigenze e scopi di versi. WeTravel potrebbe decidere di pubblicare anche una rivista. In questo caso avremo un altro sistema di design, sempre declinato dal “linguaggio di design” principale, dove invece di card e modali ci saranno indici e sommari.

Anche con un magazine ci muoviamo ancora su due livelli, uno generale e uno specifico. Nel momento in cui decidiamo di accogliere prodotti dall’esterno, apriamo un App Store, serve un terzo livello. Servono indicazioni che aiutano chi lavora all’esterno dell’azienda a creare qualcosa di coerente con l’intero ecosistema5.

Progettare è sia la creazione di un artefatto che la sua implementazione6. È pensare come appare, ma anche come funziona a seconda dalla situazione, del contesto e dell’uso che se ne fa.


Note

  1. Standards Manual è una piccola casa editrice specializzata nella pubblicazioni di manuali grafici, fondata dai designer Jesse Reed Hamish Smyth. ↩︎
  2. La campagna fu un successo, con oltre 800.000 dollari raccolti. ↩︎
  3. Ad esempio nei libri Einaudi (come nei libri della maggior parte delle case editrici) il testo va dall’alto verso il basso, nei libri Adelphi dal basso verso l’alto. ↩︎
  4. La maggior parte delle case editrici utilizza le virgolette basse o alte, Einaudi preferisce il trattino. ↩︎
  5. Per una guida pratica allo sviluppo di un Design System vi rimando a questo articolo di Riccardo Ghignoni su UXTales. ↩︎
  6. Riccardo Falcinelli, Critica portatile al visual design, Einaudi, Milano, 2014. ↩︎

Nelle linee guide relative all’illustrazione IBM sottolinea l’importanza di comunicare in scala “micro” e “macro”. 

Questa in alto è usata come esempio di illustrazione “micro”.

Poly Sans di Gradient

Poly Sans è un carattere tipografico della type foundry norvegese Gradient. Progettato da Milos Mitrovic, è disponibile in quattro pesi, con relativo corsivo, e in versione monospaziata, sempre con quattro pesi e relativo corsivo.

Il Poly Sans è una reinterpretazione dei classici sans-serif della metà del 1900. Le lettere hanno un inktrap appena accennato e un corsivo con una forte personalità.

Ricevi questa email perché sei iscritto alla newsletter Dispenser.
Se non vuoi ricevere più questa newsletter puoi cancellarti da qui.

Newsletter curata da Ciro Esposito — a Catania.


Email Marketing Powered by Mailchimp