A typefaces Atlas by Andrea Gessa

Typefaces atlas

a Typefaces atlas

progetto di un atlante interattivo dei caratteri tipografici

a Typefaces atlas

Studente Andrea Gessa 749279 Relatore Giovanni Baule

Politecnico di Milano â&#x20AC;˘ Scuola del Design Corso di Laurea Magistrale in Design della Comunicazione

Anno Accademico 2011/2012

Il carattere usato per il testo è lo Scala, disegnato in Olanda da Martin Majoor, prodotto da FontShop—Berlino, nel 1989. Per le intestazioni è stato usato lo Scala Sans, disegnato in Olanda da Martin Majoor, prodotto da FontShop—Berlino, nel 1994. Le didascalie e note a margine sono state composte nella variante Condensed. Il carattere usato per i capilettera è il Birdy, disegnato da Veronika Burian nel 2011, per TypeTogether.

Sommario

â&#x20AC;˘ Introduzione

pag.Xi

Abstract

pag. 13

Ricerca

pag. 17

2.1. Criteri di scelta

2.2. Studi tipografici ed esperienze personali Le ricette tipografiche La storia Lâ&#x20AC;&#x2122;anatomia e la tipometria

18 19 20 20

2.3. Manuali tipografici cartacei Gli Elementi dello Stile Tipografico Letter Fountain Type & Typography Hyperactivitypography From A to Z The Ten Commandaments of Typography . Type Heresy

21 21 23 24 25 27

2.4. Manuali tipografici interattivi 100Types Type Insight The Typography Manual

29 29 31 32

2.5. Database e catalogazioni di caratteri tipografici Typedia Identifont Live Font Sales The 100 Best Typefaces of All Times On Snot and Fonts A Modern Day Specimen Book Fontshop, Linotype, Myfonts Fonts in Use Fontbook

32 33 35 36 36 38 38 39 41 42

sommario

2.6. Applicazioni per la tipografia Typobase The Font Game Kerntype & Shapetype

43 43 44 44

2.7. Visualizzazioni tipografiche Periodic Table of Typefaces The 50 Most Popular Typefaces in the World A History of Western Typefaces

46 46 46 48

2.8. Visualizzazioni storiche ed evolutive Genealogy of Pop/Rock Music The History of Film Timeline of XX Century Art and New Media The Histomapfour Thousand Years of World History Cubism and Abstract Art Evolution of Life The Electromagnetic Spectrum

50 50 50 52 52 54 54 56

2.9. Atlanti interattivi The Civil War LRA Crisis Tracker Digital History Milestones in the History of Thematic Cartography, Statistical Graphics and Data Visualization The Rise of Megacities A History of Modern Music: the Timeline Climate Change: the Carbon Atlas Europe by Numbers: the Complete Interactive Guide Musical Nodes

57 57 58 59

A typefaces atlas

60 61 61 62 63 63 pag. 69

3.1. Esigenze 70 3.2. Risposte 71 3.3. Target 72 Studenti e neofiti 72 Insegnanti 73 Professionisti 74 3.4. Supporti 76 Html 5 76 Css 3 78 Javascript & jquery 78 Display ad alta risoluzione 79 3.5. Concept 79 3.6. Lingua di fruizione

3.7. Attori ruoli relazioni strumenti

Contenuti

pag. 85

4.1. Criteri per la scelta dei caratteri Caratteri di importanza primaria Caratteri di importanza secondaria Caratteri di terza classe di importanza

86 86 86 87

4.2. Indice di rilevanza

4.3. Scelta dei contenuti d’approfondimento

4.4. Conflitti e casi particolari

Struttura

pag. 91

5.1. Architettura dell’applicazione

5.2. I caratteri tipografici

5.3. Le schede dei caratteri

5.4. Le mappe

5.5. Le pagine di filtro

5.6. Pagine di approfondimento

5.7. Ricerca 100 6.

Dettagli e funzioni

pag. 103

6.1. Grafica dell’interfaccia Colori Font utilizzati Logo Homepage Barra di navigazione

104 104 105 106 106 108

6.2. Le mappe 108 6.2.a. Timeline 110 6.2.b. Geografia 113 6.2.c. Classificazione 116 6.2.d. Autore 118 6.2.e. Fonderia 120 6.2.f. Metodi di produzione 121 6.2.g. Destinazione d’uso 122 6.3. Le schede 123 6.3.a. Carta d’identità 123 6.3.b. Specimen 123 6.3.c. Anatomia 124 6.3.d. Glifi chiave 126 6.3.e. Type in use 126 6.3.f. Alternative e versioni 127 6.3.g. Consigli per l’uso 127

sommario

VII

6.4. Account utente Profilo utente Salvataggio preferiti Visualizzazione dei preferiti Caricamento dei font Caricamento dei contenuti di approfondimento 7.

Scenari utente

129 129 130 130 132 134 pag. 137

7.1. Adriano – studente

138

7.2. Roberto – insegnante

141

7.3. Claudio – professionista

142

Considerazioni finali & sviluppi futuri

8.1. Sviluppi futuri Sviluppo tecnico Incremento del database Potenzialità e difficoltà economiche Declinabilità Community

pag. 145 147 147 147 147 148 148

Appendice A

Target risultati del questionario

pag.151

Appendice B

Indice delle figure

pag.157

Appendice C Indice dei caratteri tipografici Caratteri di importanza primaria Caratteri di importanza secondaria

pag.161 162 164

Appendice D Fonti Tipografia Visualizzazione di informazioni Progettazione web Ispirazioni

pag.171 172 175 176 177

Grazie

pag.179

VIII

“

Di tutte le conquiste della mente umana, la nascita dell'alfabeto è la più importante.

”

Frederic Goudy, typedesigner

Introduzione

Perché un atlante della tipografia? Lungi da me il voler catalogare quasi sei secoli di storia, impresa che già altri prima, con capacità e mezzi di gran lunga superiori ai miei, hanno tentato con alterne fortune, vedi il progetto wiki di Typedia o l’applicazione per iPad FontBook sviluppata da FontShop. L’esigenza che ho riscontrato, in quanto amante della tipografia, della sua sottigliezza, delle ferree regole che da sempre la determinano, era di averne una visione d’insieme. Nonostante la passione che ha alimentato questo lavoro, e quindi i miei studi in questo campo, mi son reso conto dell’utilità che avrebbe uno strumento in grado di raccontare la storia della tipografia attraverso i momenti topici che ne hanno determinato l’evoluzione. Il confronto con i miei compagni di studi ha fatto emergere quanto questa necessità fosse condivisa. È stato semplice decidere che avrei indirizzato i miei sforzi verso uno strumento didattico per i giovani studenti di grafica e comunicazione in primo luogo, ma che potesse tornare utile anche ai professionisti grazie alla parte di archivio che sta alla base di un progetto simile. Una volta identificate poche decine di pietre miliari nella storia della tipografia è iniziato il progetto vero e proprio: pensare a come visualizzare questo database in modo da dargli una valenza didattica. Poiché il progetto è così indirizzato, la parte di database è limitata nel tempo – dal primo libro stampato da Gutenberg ad oggi – nella geografia – gli alfabeti latini – e in importanza, i caratteri capostipiti e che rappresentano le grandi ispirazioni. Ho progettato questo Atlante tenendo presente le sue potenzialità, predisponendolo a un’evoluzione verso questi territori e a possibili ampliamenti del corpo dei contenuti. •

XII

1 abstract

• egli ultimi anni si sta assistendo ad un ritorno di popolarità della tipografia, dopo che il web e le sue limitazioni tecniche ne avevano condizionato la diffusione. Tuttavia lo studio di questa disciplina viene spesso trascurato o compresso in corsi che, per motivi di tempo, non riescono a trattare adeguatamente la complessità dell’argomento. A Typefaces Atlas è un progetto che si propone come supporto alla didattica; fornisce a studenti e docenti un database di caratteri selezionati e catalogati, attraverso mappe concettuali che li visualizzano ognuna secondo una diversa chiave di lettura. A differenza di un normale database come quelli proposti dai distributori di font, più basati sulla ricerca, le mappe di A Typefaces Atlas permettono di navigare il corpo dei contenuti favorendo l’apprendimento, anziché filtrare semplicemente i contenuti secondo i desideri dell’utente. A causa della proliferazione di nuovi caratteri, dovuta alle nuove possibilità tecnologiche, si tende a trascurare lo studio approfondito di una singola famiglia di caratteri e delle sue potenzialità a favore della quantità, o gratuità. Per questo motivo ogni carattere sarà presentato con una scheda che ne permetta la conoscenza approfondita, anche dal punto di vista tecnico e pratico. I caratteri selezionati sono stati suddivisi in tre classi di importanza, per permettere agli studenti di comprendere quali sono state le pietre miliari nella storia del type design. A Typeface Atlas è una proposta alternativa ai database dei distributori, molto ricchi ma dispersivi e alle raccolte, sintetiche ma poco pratiche per scopi progettuali e operativi. •

about

credits

C login

a Typefaces atlas

signup

– ZOOM +

Maps/ TIMELINE

Typefaces

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

atlas

1800 →

FILTERS

typeface knowledge through interactive maps

medium

credits

C login

From

Select a year

↓

Select a year

↓

Importance ↑ high medium

maps

NED 2

low

1813

↓

Anatomy ↓

M.F. Benton UK Monotype

France 4

1817

Egyptian V.Figgins UK U. Caslon

SWI 3

Italy 4

1915 M.F. Benton USA ATF

FILTERS

BACK UP

apply filters to narrow down the search results

Period

Free search

Usage book

From

invitation

Typeface

C login

infographic

le erpress

about

credits

C login

a Typefaces atlas

signup

clarendon/ionic

humanist

grecian

FILTERS

aldine taste

latin/runic

Importance ↑

dutch taste

italian antique sans serif grotesque neogrotesque geometric

FILTERS Importance ↑ high

egyptian

roman sans

medium

low

Period ↑ From

Select a year

↓

Select a year

↓

Period ↑

UK 3 NED 2

From

Select a year

↓

Select a year

↓

←

Italy 1465

Sweynheym & Pannartz cut the firt roman in Subiaco

1485

Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese.

1501

Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese.

1524

1800

Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese.

GER

Production ↓

Usage ↓

Anatomy ↓

CONTACTS

Usage ↓

France 4

Classification ↓

BACK UP

Anatomy ↓

Italy 4

ABOUT

↑

→ “A Typefaces Atlas” is a project aimed to improve knowledge of typefaces. → It consists of interactive maps that browse through the milestones of typography. → Registered users can upload other typefaces IDs.

Andrea Gessa via Candiani 112, 20158 Milano +39 3400914931 ag@andreagessa.com

maps

about

credits

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

high medium

british taste continental taste fat face tuscan

– ZOOM +

Maps/ GEOGRAPHY

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

other Classification serif

– ZOOM +

Maps/ GEOGRAPHY

display

digital

Nation

maps

text

mechanical

Publisher

a Typefaces atlas

signup

logo

Production manual

Author

1450 1475 1500 1525 1550 1575 1600 1625 1650 1675 1700 1725 1750 1775 1800 1825 1850 1875 1900 1925 1950 1975 2000

↑

BACK TO THE MAP

1450 1475 1500 1525 1550 1575 1600 1625 1650 1675 1700 1725 1750 1775 1800 1825 1850 1875 1900 1925 1950 1975 2000

perform a search in our database

credits

Classification ↓

1915

G.G. Lange Germany Berthold

↓

Select a year

Usage ↓

R. Austin UK Miller

1975

Select a year

Production ↓

Monotype Scotch Roman

J.E. Walbaum Germany Berthold

From

about

GER 5

Period ↑

Walbaum

Anatomy ↓

UK 6

FILTERS

1804

Production ↓ Usage ↓

– ZOOM +

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

First Industrial Revolution Steam engine is used in mechanical production England pioneers this development

M.F. Benton USA ATF

Classification ↓

a Typefaces atlas

signup

Maps/ GEOGRAPHY

1915

Period ↑

TIM ELIN GEO E GR CLA APHY SS AUT IFICAT HO ION PUB R LIS PRO HER DU USA CTION GE

about

G. Bodoni Italy G. Bodoni

low

choose the map that will lead you trough the discovery of typefaces

1789 Bodoni

Importance ↑ high

MAPS →

maps

1450 1475 1500 1525 1550 1575 1600 1625 1650 1675 1700 1725 1750 1775 1800 1825 1850 1875 1900 1925 1950 1975 2000

maps

signup

1450 1475 1500 1525 1550 1575 1600 1625 1650 1675 1700 1725 1750 1775 1800 1825 1850 1875 1900 1925 1950 1975 2000

C login

Centaur Bembo Bodoni UK 3 NED 2 GER

France 4

Italy 4

What is A Typefaces Atlas? A Typefaces Atlas is a project aimed to improve knowledge of typefaces. It consists of interactive maps that browse through the milestones of typography. Registered users can upload other typefaces IDs.

Can I download your thesis? A Typefaces Atlas è un supporto dida ico per l’apprendimento dei cara eri tipografici più importanti, delle loro storie e dei loro autori. www.andreagessa.com/atypefacesatlas.pdf

a Typefaces atlas

– ZOOM +

From

Select a year

↓

1845

1926

1915

Select a year

↓

J. Baskerville UK J. Baskerville

M.F. Benton USA ATF

1750 Cochin

Production ↓

C.N. Cochin France C.N. Cochin

Anatomy ↓

1977

1750 Nome D. Caslon UK U. Caslon

1915

D. Caslon UK U. Caslon

1764

1788 Bell

Fournier P.S. Fournier France Fournier

R. Austin UK British Le er Foundry

1931

P.S. Fournier France Monotype

R. Austin UK Monotype

1750 Nome

1804

Walbaum J.E. Walbaum Germany Berthold

1975 G.G. Lange Germany Berthold

1817

Egyptian

D. Caslon UK U. Caslon

V.Figgins UK U. Caslon

1750 Nome

1813

1875

Monotype Scotch Roman

Bruce

R. Austin UK Miller

1915

M.F. Benton UK Monotype

1750 Nome D. Caslon UK U. Caslon

maps

1894

1915

L.B. Benton USA ATF

1975

M.F. Benton USA ATF

1896 Cheltenham B. Goodhue USA Kingsley/ATF

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

M.F. Benton USA Linotype

about

high

low

1450 1475 1500 1525 1550 1575 1600 1625 1650 1675 1700 1725 1750 1775 1800 1825 1850 1875 1900 1925 1950 1975 2000

1800 →

FILTERS

1757

Importance ↑

Baskerville

1789 Bodoni

1924

1915

J. Baskerville UK J. Baskerville

high medium low

From

Select a year

↓

Select a year

↓

From

Select a year

↓

Select a year

↓

Production ↓

Classification ↓

Fournier

Usage ↓

P.S. Fournier France Fournier

Classification ↓ Anatomy ↓

1804

about

credits

P.S. Fournier France Monotype

Walbaum

Monotype Scotch Roman

1931

1975

1915

R. Austin UK Monotype

J.E. Walbaum Germany Berthold

G.G. Lange Germany Berthold

didones

slab serif

scri i / calligrafiche

grotesque

ornati / fregiformi

neogrotesque

egiziani

geometrical

humanist

glyphic

onciali e amanuensi

script

nuovi lapidari / incisi

graphic

DIXON

FONT

humanist

century

aldine taste

jenson

dutch taste

bembo

british taste

garamond

continental taste

caslon

benton

fat face

baskerville

neoclassical

tuscan

times new roman

egyptian

bodoni

clarendon/ionic

didot

grecian

walbaum

script

latin/runic

centennial

graphic

italian antique

rockwell

grotesque

clarendon

nuovi transizionali

gothic

geometrici / slab serif

classic deco

lineari lapidari / modulati

typographic

neogrotesque

disorder

joanna

geometric

franklin gothic

roman

akzidenz grotesk

techno

helvetica

spezze ati / stencil

modular

universe

da ilografici

fantasy

lineari quadrati

futura

computerizzati

1788 Bell

R. Austin UK British Leer Foundry

1925

transitional

didones

lineari a contrasto

First Industrial Revolution Steam engine is used in mechanical production England pioneers this development

M.F. Benton USA ATF

1764

Production ↓

transitional

fantasie / moda

G. Bodoni Italy G. Bodoni

M.F. Benton USA Monotype

Period ↑

garaldes

lineari / bastoni

Period ↑

Anatomy ↓

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

humanist

garaldes

medium

D. Caslon UK U. Caslon

credits

VOX+

humanist

mediovali / gotiche

bodoniani / neoclassiche

Importance ↑

Usage ↓

– ZOOM +

Maps/ TIMELINE

BRITISH STD

lapidari / romani antichi

veneziani / rinascimentali

FILTERS

1750 Nome

D. Caslon UK U. Caslon

NOVARESE/FUGA

transizionali / barocche

1750 Nome

T. Stan USA ITC

Maps/ CLASSIFICATION

Century

D. Caslon UK U. Caslon

1986

M.F. Benton USA ATF

a Typefaces atlas

signup

H. Eidenbenz Switzerland Haas

1915

D. Caslon UK U. Caslon

C login

B. Fox UK Robert Besley & Co.

H. Jost Germany Bauer

1925

M.F. Benton USA ATF

Clarendon

G. Bodoni Italy G. Bodoni

M.F. Benton USA Monotype

M. Carter USA Linotype

1750 Nome

old face

1789 Bodoni

1924

Classification ↓

maps

modern

Baskerville

Period ↑

signup

vernacular

1757

D. Caslon UK U. Caslon

Usage ↓

1800 →

First Industrial Revolution Steam engine is used in mechanical production England pioneers this development

1915

medium low

C login

British Period

1725 Caslon

high

a Typefaces atlas

credits

sans serif

Importance ↑

about

text

1725 →

FILTERS

display

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

maps

serif

Maps/ TIMELINE

lineale

signup

1450 1475 1500 1525 1550 1575 1600 1625 1650 1675 1700 1725 1750 1775 1800 1825 1850 1875 1900 1925 1950 1975 2000

C login

frutiger

1813

meta avenir

R. Austin UK Miller

gill sans

M.F. Benton UK Monotype

optima

1817

syntax

Egyptian V.Figgins UK U. Caslon

1915 M.F. Benton USA ATF

a Typefaces atlas

low

garaldes

Select a year

↓

Select a year

↓

transitional

didones

slab serif

grotesque

ornati / fregiformi

neogrotesque

egiziani

geometrical

humanist

glyphic

fantasie / moda

From

garaldes

transitional

scri i / calligrafiche

lineari / bastoni

Period ↑

onciali e amanuensi

script

nuovi lapidari / incisi

graphic

nuovi transizionali

Production ↓ Usage ↓ Classification ↓

FILTERS

century

mediovali / gotiche

medium

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

FONT

humanist

transizionali / barocche

high

Anatomy ↓

jenson

dutch taste

bembo garamond caslon

fat face

baskerville

tuscan

times new roman

egyptian

didot

grecian

walbaum

script

latin/runic italian antique

gothic classic deco typographic

grotesque

disorder

bodoni

clarendon/ionic

graphic

geometrici / slab serif

lineari quadrati

high

aldine taste

british taste continental taste

benton neoclassical

lineari lapidari / modulati lineari a contrasto

Importance ↑

credits

DIXON

humanist

bodoniani / neoclassiche

Importance ↑

about

VOX+

humanist

veneziani / rinascimentali

FILTERS

BRITISH STD

lapidari / romani antichi

old face

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

maps

NOVARESE/FUGA

modern

signup

vernacular

C login

Maps/ CLASSIFICATION

sans serif

credits

text

about

display

serif

– ZOOM +

Maps/ GEOGRAPHY

maps

lineale

a Typefaces atlas

signup

145 0 147 5 150 0 152 5 155 0 157 5 160 0 162 5 165 0 167 5 170 0 172 5 175 0 177 5 180 0 182 5 185 0 187 5 190 0 192 5 195 0 197 5 200 0

C login

centennial rockwell clarendon

neogrotesque

joanna

geometric

franklin gothic

roman

akzidenz grotesk

techno

helvetica

spezze ati / stencil

modular

universe

da ilografici

fantasy

futura

computerizzati

frutiger meta

medium

avenir gill sans

low

optima syntax

France 4

GER 5

C login

a Typefaces atlas

signup

Maps/ CLASSIFICATION

SWI 3

Italy 4

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

FONT

humanist

bodoni

mediovali / gotiche

medium low

garaldes

Select a year

↓

Select a year

↓

Usage ↓ Classification ↓ Anatomy ↓

transitional

didones

slab serif

walbaum centennial rockwell clarendon

tuscan

joanna

egiziani

geometrical

humanist

humanist glyphic

egyptian

franklin gothic

clarendon/ionic

akzidenz grotesk

grecian

helvetica

latin/runic

universe

onciali e amanuensi

script

nuovi lapidari / incisi

graphic

italian antique

gothic

grotesque

nuovi transizionali geometrici / slab serif

classic deco

lineari lapidari / modulati

typographic

lineari a contrasto lineari quadrati

didot

dutch taste

fat face

neogrotesque

glyphic

aldine taste

british taste continental taste

benton neoclassical

grotesque

ornati / fregiformi

fantasie / moda

From

garaldes

transitional

scri i / calligrafiche

lineari / bastoni

Period ↑

Production ↓

credits

DIXON

humanist

transizionali / barocche

high

about

VOX+

humanist

bodoniani / neoclassiche

Importance ↑

BRITISH STD

lapidari / romani antichi

veneziani / rinascimentali

FILTERS

maps

NOVARESE/FUGA

old face

Anatomy ↓

NED 2

modern

Classification ↓

UK 6

vernacular

Usage ↓

USA 5

disorder techno

sans serif

↓

text

↓

Select a year

Production ↓

display

Select a year

serif

From

lineale

Period ↑

neogrotesque

futura frutiger meta

geometric

avenir

roman

gill sans optima

spezze ati / stencil

modular

syntax

da ilografici

fantasy

century

computerizzati

jenson bembo garamond caslon baskerville times new roman

about

credits

C Hello Andrea

1775

1800

1950

1925

1825

1975 2000

1875 1900

1850

1750

1775 1800 1825

1675 1700 1725

1725

1850

a Typefaces atlas

x-height

ORIGINAL DESIGN â&#x2020;&#x2018; Author: Claude Garamond

FILTERS

Year: 1550

Importance â&#x2020;&#x2018;

1692

W. Caslon

high

1766

baseline

Publisher: Claude Garamond

medium

descenders

Nation: France

low

1757: Baskerville

Period â&#x2020;&#x2018; From

Select a year

â&#x2020;&#x201C;

Select a year

â&#x2020;&#x201C;

1775

J. Baskerville

VERSION DESIGN â&#x2020;&#x2018;

1775

ascenders capitals

Author: Robert Slimbach Year: 1989

x-height

Publisher: Adobe

1740

G. Bodoni

Nation: USA

1813

baseline

CLASSIFICATIONâ&#x2020;&#x2018; 1764

F. Didot

descenders

Vox+: 1. Text typefaces 1.2 Garaldes

1836

maps

about

Hand gloves Garamond Premier Pro â&#x2020;&#x201C;

ascenders capitals

credits

C Hello Andrea

a Typefaces atlas

maps

SUBMISSIONS

Here is a preview of your favourites. You can manage them by adding your own tags or removing them from favorites.

Here you can see your accepted and pending submissions.

Username

Search: eg. serif, italy

Andrea E-mail ag@andreagessa.com

Favorites

Andrea

ag@andreagessa.com

Password

Accepted: 1 Pending: 1

Confirm

Tags: sans swiss cold geometric

J. Baskerville 1757 England J. Baskerville

Tags: serif industrial

C. Garamond 1530 France C. Garamond

Tags: serif classical book old-style

N. Jenson 1470 Italy N. Jenson

Tags: serif female venetian old-style renaissance

M. Majoor 1989 Netherlands FontFont

Tags: serif text book humanistic

X. Dupre 2005 France Emigre

Tags: sans text cool humanistic

J.E. Walbaum 1800 Germany J.E. Walbaum

Tags: serif didone elegant rigid

Baskerville

Notifications Send me an e-mail when a favorite font gets updated

Garamond

Keep me updated with your monthly newsleÂ?er Send me an e-mail when a font I submiÂ?ed has been accepted and published

Jenson

Save seÂ?ings

British Standard: II. Garaldes

Tags: sans new cool humanistic

New Submissions

Scala Delete Account

Aa Vista

medium low Period â&#x2020;&#x2018; From

Select a year

â&#x2020;&#x201C;

Select a year

â&#x2020;&#x201C;

1775

1825

Class: 1

1850

You have selected Typeface/ Garamond Premier Pro as a favourite. GARAMOND Would like to add PREMIERyouPRO

Typefaces by Baskerville:

Baskerville

Died: Birmingham, 1775 England

Year: 1550

baseline

Publisher: Claude Garamond

Gaskell, Philip (1973). John Baskerville: A Bibliography. Paul P. B. Minet. ISBN 0-85609-029-8.

descenders

Nation: France

Chisholm, Hugh, ed. (1911). "Baskerville, John". EncyclopĂŚdia Britannica (11th ed.). Cambridge University Press.

ascenders capitals

x-height

Source: Roman Construction: Continuous Shape: Round curves

1970

1975

1980

1985

1990

1995

2000

1975

2000

2005

Cara eri

Fonderie Olive Deberny & Peignot

high medium

SchriÂ gieĂ&#x;erei Gebr. Klingspor

Haasâ&#x20AC;&#x2122;che SchriÂ gieĂ&#x;erei

D. Stempel AG

D. Stempel

low

From

Select a year

â&#x2020;&#x201C;

Select a year

â&#x2020;&#x201C;

Linotype Hell AG

â&#x2020;&#x2019;

Mergenthaler Linotype

Period â&#x2020;&#x2018;

Compugraphic

Lanston Monotype

Production â&#x2020;&#x201C;

english elegant

transitional

Submit an author entry

about

credits

Terminals Baseline: Refined Ascenders: Refined

Linotype (Heidelberg)

Agfa/ Compugraphic

descenders

Modeling Contrast: Medium Axis: Inclined Transition: Gradual

Italiana

Rudolf Hell

FILTERS Importance â&#x2020;&#x2018;

baseline

Proportions Width: Narrow/Medium Capitals: Roman Ascenders: Higher X-height: Small

credits

1950

1925

1965

about

1875 1900

1960

1850

1725

1955

1950

1750

1675 1700

1945

1775 1800 1825

1940

1625

1550

1935

maps

1650

1930

1575 1600

1450 1925

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

1525

a Typefaces atlas

signup

1475 1500

C login

Maps/ PUBLISHERS

Chalet

VERSION DESIGN â&#x2020;&#x201C; CLASSIFICATIONâ&#x2020;&#x201C; FEATURESâ&#x2020;&#x2018;

1839

Haad glove s ITC Garamond â&#x2020;&#x201C;

Add your own tags

Benton, Josiah Henry (1914). John Baskerville: Type-founder and Printer, 1706â&#x20AC;&#x201C;1775. Boston: 1836 The Merrymount Press.

1768

ascenders capitals

Author: Claude Garamond

Related links

Example: http://www.fontshop.com

add another link

History and detailed info

Frutiger

maps

ANATOMY â&#x2020;&#x201C; â&#x2DC;&#x2122; KEY GLYPHS â&#x2020;&#x201C; TYPE IN USE â&#x2020;&#x201C; â&#x2DC;&#x2122; TIPS AND TRICKS â&#x2020;&#x201C; VERSIONS & ALTERNATIVES â&#x2020;&#x201C;

SPECIMEN â&#x2020;&#x2018;

Class: 1

Typeface/ GARAMOND PREMIER PRO

a Typefaces atlas

FEATURESâ&#x2020;&#x201C;

Myriad

C Hello Andrea

ANDREA 8 favs 2 submission | 1 accepted 0 authors

Teknion furniture systems Ability product brocure / Vanderbyl Design; Michael Vanderbyl / USA, 1997

VERSION DESIGN â&#x2020;&#x2018;

Period â&#x2020;&#x2018;

credits

(help me choose)

Nation: France

Geometric

From

about

Browse

Publisher: Claude Garamond

high

low

FEATURESâ&#x2020;&#x201C;

a Typefaces atlas

LOGO

maps

CLASSIFICATIONâ&#x2020;&#x2018;

For alphabetic scripts, movable-type page se ing was quicker and more durable than woodblock printing. The metal type pieces were more durable and the le ering was more uniform, leading to typography and fonts. The printing press was especially efficient for limited alphabets. The high quality and relatively low price of the Gutenberg Bible (1455) established the superiority of movable type in Europe and the use of printing presses

Maps/ USAGE

a Typefaces atlas

VERSION DESIGN â&#x2020;&#x2018;

signup

C Hello Andrea Class: 1

Typeface/

The world'sThis firstled known toAround themovable-type printing 1450, Johannes of the system Jikji Gutenberg in for 1377â&#x20AC;&#x201D;today invented the the printing printing was oldest created extant press in China movable and around independently metal1040 print A.D. book. developed by Bi The diffusion a movable oftype Sheng (990â&#x20AC;&#x201C;1051) both movable-type during system the in Song systems Europe, Dynasty;[1] along was, however, with following innovations limited:[2]in They casting the that, the first were metal expensive, movable-type type based and required onsystem a matrix anfor enormous and printing hand mould. amountThe of more was made in labour Korea involved during limitedthe innumber manipulating Goryeo ofDynasty characters the thousands (around needed for ofAuthor: European Claude Garamond 1230). This led ceramic to thetablets, languages printing or of inwas the an Jikji case important in of 1377â&#x20AC;&#x201D;today Korea,factor.[3] metal tablets Gutenberg was the the oldest extant required movable for first scripts tometal create based print hison type book. thepieces Chinese The from writing an alloy system, of lead, tin, Year: 1550 used today.[4] diffusion ofwhich both have movable-type and thousands antimonyâ&#x20AC;&#x201D;the systems of characters. was, samehowever, components still Publisher: limited:[2] They were expensive, and required an Claude Garamond Johannes led to theGutenberg printing ofinvented the Jikjithe in 1377â&#x20AC;&#x201D;today printing the enormous Around amount 1450, ofThis labour involved in manipulating Nation: pressofand oldest independently extantor movable developed metal aof movable print book. type The diffusion of the thousands ceramic tablets, in the case Korea, France system in both Europe, along withon systems innovations was,in however, casting limited:[2] the They metal tablets required formovable-type scripts based the Chinese type based were on aexpensive, matrix and and hand mould.anThe enormous more amount of writing system, which have thousands ofrequired characters. limited number labourof involved characters in manipulating needed for European the thousands of Around 1450, languages Johannes ceramic was Gutenberg an tablets, important invented or in factor.[3] thethe case printing Gutenberg of Korea, Author: metal was the tablets Slimbach first to create required hispress type forand pieces scripts independently from basedan onalloy the Chinese of lead,Robert tin, writing system, Year: and antimonyâ&#x20AC;&#x201D;the whichdeveloped havesame thousands components a movable of characters. type still used today.[4] 1989 system in Europe, along with Publisher: For alphabetic For alphabetic scripts, movable-type scripts, movable-type page was se ing was innovations in casting these ing typepage Adobe quicker and quicker more and durable more durable woodblock than woodblock printing. The printing. The based on athan matrix and hand Nation: metal typemetal pieces type were pieces more durable more and durable the le ering and the le ering mould. The were more limited USA was more was uniform, more leading uniform, toleading typography toneeded typography and fonts.and Thefonts. The number of characters printing press printing wasan press especially was especially efficient for efficient limitedfor limited for European languages was important factor.[3] alphabets. The quality The and quality relatively and low low the price of the Gutenbergalphabets. was the first tohigh create hishigh type pieces fromrelatively an price of Vox+: Gutenberg Bible (1455)Bible established (1455) components established the superiority the superiority of of alloy of lead, tin, andGutenberg antimonyâ&#x20AC;&#x201D;the same 1. Text typefaces movable type movable in Europe type in and Europe the use and ofthe printing use ofpresses printing presses still used today.[4] 1.2 Garaldes spread rapidly. spread The rapidly. printing Thepress printing maypress be regarded may be as regarded one as one British Standard: For alphabetic of the scripts, keyof factors movable-type the key fostering factors page the fostering se ing Renaissance[5] the was Renaissance[5] and toand due to II. due Garaldes quicker and itsmore effectiveness durable its effectiveness than its use woodblock spread its use around printing. spread the around The globe. the globe. Dixon: metal type pieces were more durable and the le ering 1. Old face Aldine The 19th leading century The 19th invention century invention of Hot of Hot typese ing metal 1.2 typese ing and roman and was more uniform, to typography andmetal fonts. The its successors its successors caused movable caused movable decline to in decline the 20th in the 20th printing press was especially efficient for to limited century.and relatively low price of the alphabets. century. The high quality Gutenberg Bible (1455) established the superiority of movable type in Europe and the use of printing presses spread rapidly. The printing press may be regarded as one of the key factors fostering the Renaissance[5] and due to its effectiveness its use spread around the globe.

Anatomy â&#x2020;&#x201C;

C login

credits

1976

maps

Tracking & Kerning Garamond remanins a popular book face. With a fairly low contrast of stroke thickness, it is light-colored on the page. Alteration of tracking is necessary only when reversing out of a solid color background. Only standard kerning is required

Text Sizes The ascenders are slightly taller than the capitals, which means a quite small x-height. It is a compact typeface and therefore an efficient user of space. Normally a small amount of leading is requiredâ&#x20AC;&#x201D;20% of body size is adequate. Garamondâ&#x20AC;&#x2122;s original typeface was designed for textured paper, so it can look rather light on smooth paper.

Display sizes Although not originally intended as a display face, digital versions make this possible, its elegant character giving text a polished look. It is important to reduce tracking as the size increase to maintaind good word fit. Twentieth century typefoundersâ&#x20AC;&#x2122; revivals have extended the family of Garamond by adding semibod and bold to the basic roman and italic.

about

Around 1450, Johannes Gutenberg invented the printing press and independently developed a movable type system in Europe. Light coloured

Track negatives Tracking: 10

Around 1450, Johannes Gutenberg invented the printing press and independently developed a movable type system in Europe. Small x-height â&#x20AC;&#x201C; Efficient use of space

Yesterday, all my tro Leading 20% of body size.

credits

C Hello Andrea Class: 1

Typeface/ GARAMOND PREMIER PRO ORIGINAL DESIGN â&#x2020;&#x2018; Author: Claude Garamond

Garamond Premier Pro Display

TIGHT FIT Reduce traking at big sizes

ascenders capitals

x-height

Publisher: Claude Garamond Nation: France

VERSION DESIGN â&#x2020;&#x201C; CLASSIFICATIONâ&#x2020;&#x201C; FEATURESâ&#x2020;&#x2018;

ascenders capitals

x-height

Source: Roman Construction: Continuous Proportions Width: Narrow/Medium Capitals: Roman Ascenders: Higher X-height: Small

maps

about

Jag Qt GRfsj

baseline

Year: 1550

Shape: Round curves

Big elegance

a Typefaces atlas

baseline

â&#x2020;?

Capital G with spur

descenders

credits

TYPE IN USE â&#x2020;&#x201C; â&#x2DC;&#x2122; TIPS AND TRICKS â&#x2020;&#x201C; VERSIONS & ALTERNATIVES â&#x2020;&#x201C;

Importance â&#x2020;&#x2018;

1946

Mechanical Phototypesetting punchcutting Digital typesetting and compositionGARAMOND of metal type

SPECIMEN â&#x2020;&#x201C; ANATOMY â&#x2020;&#x201C; â&#x2DC;&#x2122; KEY GLYPHS â&#x2020;&#x201C;

FILTERS

A list of typefaces

VERSIONS & ALTERNATIVES â&#x2020;&#x201C;

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

about

1885

Hand punchcutting and moveable type

â&#x2DC;&#x2122; TIPS AND TRICKS â&#x2020;&#x201C; VERSIONS & ALTERNATIVES â&#x2020;&#x201C;

maps

1450

SPECIMEN â&#x2020;&#x201C; ANATOMY â&#x2020;&#x201C; â&#x2DC;&#x2122; KEY GLYPHS â&#x2020;&#x201C; TYPE IN USE â&#x2020;&#x2018;

a Typefaces atlas

signup

SPECIMEN â&#x2020;&#x201C; ANATOMY â&#x2020;&#x201C; â&#x2DC;&#x2122; KEY GLYPHS â&#x2020;&#x201C; TYPE IN USE â&#x2020;&#x201C; â&#x2DC;&#x2122; TIPS AND TRICKS â&#x2020;&#x201C; VERSIONS & ALTERNATIVES â&#x2020;&#x201C;

C login

Maps/ PRODUCTION

Modeling Contrast: Medium Axis: Inclined Transition: Gradual Terminals Baseline: Refined Ascenders: Refined Decorations: None

On-screen display Screen resolution makes the detailed form of Garamond difficult to appreciate. Garamond should be used display sizes of 18-point and larger. For website design is best used within a PNG or JPEG.

18 points & larger

DISPLAY Garamond 24px and 42px

AaBbCc Handgloves Adobe Garamond Premier Pro â&#x20AC;&#x201C; Caption

AaBbCc Handgloves Adobe Garamond Premier Pro â&#x20AC;&#x201C; Caption Italic

abstract

2 ricerca

• na volta intuita la necessità di un atlante che trattasse di tipografia con una visione quanto più generale, è iniziata una ricerca su vari fronti per capire lo stato dell’arte in questo settore. In particolare sono emerse diverse applicazioni per a mobili progettate per essere dei piccoli manuali o dei database, ma nessuna di queste si poteva propriamente definire un atlante: mancavano di volta in volta il lato didattico o quello di reference. La ricerca per quanto riguarda la progettazione dell’artefatto si è spinta lungo due assi: digitale–cartaceo e atlante–manuale, dove per atlante si intende un sistema di visualizzazione di dati in grado di aggiungere informazione oltre i semplici contenuti forniti. Si è anche voluto dedicare un focus ad un gruppo di applicazioni – per lo più mobile – esplicitamente dedicate alla tipografia, da cui trarre spunto e ispirazione. Un’ulteriore ricerca è stata necessaria per quanto riguarda tutto il corpo di contenuti dell’applicazione, e ancor di più per i criteri di scelta e classificazione degli stessi. Gran parte delle informazioni ricavate in questa parte derivano da libri, – manuali e reference – autorevoli sulla tipografia, e da articoli raccolti su siti web e community specializzate. Altra fonte di fondamentale importanza e alla base di tutto questo lavoro, è la mia, seppur breve, esperienza personale di studio e passione dedicati alla tipografia, oltre ai preziosissimi insegnamenti ricevuti dai professori incontrati in questi anni.

2.1

criteri di scelta

Esplorando diversi campi, si è dovuta operare una scelta su quali esempi analizzare ed includere nella ricerca. Piuttosto che avere un panorama completo delle discipline analizzate si è voluto raccogliere gli spunti considerati interessanti ai fini del progetto, sfruttando di ciascuna area le peculiarità più utili ad un progetto interattivo dedicato alla didattica della tipografia. Si è cercato innanzitutto di avere dati che fondassero una base di conoscenze della materia prima, ossia la tipografia. In questo senso sono stati selezionati i testi consigliati dai docenti o più frequentemente riscontrati nelle bibliografie, includendo non tutto il corpo di libri disponibili, ma limitando la scelta a quelli riconosciuti come autorevoli, che tracciano un panorama completo della tipografia e si distinguono per un approccio personale alla materia; sono anche stati presi in considerazione testi che dedicano spazio ad argomenti poco o per nulla trattati da altri testi; altri testi sono stati selezionati per l’attenzione alla sintesi storica che sono stati in grado di fornire. Più relativamente al progetto dell’Atlante interattivo si sono ricercate modalità di visualizzazione, sia statiche che interattive, che permettessero una rappresentazione di fenomeni con evoluzione temporale, così come rappresentazioni basate sulla geografia nel tempo o che avessero l’intenzione di restituire all’osservatore l’idea di un contesto. Vista la natura interattiva dell’Atlante si sono cercati esempi in cui l’interattività forniva un aiuto nell’opera di comprensione di fenomeni complessi, o permettesse di studiare l’evoluzione degli eventi. 2.2 studi tipografici ed esperienze personali Alla base di tutto questo lavoro sta la passione sviluppata verso il mondo della tipografia. Oltre ad una predisposizione personale per tutto ciò che richiede precisione, hanno inciso notevolmente gli insegnamenti ricevuti durante la carriera universitaria. Il primo vero incontro con i caratteri risale al terzo anno, con il corso di Type Design, tenuto

allora dal Prof. Braccaloni e dal cultore della materia Andrea Bergamini. Il loro approccio indirizzato verso il progetto, ma attento alle radici storiche e alle fondamenta tecniche ha aperto un mondo nuovo in tutta la sua ricchezza e complessità. ґґ le ricette tipografiche In particolare il sistema di definizione di un carattere attraverso le sue particolarità anatomiche si è rivelato essere utile al fine di capire quali sono le variabili che ne determinano lo stile. Le stesse variabili saranno poi ritrovate nella classificazione Dixon, parte fondamentale del progetto. In particolare i parametri presi in considerazione sono: ԀԀ Costruzione ԀԀ Terminazioni ԀԀ Ascendenti ԀԀ Contrasto ԀԀ Larghezza ԀԀ Peso ԀԀ Asse ԀԀ Apertura Questo approccio molto attento alla sostanza è fondamentale per capire gli elementi veramente rilevanti dei caratteri, i quali si è poi cercato di ritrasmettere con il presente progetto.

fig. 1 Una delle ricette proposte come esercitazione dal Prof. Andrea Braccaloni.

Ricetta 3

Costruzione Terminazioni Ascendenti Contrasto Larghezza Peso Asse Apertura

0.94

a c

d a c

gessa andrea – 27.04.09 Ricetta tipografica - Template B3

ricerca

HNPAQnoba gsehmipdqv Politecnico di Milano · Facoltà del Design Corso di type design (sez. c2)

ґґ la storia Gli incontri con James Clough, sia durante il corso al terzo anno che nell’ambito del Corso di Alta Formazione in Type Design organizzato dal Poli.Design hanno invece fornito le basi per comprendere ed apprezzare i mutamenti e le evoluzioni avvenute nel tempo. Le nozioni di ordine storico e quindi evolutivo sono quelle che maggiormente mancano nella formazione dei giovani professionisti della comunicazione visiva, sia per la complessità che inevitabilmente cinquecento anni di storia si portano presso, sia per la mancanza di strumenti in grado di fornire una visione d’insieme, ma al contempo capace di sviscerare i contenuti del processo di evoluzione della tipografia. Gli insegnamenti di Clough hanno infatti evidenziato come la storia della tipografia, al pari delle altre discipline artistiche e scientifiche, sia difficilmente rappresentabile su un semplice asse temporale. Nelle sue lezioni il Prof. Clough ha fornito una vista panoramica delle varie epoche della tipografia, rintracciabili nel suo scritto Appunti sulla storia delle arti grafiche. Vengono identificate diverse aree di evoluzione della disciplina: l’incisione di caratteri, la composizione e la stampa, fino ad affacciarsi sull’attualità governata dal digitale, che rappresenta una rivoluzione in tutte e tre queste aree. ґґ l’anatomia e la tipometria

fig. 2 Lezione di anatomia di Piero De Macchi.

Per quello che riguarda l’anatomia delle singole lettere gli incontri con i docenti Piero De Macchi e Giò Fuga, sono stati dei concentrati di nozioni difficilmente pareggiabili per semplicità di spiegazione e concretezza. Sotto due punti di vista si sono rivelati utili ai fini del presente progetto: dare delle competenze di anatomia, sfruttate poi nella fase esecutiva, e nel rivelare, attraverso quelle che non sono altro che piccole fessure, la ricchezza di dettagli di cui ogni glifo, per quanto semplice possa essere, è portatore; considerando quanto poco sia cambiata la forma delle lettere in millenni di storia, l’attenzione a questi dettagli è elemento imprescindibile per una comprensione della materia adeguata da parte di chi dovrà essere un professionista della comunicazione visiva. Gli insegnamenti di Giò Fuga, di natura tecnica, risultano assai utili ad una comprensione ap-

profondita dei meccanismi percettivi dei caratteri. Sebbene non ci sia un riscontro diretto di queste competenze all’interno dell’Atlante, esse sono state indiscutibilmente utili nel corso dello studio e dello sviluppo dell’intero progetto e rappresentano uno strumento importante per chiunque si occupi di progettazione di artefatti visivi legati al testo. Si può quindi affermare che gli incontri personali, sebbene non sufficienti ai fini di questo lavoro, sono senz’altro risultati necessari nell’introdursi a questo mondo fatto di dettagli e sottigliezze che solo chi ha un gusto formato da anni di esperienza può essere in grado di comunicare, ma ancor di più quello che i personaggi su citati hanno trasmesso è la viscerale passione per la tipografia. 2.3 manuali tipografici cartacei Altra fonte imprescindibile sono i manuali studiati sia nel corso della carriera formativa, sia nella ricerca strettamente relativa al presente progetto. La loro importanza ricopre diversi campi: ԀԀ la necessaria formazione di base di qualsiasi argomento si vada a trattare; ԀԀ il ruolo di fonti per i contenuti che il presente progetto andrà a trasmettere; ԀԀ i metodi di visualizzazione utilizzati nella spiegazione dei vari elementi chiave; ԀԀ l’individuazione di quali sono i momenti chiave nella storia della tipografia e i caratteri chiave. Gli specimen, ossia quegli opuscoli usati dai venditori di caratteri per mettere in mostra le qualità dei propri prodotti, si sono rivelati un’ottima fonte di spunti per quanto riguarda la visualizzazione di peculiarità e delle personalità dei caratteri. ґґ gli elementi dello stile tipografico Robert Bringhurst—Edizioni Sylvestre Bonnard

Da molti è considerato la Bibbia per quanto riguarda la tipografia. Scritto con un tono quasi colloquiale, porta il lettore attraverso tutti gli aspetti fondamentali della tipografia, intrecciando le osservazioni più strettamente tecniche a una prospettiva storica e linguistica più ampia. La sua grande forza, da cui trarre ispirazione, è

ricerca

il non essere solamente un libro sulla tipografia, ma anche un libro di tipografia, dove gli insegnamenti elargiti permeano il libro stesso, fondendo teoria e pratica in un unico viaggio che cattura il lettore. Verso la metà del libro, dopo aver spiegato regole e consigli, tecniche e metodi per comporre propriamente testi di diversa natura, è presente un capitolo intitolato “Intermezzo storico”. Qui l’autore ripercorre brevemente l’evoluzione che i caratteri tipografici occidentali hanno subito dal periodo rinascimentale fino ai giorni nostri. La sua ricca e sintetica analisi tratta sia la genesi del carattere, con le metodologie connesse, sia gli aspetti più strettamente legati all’anatomia delle lettere, sottolineando quali fossero i passaggi che determinavano l’uno o l’altro stile. Oltre a queste nozioni alla base del progetto, sia nella struttura che nel metodo di visualizzazione dei contenuti, Gli elementi dello stile tipografico si è rivelato un’ottima fonte di contenuti; da esso infatti è stata estrapolata una selezione di caratteri, presente nell’ultimo capitolo, suddivisi per tipologia ed ognuno con una breve efficace descrizione. Inoltre nell’appendice si trova una breve biografia dei più influenti disegnatori di caratteri e delle principali fonderie.

fig. 3 Dettaglio de Gli elementi dello stile tipografico.

ґґ letter fountain Joep Pohlen—Taschen Books

Letter Fountain è senza dubbio la fonte principale per quanto riguarda i contenuti e l’ispirazione per il progetto che ho sviluppato. Si tratta di un manuale di recente edizione, corposo e ben strutturato. Rappresenta un utile strumento di reference per i professionisti e si presta ad avvicinare i neofiti alla tipografia con capitoli sintetici sulla storia del progetto e delle tecnologie. Riserva grande importanza allo studio dell’anatomia dei diversi caratteri, con focus sulle differenze e sui tratti salienti. È completo di una timelinefig. 4 illuminante sulla storia della tipografia, peraltro raffrontata con le altre arti visive, su cui si trovano caratteri, personaggi e innovazioni tecniche. Un altro contenuto risultato utilissimo è la timeline dei publishers, con le relazioni che nel tempo li hanno legati.

Oltre ad essere un ottimo reference propone delle innovazioni nel campo della classificazione dei caratteri, attraverso l’integrazione della classificazione Vox, diventata Vox+; rispetto all’originaria, adottata dall’ATypI (Association Typographique International), presenta:

ricerca

fig. 4 Dettaglio della timeline di Letter Fountain.

ԀԀ una divisione tra caratteri di testo, display, pittografici e non latini; ԀԀ un maggior peso riservato ai caratteri bastoni, con le suddivisioni che li riguardano; ԀԀ una classificazione dei caratteri display; La terza parte del libro presenta una selezione di caratteri, con relativi specimen e caratteri simili, che vanno a costituire il grosso del corpo di contenuti dell’Atlante. L’originale edizione olandese Letterfontein ha ricevuto un Certificato per l’eccellenza tipografica dal Type Directors Club di New York (TDC) nel 2010, e un red-dot design award dal Design Zentrum Nordrhein-Westfalen, Germania. ґґ type & typography Phil Baines, Andrew Haslam—Laurence King Publishing

Un altro manuale importante ed apprezzato dai docenti. In particolare si distingue per l’uso, quasi unico, della classificazione Dixon, basata anziché su aspetti univoci come la forma delle grazie o il periodo storico, sulle peculiarità anatomiche, molto simili al concetto di “Ricette tipografiche” proposto dal Prof. Andrea Braccaloni. Nella fattispecie sono stati tratti i parametri formali, coi rispettivi parametri, che la classificazione Dixonfig. 5 , intrecciati con le origini storiche dei caratteri, usa per classificare gli stessi: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

costruzione forma proporzione modellazione peso terminali glifi chiave decorazioni

Questi parametri verranno attribuiti ai singoli caratteri per favorirne la descrizione al di fuori della classificazione, in modo, inoltre, da essere utilizzati come filtri utili nel caso di una ricerca. Altra peculiarità, non sempre riscontrabile in altri manuali, è tutta la prima sezione dedicata alla linguistica. Anche il capitolo relativo all’evoluzione delle tecniche di stampa ed incisione dei caratteri è stato utilizzato ai fini contenutistici dell’Atlante.

fig. 5 Dettaglio della classificazione di Catherine Dixon in Type & Typography. Le origini della stampa nel tempo.

ґґ hyperactivitypography from a to z Studio 3—Gestalten

Un caso unico nel panorama della manualistica dedicata alla tipografia: all’apparenza si presenta come un sussidiario per bambini delle elementari, ma i contenuti che si trovano all’interno sono esercizi dal tasso tecnico elevato, in grado di mettere in difficoltà il più esperto dei tipografi. Questo lo ha reso una delle pubblicazioni più amate dagli appassionati del campo. È una fonte di ispirazione per molteplici motivi tra cui:

ricerca

ԀԀ il mood trasmesso, che si allontana notevolmente dall’immaginario classico della tipografia; ԀԀ la “scoperta” che è possibile trattare di tipografia, anche in modo approfondito, senza per forza risultare noiosi; ԀԀ l’attenzione riservata ai protagonisti e ai periodi storici, nonostante l’approccio fortemente pratico. ԀԀ una varietà immensa di esercizi, che oltre a mettere alla prova il lettore, hanno un valore didattico. Quest’ultimo aspetto è stato utile al fine di capire come visualizzare alcune particolarità, in modo diretto e non didascalico, facendo sì che fosse il lettore a trarre autonomamente insegnamento da ciò che il libro gli metteva innanzi. Nel dettaglio sono stati notati i seguenti criteri: ԀԀ attenzione alla diversità tra le famiglie di caratteri e agli elementi di distinzione; ԀԀ studio della nomenclatura; ԀԀ relazioni tra i disegnatori e le loro creazioni; ԀԀ contestualizzazione dei caratteri all’interno dei propri periodi storici; ԀԀ attenzione agli aspetti comunicativi dei caratteri;

fig. 6 Dettaglio su esercizi di Hyperactivitypography from A to Z.

ґґ the ten commandaments of typography π type heresy Paul Felton—Merrel Publishers Limited

Un libro che per la semplicità, sfrontatezza ed ironia ha colpito gli amanti del settore. Da un lato i dieci comandamenti della tipografia applicati magistralmente, dall’altro gli stessi comandamenti violati, in nome della sperimentazione e dell’espressività. Ancora una volta usare la tipografia per parlare di tipografia si è rivelata la scelta vincente. Dal punto di vista didattico la forza di questo libro risiede nella presa di coscienza che conoscere le regole permette di romperle ottenendo risultati mirati ed efficaci. Inoltre l’ironia che lo pervade fa si che un argomento serio e spesso serioso, come la tipografia, diventi un tema su cui ridere e scherzare, per la gioia, primi fra tutti, dei tipografi stessi.

fig. 7 Il primo dei comandamenti di The ten commandaments of typography.

ricerca

fig. 8â&#x20AC;&#x201A; La sua negazione in Type Heresy.

2.4 manuali tipografici interattivi Un’altra parte della ricerca indirizzata al progetto si è basata su manuali e supporti interattivi dedicati alla tipografia. Il mio interesse verso questi lavori si è concentrato su come l’interazione possa migliorare l’apprendimento. Finora i progetti che pongono l’accento sulla didattica o sull’apprendimento sono piuttosto esigui, ma offrono interessanti spunti. ґґ 100types Ben Archer—2007

Questo progetto di tesi di Ben Archer per il corso di laurea magistrale in Art & Design presso la AUT University Auckland è quanto di più vicino ho trovato alla mia idea. Il corpo dei contenuti è tratto dalla lista compilata nel 1999 da Paul Shaw per il Type Directors Club. Il sito permette una navigazione, sebbene difficoltosa, tra questi 100 caratteri attraverso diverse modalità: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

»» http://www.100types.com/

grandezza della famiglia; stili destinazione d’uso; ordine alfabetico; mappa geografica; timeline;

Alcune di queste modalità sono state studiate e perfezionate per il progetto dell’Atlante, ma l’idea di studiare modalità diverse per visualizzare

fig. 9 La mappa degli caratteri old roman secondo www.100types.com.

ricerca

aspetti diversi dei caratteri è, paradossalmente, un’unicum nel panorama attuale. Gli stili storici, la parte più interessante del progetto, vengono rappresentati in un albero genealogico che mette gli stili in relazione tra di loro. Ogni stile viene poi suddiviso nelle sue varie forme, ciascuna collegata ad uno o più caratteri rappresentanti della stessa. Ogni carattere viene presentato con un piccolo specimen e i dati classici della propria carta d’identità: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

fig. 10 100types, la mappa degli stili.

data; designer; fonderia; località; equivalente odierno; caratteri collegati; tecnologie di produzione; famoso per; diffusione; categoria; asse; terminazioni; biografia

Si tratta forse di una delle schede più esaustive disponibili attualmente. Questa completezza è possibile dal fatto che i caratteri in questione siano i 100 considerati migliori o più importanti della storia. Particolare attenzione merita la scelta di indicare un equivalente odierno e i caratteri collegati. Alla voce “famoso per” si ritrovano le caratteristi-

che che hanno fatto di quel carattere un punto chiave nella storia della tipografia.

fig. 11 La scheda dei Garamond.

ґґ type insight Dong Yoon Park—2011

Typography Insight è un’applicazione per iPad che introduce nuovi metodi per imparare ed insegnare i caratteri. Si propone come strumento di supporto per l’apprendimento e la distinzione dei caratteri più importanti, come il Garamond, il Baskerville, il Bodoni, il Century e l’Helvetica. Da principiante è difficile vedere le sottili differenze. Questo specialmente sui libri di testo, dove il carattere è presentato in piccole dimensioni. Typography Insight sfrutta l’evoluzione tecnologica dei tablet, principalmente l’interfaccia touch ed il display ad alta risoluzione dell’iPad, per visualizzare e manipolare i caratteri. È composto da tre parti:

»» http://typeinsight.org/

ԀԀ informazioni di base, con terminologia, caratteri classici – presentati glifo per glifo con le relative caratteristiche descritte brevemente – sistemi di misura e impaginazione; ԀԀ comparazione, per sovrapposizione e giustapposizione; ԀԀ approfondimento sul carattere: specimen

ricerca

con focus su elementi chiave dell’anatomia, link alle pagine di Wikipedia e mappa che indica dove è nato il carattere.

fig. 12 Type Insight in uso, prototipo del modulo di comparazione.

ґґ the typography manual Justin Stahl

The typography manual è un’applicazione sviluppata per iPhone da Justin Stahl. Si tratta di un semplice manuale della tipografia, dai contenuti molto concentrati e sintetici. È la prima vera operazione di questo tipo: rendere tascabile un manuale di tipografia. Nonostante le enormi potenzialità del mezzo l’interattività è piuttosto limitata e ci si trova dinanzi ad una sorta di PDF navigabile. 2.5

fig. 13 The typography manual, la pagina dell’anatomia.

database e catalogazioni di caratteri tipografici

La classificazione dei caratteri, la volontà di raccoglierli secondo una logica accessibile al pubblico e di trovare le relazioni tre le varie voci ha invece trovato ormai da tempo terreno fertile. I casi di database di caratteri o raccolte di essi sono infatti numerosi. In questo campo si è indagato cercando gli elementi ricorrenti, le classificazioni ed i metodi di visualizzazione, generalmente piuttosto carenti.

ґґ typedia Typedia è un sito-community per classificare i caratteri tipografici ed educare le persone su di loro. Pensato come un mix tra IMDb e Wikipedia, ma relativo alla tipografia. Gli utenti possono partecipare, aggiungere e modificare pagine sui caratteri tipografici o sui protagonisti. L’obiettivo è realizzare uno strumento didattico che renda indagabile facilmente l’origine, gli autori e l’importanza di ogni carattere. In pratica si tratta di un database che però poco aggiunge oltre ai dati stessi, se non la possibilità di indagare le relazioni tra le varie voci presenti all’interno. Tuttavia resta molto interessante come è stata sviluppata la parte di reference:

ricerca

»» http://typedia.com/

fig. 14 Typedia, scheda del Clarendon, con i dati e la sua storia.

ԀԀ designer ԀԀ fonderia ԀԀ anno di pubblicazione ԀԀ nazione d’origine ԀԀ classificazione ԀԀ formato originale ԀԀ distributore ԀԀ tags Questo ha fornito una buona base per capire quali fossero gli elementi che compongono la carta d’identità di un carattere, in particolare la voce Formato originale che indica quale fosse il metodo di produzione per cui è stato progettato. Inoltre anche qua si riscontra l’uso di tag ulteriori rispetto a quelle definite nei parametri principali. L’altro aspetto fondamentale è il lato Wiki di questo progetto: ogni utente registrato può infatti aggiungere o editare le pagine, in un sistema simile a Wikipedia, il controllo è effettuato dagli altri utenti. È possibile collaborare per completare le pagine già iniziate da altri utenti e aggiungere le immagini relative allo specimen. È anche possibile inserire i caratteri tra i propri preferiti e abbonarsi agli RSS di una singola pagina, per essere sempre aggiornati sugli avvenimenti che la riguardano. Altro elemento interessante è una query di ricerca su Fickr impostata per trovare foto taggate col nome del carattere affiancato a font – per esempio avenir font. Tentativo ammirevole, per cercare di contestualizzare il carattere nel mondo reale e staccarlo dal virtuale del monitor, ma la ricerca troppo generica fa sì che la maggior parte delle immagini siano scollegate dal carattere. fig. 15 Typedia, pagina per l’aggiunta di una voce.

ґґ identifont Identifont è un portale web che permette di identificare un carattere tramite una serie di domande ad esclusione. Oltre l’utilità del servizio, basato sulle competenze dell’utente, Identifont si basa su un database ricchissimo di voci relative ai font, intesi come caratteri digitali. Si potrebbe definire l’antenato di Typedia; infatti anche qua ci troviamo di fronte ad una raccolta di caratteri, organizzata secondo i criteri soliti e con i link relativi ad autore, publishers e caratteri affini.

»» http://www.identifont.com/

fig. 16 Identifont, homepage.

Sono presenti tre tipologie di collegamenti: ԀԀ font simili, presentati in una sidebar alla destra della pagina; ԀԀ font con lo stesso nome: questo permette di vedere un panorama delle diverse declinazioni derivate dal disegno originale. Ognuna di queste voci è affiancata da un indice di popolarità derivante dal numero di visualizzazioni; ԀԀ font inf luenzati e che hanno inf luenzato il font in questione: è forse la parte più interessante di tutta l’architettura del sito, nonché la più istruttiva. In questo modo si possono quindi intuire i rapporti evolutivi tra i caratteri. Inoltre Identifont ha dimostrato la fattibilità di un progetto simile già nel 2000. Il sito è ospitato su un server del MIT. I font sono stati ottenuti direttamente dalle fonderie e dai designer.

ricerca

fig. 17 Identifont, pagina dell’Avenir.

ґґ live font sales »» www.myfonts.com/fontmap/

fig. 18 MyFonts, la mappa delle vendite in diretta.

MyFonts

Questa mappa interattiva mostra su un planisfero gli acquisti in tempo reale dei font. Viene mostrata una miniatura del font collocata geograficamente al luogo in cui è stato completato l’acquisto ed un piccolo specimen. In questo modo si possono avere degli spunti interessanti e conoscere nuovi caratteri attraverso l’interazione, indiretta, con altri utenti.

ґґ the 100 best typefaces of all times »» http://100besttypefaces.com/

Una semplice pagina web che raccoglie i 100 migliori caratteri, votati da un gruppo di esperti del settore. Per ogni carattere viene fornita una breve presentazione, delle immagini che mostrano il carattere in uso e un modulo per commenti. È un progetto molto meno ambizioso e completo rispet-

to a 100types di Ben Archer. L’utilità di questa pagina sta nell’avere a disposizione, in modo semplice, una raccolta di caratteri scelti da esperti.

ricerca

fig. 19 100 best typefaces, con dettaglio sul Frutiger.

ґґ on snot and fonts Luc Devroye »» http://luc.devroye.org/

Un sito spartano, sviluppato per passione da un professore della School of Computer Science alla McGill University di Montreal. Raccoglie contenuti di varia natura inerenti la tipografia. Questa enorme ricchezza—si contano più di 40.000 pagine—viene vanificata da una scarsa organizzazione dei materiali. Interessante una sua suddivisione dei caratteri basata sul parallelismo con i movimenti artistici.

fig. 20 On Snot and Fonts, home page con la divisione per argomenti.

ґґ a modern day specimen book Nick Sherman—2004 »» http://nicksherman.com/

La tesi di Laurea di Nick Sherman, tipografo che lavora presso Font Boureau e Webtype, ed in precedenza autore della crescita di MyFonts. In alternativa agli strumenti attualmente in uso, ha proposto di sviluppare un nuovo strumento dinamico per navigare l’universo della tipografia, che intrinsecamente connettesse l’utente con i caratteri più appropriati per le loro esigenze.

“

… in a world where we have so many tools that connect information in a multi-dimentional way, our type classification is one dimentional...

”

La volontà di rappresentare la tipografia secondo diversi assi è alla base della scelta di usare un sistema di mappe e filtri per rappresentare le diverse caratteristiche dei caratteri. Sherman mette anche in evidenza le correlazioni tra le varie voci. La soluzione ipotizzata

vede come protagonisti i meta tag da attribuire ad ogni carattere. I caratteri vengono filtrati tramite i tag, come per esempio l’anno di progettazione o la classificazione, ed inseriti in un universo dove sono collegati ai parametri usati nel processo di ricerca. A questi parametri sono poi collegati tutti i caratteri che li soddisfano.

fig. 21 Il prototipo basato su nodi e tag di Nick Sherman.

ґґ fontshop, linotype, myfonts I principali venditori di caratteri possiedono sistemi avanzati di navigazione all’interno del proprio database di caratteri. Fontshop propone una ricerca tramite categorie, famiglie, designer, fonderie e liste compilate da esperti del settore. Specialmente queste richiamano interesse perché si discostano dalle classificazioni ordinarie:

»» http://www.fontshop.com/ »» http://www.linotype.com/ »» http://www.myfonts.com/

ԀԀ sottoclasse (geometrici, umanisti, garaldi…) ԀԀ genere (Grotteschi anglo-americani, costruttivisti, computeristici…) ԀԀ alternative ai caratteri più famosi ԀԀ novità per mese ԀԀ periodo storico (Art Deco, anni 20, vittoriani…) Linotype utilizza lo stesso sistema sviluppato da Identifont.[pg.35] MyFonts invece ha sviluppato un sistema di ri-

ricerca

cerca filtrata tramite parole chiave figlio delle ricerca di Nick Sherman,[pg.38] ma senza l’innovatività della sua visualizzazione ad universo. Oltre i sistemi di ricerca all’interno del database, Fontshop e Linotype riservano una sezione dei rispettivi siti alla visione dei caratteri ripresi in un contesto di utilizzo reale. fig. 22 MyFonts, homepage.

fig. 23 Linotype, homepage.

fig. 24 Fontshop, homepage.

ґґ fonts in use Fonts in use riprende quest’ultima funzionalità e ne fa il proprio cuore. Si tratta infatti di un buon database di fotografie che ritraggono i caratteri in uso. I contenuti, proposti dagli utenti, sono organizzati in questo modo:

»» http://fontsinuse.com/

ԀԀ industria di riferimento (moda, grafica, ecologia…); ԀԀ formato (affissioni, web, identità…); ԀԀ carattere utilizzato; Ogni progetto viene visualizzato con più foto e riporta i caratteri usati in una sorta di mini-specimen, l’industria di appartenenza, il formato del progetto e le fonderie dei caratteri usati, oltre ad una sezione dedicata ai commenti.

ricerca

fig. 25 Fonts in use, homepage.

»» http://www.fontbook.com/

ґґ fontbook Fontshop ha pubblicato il suo specimen anche sotto forma di applicativo per iPad. Tra i punti di forza l’interfaccia molto gradevole e chiara, un database enorme, caratteri suddivisi secondo le principali categorizzazioni ed un esaustivo specimen, con tutti i pesi, per i vari caratteri. Nonostante le ampie possibilità della FontShop, questa applicazione altro non è se non una trasposizione interattiva del catalogo; non presenta infatti gli elementi alla base di un apprendimento solido della materia, come, per esempio, un percorso storico o geografico, o la possibilità di confrontare i caratteri tra di loro.

fig. 26 Fontbook, pagina degli autori.

fig. 27 Fontbook, pagina di specimen del Bernhard Modern.

2.6 applicazioni per la tipografia Oltre i manuali ed i database si trovano numerose applicazioni, specialmente per devices mobile, dedicate alla tipografia. Tuttavia poche di esse sfruttano veramente le potenzialità fornite dai nuovi strumenti a disposizione. ґґ typobase Questa applicazione per iPad espone i font di sistema del tablet in vari modi. Fornisce informazioni sui singoli glifi nel font e del testo d’esempio in diversi formati e dimensioni. Sarebbe stato più utile se avesse contenuti caratteri storici ed il contesto degli stessi. Typo Base dispone di un’interfaccia semplice e ben progettata, ma è limitata ai font di sistema e non prende in considerazione informazioni utili all’istruzione ed i contesti storici.

fig. 28 Typobase, dettaglio della schermata comparativa.

ricerca

ґґ the font game »» http://fontgame.ilovetypography.com/

ILoveTypography

Questo giochino per amanti della tipografia, sebbene piuttosto semplice ha ottenuto un discreto successo. Il funzionamento è semplice: si devono indovinare quanti più caratteri vengono proposti dal gioco, scegliendo fra quattro opzioni. Ci sono tre livelli di difficoltà, che agiscono proponendo typefaces più o meno famosi. Un’altra modalità di gioco consiste nell’indovinare parti anatomiche, segni diacritici o glifi particolari. Anche qui la risposta dev’essere scelta fra quattro opzioni. Il gioco permette anche di registrarsi e salvare i caratteri preferiti tramite un account. ґґ kerntype & shapetype Mark MacKay—Method of action

»» http://type.method.ac/ »» http://shape.method.ac/

Questi due giochi on-line, sviluppati come operazione di marketing da Method of Action, pubblicati nel 2011 sono stati una novità nel mondo della grafica e della tipografia: gran parte dei professionisti e degli studenti ha partecipato e condiviso on-line i link. Si tratta di applicazioni sviluppate in ambito web che mettono alla prova le qualità dei visitatori invitandoli rispettivamente a crenare delle parole o ricostruire le forme di alcuni glifi. Hanno sancito una sorta di momento chiave nella storia dello sviluppo delle applicazioni per il web dedicate alla pratica delle discipline artistiche e grafiche. Tra gli elementi chiave: ԀԀ accessibilità a tutti, tramite Web e senza installazione; ԀԀ possibilità di intervenire ed interagire direttamente con le lettere; ԀԀ elemento di sfida contro sé stessi e contro gli altri; ԀԀ porta l’attenzione sui dettagli; ԀԀ aspetti specifici e di livello tecnico avanzato; ԀԀ l’aspetto didattico derivante dalla correzione degli esercizi e dal riferimento alle famiglie di caratteri usati; Grazie a questi esperimenti è risultato chiaro che sia possibile parlare di tipografia ad alti livelli tecnici e sormontando limiti tecnici che fino a poco tempo fa parevano insuperabili.

fig. 29â&#x20AC;&#x201A; Kern type, la homepage.

fig. 30â&#x20AC;&#x201A; Shape type, la homepage.

ricerca

2.7 visualizzazioni tipografiche In questi anni, a seguito del successo che l’infografica e la visualizzazione di dati sta riscuotendo, unita ad un rinnovato interesse per la tipografia, ha dato spunto ad alcuni episodi che si è ritenuto interessante indagare. ґґ periodic table of typefaces Cam Wilde—2009 »» http://bit.ly/cZCvHB

fig. 31 La tabella periodica dei caratteri, di Cam Wilde (pagina a fianco).

Questa tavola elenca i 100 caratteri più popolari, influenti e noti. Come per le tradizionali tavole periodiche, questa tabella presenta gli oggetti raggruppati per categoria: sans-serif, serif, script, blackletter, glyphic, display, grotesque, realist, didone, garalde, geometric, humanist, slab-serif e mixed. Ogni cella della tabella mostra il nome del carattere, il designer, l’anno di progettazione e la posizione classifica. La classifica è stata determinata ordinando e combinando diverse liste dei caratteri più influenti ed importanti, in base a quante liste citavano ciascun carattere e in che posizione – nel caso in cui si trattasse di classifiche. Non è stato possibile mantenere la classificazione per famiglie e contemporaneamente l’ordine in cui si sono classificati. Inoltre l’autore elenca le fonti usate per stilare la classifica. ґґ the 50 most popular typefaces in the world Shelby White—2011

Questa visualizzazione è più un esercizio di stile che non una vera infografica, in quanto le informazioni contenute sono difficilmente leggibili. Tuttavia è utile notare i dati relativi al carattere che vengono trasmessi – nome, anno, luogo in cui è stato progettato, designer – ed ancor di più le critiche che gli vengono mosse: ԀԀ testo di dimensioni minuscole; ԀԀ troppe linee che collegano il carattere alla mappa, tanto da perdere la tracciabilità; ԀԀ mancanza di esempi dei caratteri elencati; ԀԀ dubbi sull’importanza di dove un designer sia collocato geograficamente, se non per

ricerca

fig. 32 The 50 most popular typefaces in the world.

motivi di indagine storica; ԀԀ maggior rilevanza del periodo storico e delle inf luenze sui designer rispetto alla geografia.

ґґ a history of western typefaces Nick Sigler, Lauren Darrel — 2011 »» http://mashable. com/2011/12/08/ typeface-font-history-infographic/

Mashable.com ha sviluppato questa infografica, che traccia in breve la storia della tipografia occidentale. Operazioni del genere evidenziano come ci stia rendendo conto della necessità di una buo-

ricerca

fig. 33â&#x20AC;&#x201A; Infografica della storia della tipografia occidentale.

na formazione storica riguardo la tipografia. Dal punto di vista progettuale altro non è se non una timeline illustrata, i cui momenti chiave paiono scelti in maniera alquanto arbitraria. 2.8 visualizzazioni storiche ed evolutive È parso utile allargare la ricerca a campi esterni alla tipografia, per indagare le metodologie rappresentative a prescindere dai contenuti. Tra le varie rappresentazioni, quelle riguardanti la storia e l’evoluzione hanno suscitato maggior interesse, in quanto si tratta di discipline che presentano notevolissime complessità di rappresentazione, a causa dei molteplici fattori che nel corso del tempo sono intervenuti. ґґ genealogy of pop/rock music Reebee Garofalo—1978

Questa famosa visualizzazione, sviluppata a consuntivo di una ricerca – legata al libro Rock ‘n’ roll is here to pay: The history and politics of the music industry – rappresenta graficamente l’evoluzione del panorama musicale dal 1955 al 1978, relativamente ai generi pop e rock. La mappa riporta più 700 artisti e 30 generi musicali. Questi vengono rappresentati come flussi, più o meno lunghi a seconda della durata della carriera dell’artista considerato o del genere, collegati in ordine cronologico. Interessante come in questo modo sia possibile assimilare in filoni diversi artisti; si può anche facilmente notare come alcuni generi vadano a confluire o a generare diversi sottogeneri. ґґ the history of film Larry Gormley

Questa infografica mostra la storia del Cinema dal 1910 ad oggi. Più di 2000 lungometraggi vengono mappati in 20 generi, lungo uno span di 100 anni. Gormley esplicita i criteri con cui sono stati selezionati i film considerati: ԀԀ ԀԀ ԀԀ ԀԀ

hanno vinto importanti premi; sono stati acclamati dalla critica; sono considerati film chiave in un genere; hanno ottenuto il successo ai botteghini.

Si può considerare l’equivalente per il campo cinematografico di quella di Rebee Garofalo.

ricerca

fig. 34â&#x20AC;&#x201A; The Genealogy of Pop/Rock Music di Rebee Garofalo.

fig. 35 The history of film, dettaglio.

ґґ timeline of xx century art and new media Rama Hoetzlein—2009 »» http://www.rchoetzlein.com/ theory/2009/timeline-of-20th-cart-and-new-media/

fig. 36 Timeline of 20th c. Art and New Media, di Rama Hoetzlein.

Questa visualizzazione intendeva unire nella stessa timeline la storia dei media e dell’arte, rapportandola ad eventi politici e scientifici. Riesce piuttosto bene nel tentativo di raccontare la contemporaneità di questi accadimenti, ma per l’eccessiva linearità di ogni voce, non restituisce l’effettivo peso che ognuna di esse ha avuto, limitandosi a riportarne la durata temporale.

ґґ the histomap four thousand years of world history John B. Sparks, Histomap Inc.— ca. 1930 »» http://bit.ly/xHrzJI

Questo grafico riporta con grande semplicità e chiarezza una tematica complessa e contenutisticamente enorme come la storia dei popoli negli ultimi 4000 anni.

ԀԀ Le nazioni sono distinte mediante l’uso dei colori; ԀԀ la larghezza variabile indica la potenza delle nazioni in un determinato periodo di tempo; ԀԀ una linea tratteggiata indica fusioni tra diverse civiltà; ԀԀ il f lusso di ogni civiltà viene arricchito con indicazioni sui principali avvenimenti che ne hanno condizionato la storia.

fig. 38 The Histomap, dettaglio.

ricerca

fig. 37 The Histomap.

ґґ cubism and abstract art »» Alfred H. Barr, Cubism and Abstract Art Cambridge: Belknap Press – 1986.

Alfred H.Barr—1936

Questa visualizzazione è stata progettata per essere la copertina del catalogo per la mostra “Cubism and Abstract Art” del Museum of Modern Art of New York, nel 1936. Fu creata da Alfred H. Barr, allora direttore del moma di New York. A lui è riconosciuta l’introduzione di arte nuova nella società americana. La particolarità di questo diagramma consiste nell’aver volutamente tralasciato importanti eventi esterni dell’epoca, diventando quasi un albero genealogico dei movimenti artistici. In quanto albero genealogico ogni nodo ha dei genitori e dei figli, indicando così le influenze tra i vari movimenti.

fig. 39 La copertina della esposizione al MoMA di New York era una sintesi schematica dell’evoluzione dell’arte astratta.

ґґ evolution of life Leondard Eisenberg—2008 »» http://evogeneao.com/tree.html

Questa pregevole rappresentazione visualizza l’evoluzione delle forme di vita, dai primi batteri fino all’uomo.

ricerca

fig. 40â&#x20AC;&#x201A; Evolution of life; infografica di Leonard Eisenberg.

Sebbene mantenga la metafora dell’albero della vita, si distacca dalle coordinate cartesiane per utilizzare quelle polari. L’evoluzione è rappresentata lungo la circonferenza, mentre la temporalità è affidata al raggio. Alcune circonferenze interne sono esplicitate in quanto notevoli, come per esempio le estinzioni di massa. La forma derivante riprende quella di un nautilus, fornendo anche una forte metafora visiva della spirale della vita. Un’altra informazione che viene recepita in questo modo è la percentuale di forme di vita appartenenti ad ogni ramo biologico, comparate quasi come in un grafico a torta. ґґ the electromagnetic spectrum C. Howard Jones Westinghouse research laboratories—1970

fig. 41 Tabella dello spettro delle onde elettromagnetiche.

Lo spettro delle radiazioni elettromagnetiche viene qui rappresentato su coordinate polari. In senso orario, partendo da sinistra, si passa dalle onde lunghe a quelle ad alta frequenza. A seconda del raggio troviamo diverse informazioni relative ad ogni specifica gamma di frequenze, in particolare il nome delle radiazioni – trasmissioni energetiche, onde radio, microonde, infrarossi, luminose, ultraviolette, raggi X e raggi Gamma – le loro applicazioni e dove si possono ritrovare. L’utilità di questa visualizzazione consiste nel permettere l’affiliazione di queste ultime informazioni al nome della gamma.

2.9 atlanti interattivi Vista la natura del progetto che si sarebbe sviluppato, gran parte della ricerca è stata indirizzata verso atlanti e visualizzazioni interattivi. Si sono cercati riferimenti che avessero nella storia e nella geografia gli elementi principali. ґґ the civil war Eli Rosen—2012

Questa infografica interattiva è stata creata nell’aprile del 2012, come progetto finale del corso di Interactive Art and Computational Design allaCarnegie Mellon University. I dati sono stati tratti www.civilwar.com e wikipedia. Il progetto è stato costruito usando JavaScript e l’API di Google Maps. La visualizzazione fornisce un’interfaccia visiva per esplorare la guerra civile cronologicamente, geograficamente e per numeri. Quello che risulta particolarmente utile di questo lavoro è che dimostra la fattibilità di atlanti interattivi complessi, in cui si incrociano più variabili – tempo, geografia, feriti/morti. L’applicazione

»» http://www.elibrosen.com/ civilwar/index.html

fig. 42 The Civil war, infografica interattiva.

ricerca

fig. 43 The Civil war, dettaglio dello span temporale.

permette di impostare uno span di tempo lungo una timeline che dà un’anteprima degli andamenti delle battaglie che si sono combattute nel corso della guerra civile. Lo span di tempo funziona come filtro per le battaglie combattute e per i dati generali di vittime e battaglie. In questo modo è possibile analizzare facilmente come sono andate le sorti della guerra nel corso degli anni, Sulla mappa, navigabile e zoomabile, compaiono i simboli ad indicare le battaglie combattute. Le dimensioni dei cerchi indicano quante vittime ha provocato ogni battaglia, il colore indica a favore di chi si è conclusa la battaglia. Cliccando su una battaglia viene mostrato un paragrafo che riassume le statistiche ad essa relative e traccia un riassunto della battaglia stessa.

ґґ lra crisis tracker »» http://www.lracrisistracker.com

LRA Crisis Tracker è una piattaforma di mappatura e raccolta dati in tempo reale, creata per portare in trasparenza le atrocità commesse dal Lord’s Resistance Army, il gruppo creato dal Generale Kony, diventato caso mediatico nell’estate del 2012. Usando informazioni provenienti dall’Invisible Children’s Early Warning Radio Network, agenzie delle Nazioni Unite e da organizzazioni non governative locali, questo strumento permette una risposta migliore da parte dei governi e delle organizzazioni umanitarie. La mappa è navigabile nello spazio, come una comune mappa di Google. Attivando i filtri è possibile selezionare i tipi di eventi da monitorare – morti, rapimenti, ferimenti, scomparse – e se mostrare i punti singoli o una mappa che indica le zone più calde. In entrambi i casi la diminuzione dello zoom comporta una semplificazione delle mappa, con le

singole registrazioni che vengono accorpate in un unico simbolo o area. Inoltre, come nel caso precedente, una timeline permette di impostare lo span di tempo da considerare.

fig. 45 LRA Crisis Tracker, con le opzioni e i filtri attivi in diretta.

ґґ digital history Questo sito web è stato progettato e sviluppato come supporto all’insegnamento della Storia Americana nelle scuole e nelle università ed è supportata dal College of Education at the University of Houston. Il materiale sul sito include, oltre ad un libro di testo una gran quantità di contenuti. È interessante come l’home page sia una matrice che mette sugli assi cartesiani i periodi della storia americana e i vari campi d’insegnamento.

»» www.digitalhistory.uh.edu

fig. 44 Digital History, con la time line navigabile a fare da menu per i contenuti.

Ancora più interessante relativamente il progetto che sarà sviluppato, è la timeline interattiva che riassume i principali accadimenti della storia americana. Tra gli elementi risaltano:

ricerca

ԀԀ span temporale che diventa via via più zoomato man mano che si arriva alla contemporaneità; ԀԀ contestualizzazione geografica degli avvenimenti; ԀԀ breve descrizione degli stessi e possibilità di approfondire cliccando; ԀԀ suddivisione degli eventi in Politicidiplomatici, economici-sociali, culturali; ԀԀ riferimento costante e preciso dell’anno considerato e della popolazione relativa a quell’anno. ґґ milestones in the history of thematic cartography, statistical graphics and data visualization Michael Friendly, Daniel J.Denis—2001

Questa pagina fornisce una panoramica degli eventi nella storia della visualizzazione di dati, chiamati pietre miliari. La timeline è divisa in due sezioni verticali. Ciascuna delle due sezioni può essere mossa per vedere le pietre miliari di diversi periodi. Ogni pietra miliare nella timeline può essere cliccata per vedere una sintesi che include un link alla pagina completa e la categoria a cui appartiene. La categoria può anche essere cliccata per vedere le altre pietre miliari relative ad essa.

fig. 46 Infografica interattiva sulle carte tematiche.

ґґ the rise of megacities Nick Mead & The Guardian Interactive Team—2012

Questa infografica interattiva mostra la crescita delle città, con la dimensione dei cerchi ad indicare la popolazione ed il colore ad indicare la crescita in percentuale. La scelta di attribuire al colore una valore percentuale tuttavia è in contrasto con l’uso comune di restituire visivamente le percentuali tramite le diverse sfumature di grigio. Con una timeline è possibile esplorare l’evoluzione nel tempo.

»» http://bit.ly/St8azG

fig. 47 Rise of Megacities, infografica interattiva del Guardian.

ґґ a history of modern music: the timeline The Guardian & Observer—2011

Questa visualizzazione è interessante per essere volutamente mirata al racconto. Non fornisce una visione sinottica dell’evoluzione musicale, ma la racconta cronologicamente. È possibile vedere tutti i generi della musica contemporanea, o navigare attraverso uno solo di questi. Scegliendo un genere musicale è possibile vedere su corsie separate i diversi tipi di avvenimenti – pubblicazioni, morti, registrazioni, influenze, concerti. Ogni tipo di avvenimento è rappresentato sulla timeline da una diversa icona di diverso colore. Gli eventi sulla timeline si collegano agli articoli relativi sul sito del Guardian.

ricerca

»» http://bit.ly/lT5ANH

fig. 48 La storia della musica moderna, secondo gli articoli del Guardian.

ґґ climate change: the carbon atlas Christine Oliver—2008 »» http://bit.ly/11DAD

fig. 49 Infografica interattiva sulle emissioni di carbonio.

Questa visualizzazione interattiva, piuttosto semplice, visualizza l’emissione di CO2 dei singoli Paesi. Anche qui come in precedenza la forma degli Stati viene sostituita da un cerchio la cui grandezza rappresenta direttamente il dato d’emissione del singolo Paese. La posizione degli Stati però non subisce sostanziali variazioni rispetto alla geografia fisica.

ґґ europe by numbers: the complete interactive guide Ami Sedghi, Sheila Pulham, Paul Scruton, Martin Shuttleworth—2011

Questa guida interattiva raccoglie i dati relativi alle popolazioni europee – chi siamo, come viviamo, quanto ci costa vivere – e riorganizza gli Stati, rappresentati come cerchi, modificandone posizione, dimensione e colore a seconda delle variabili considerate. Il fatto di spostare le geografie in base al posizionamento nelle classifiche è uno spunto interessante, che permette di indicare quanto un Paese sia grande o piccolo, indietro o avanti, a seconda della chiave di lettura considerata.

»» http://bit.ly/icnzOi

fig. 50 Europe by Numbers, vista iniziale con gli Stati disposti secondo la geografica fisica.

ґґ musicalnodes Lisa Dalhuijsen

Il progetto Musical Nodes permette di visualizzare una rete flessibile di relazioni tra vari nodi, ognuno dei quali è una voce di una libreria musicale – genere, artista, album, canzone – e colorati secondo criteri più musicali: tempo, energia, ballabilità. La ricchezza e l’innovatività di questo progetto sta nel magnetismo delle etichette. È possibile infatti attribuire ad ogni nodo diversi generi musicali, che si comporteranno come magneti sul nodo

ricerca

»» http://www.studiowith.nl/ projects/musicalnodes/

fig. 51â&#x20AC;&#x201A; Europe by Numbers, con gli Stati disposti secondo la classifica del numero di medici.

stesso. Spostando le etichette, la rete si modifica proporzionalmente. In questo modo ogni elemento può avere attribuite diverse etichette, e la visualizzazione risultante restituirà l’indefinibilità propria del campo musicale, e specialmente degli artisti.

fig. 52 Musical nodes, un esempio della vista di una libreria secondo gli album.

fig. 53 Musical nodes, un dettaglio di visualizzazione per artisti e genere

ricerca

Ricerca

parole chiave digitale–cartaceo atlante–manuale applicazioni libri siti web type community applicati timeline classificazione Vox+ Dixon criteri modalità diverse equivalente odierno caratteri collegati famoso per apprendimento distinzione database formato originale wiki caratteri scelti movimenti artistici sistema di mappe e filtri meta tag contesto di utilizzo reale specimen

preferiti categoria timeline illustrata storia evoluzione f lussi contemporaneità coordinate polari inf luenze affiliazione cronologicamente geograficamente numeri span di tempo spazio semplificazione matrice pietre miliari dimensione colore racconto icona posizione dimensione colore grandezza magnetismo

•

ricerca

3 a typefaces atlas

• alla ricerca sono stati ricavati elementi utilissimi per la definizione del concept: una necessità di chiarezza nelle classificazioni, il bisogno di avere una visione completa del panorama storico, la volontà di creare una rete di relazioni tra caratteri, personaggi e protagonisti. Per rispondere a queste esigenze si è pensato di progettare un atlante non convenzionale. In questo modo è possibile restituire con un unico artefatto un insieme di punti di vista e chiavi di lettura, rappresentati da mappe che permettano di cogliere le diverse sfaccettature di un argomento tanto complesso come il mondo dei caratteri tipografici. Lo obiettivo che si vuole raggiungere è il progetto di un artefatto di supporto alla didattica; in particolar modo si è pensato agli studenti di discipline strettamente legate alla comunicazione visiva, così come ai professionisti che sentono di avere carenze sullo specifico campo della tipografia. Il lavoro è incentrato sui caratteri tipografici, la loro evoluzione, i loro autori e le loro caratteristiche; sebbene sia altrettanto importante, viene lasciato poco spazio all’altra principale area della tipografia, ossia la messa in pagina. Alla base dell’applicazione si troverà un database con i caratteri tipografici ritenuti, da fonti autorevoli ed opportunamente selezionate e confrontate, i più importanti nella storia, schedati e visualizzati. Proprio la presenza di questa banca dati, pensata per essere poi espansa con l’ausilio degli utenti stessi, rende l’atlante anche un utile strumento di reference per i professionisti già esperti di tipografia.

3.1

esigenze

L’idea del progetto nasce dal bisogno di avere uno strumento per navigare i caratteri tipografici in modo non convenzionale e più significativo. Gran parte degli archivi, infatti, si rifanno a classificazioni spesso confusionarie e non comprensive dei nuovi stili. I sistemi attualmente in uso sono poco mirati alla scelta di un carattere da usare, in quanto attingono ad un database troppo grande o si limitano ai soliti 100 caratteri principali. Manca quindi uno strumento che permetta di inserire i caratteri fondamentali in un contesto che sia storico, geografico o stilistico e di collegare caratteri di importanza secondaria ai capostipiti. Queste necessità sono state confermate da numerosi confronti con studenti o neolaureati nel campo della comunicazione visiva; in particolare è emersa la difficoltà nella scelta di un carattere adatto per il progetto che si andrà ad affrontare. Gli studenti interpellati hanno confessato di non essere generalmente in grado di collegare un carattere al periodo storico in cui è stato progettato o a cui fa riferimento; pochissimi fanno riferimento alla nazione d’origine di un carattere quando decidono di usarlo. Questi due elementi da soli sarebbero invece di grande aiuto per una scelta coerente della famiglia da usare, poiché un carattere, come qualsiasi altro artefatto è figlio della propria epoca e del tessuto sociale in cui è nato. L’Italia del xvi secolo genera necessariamente prodotti diversi dalla Francia del Settecento e dalla Svizzera degli anni Cinquanta. Prescindere da queste motivazioni ed invece concentrarsi solo sul lato estetico rischia di comportare scelte poco felici. Altro problema riscontrato è la scarsa attitudine a considerare i font come strumento della comunicazione; in quanto strumenti infatti devono essere conosciuti e saputi utilizzare. Conoscere interlinea ideale, peso, proporzioni e destinazione d’uso di un carattere è fondamentale per una sua applicazione efficace, così come poter scegliere tra caratteri simili dal punto di vista dell’apparenza generale ma dalle diverse caratteristiche tecniche e anatomiche; basti pensare alle diverse versioni disponibili del Garamond o del Bodoni, ciascuna con le proprie particolarità, vantaggi e svantaggi.

3.2 risposte Per cercare di risolvere i problemi appena elencati si è pensato un sistema di mappe interattive raccolte in un atlante. Non si vuole proporre un vademecum o un breviario per la scelta del carattere, in quanto pensiamo stia alla sensibilità del progettista valutare il carattere più opportuno in ogni occasione; l’intenzione è invece quella di fornire delle competenze e conoscenze che supportino e nutrano la suddetta capacità del professionista o dello studente. Le mappe permettono di navigare, in modo più o meno mirato, tra i caratteri tipografici e non semplicemente effettuare delle ricerche. Esplorando si può raggiungere una visione più generica del panorama, rispetto ad una ricerca che invece deve essere indirizzata verso un obiettivo definito. Ogni mappa permette la navigazione assumendo come chiave di lettura uno degli attributi principali della carta d’identità di un carattere: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

anno di progettazione; nazione; classificazione; autore; fonderia/publisher; metodo di produzione originario; destinazione d’uso.

Ogni carattere, specialmente quelli considerati più importanti, avrà diverse pagine di approfondimento, in modo da permettere una conoscenza dettagliata dello stesso, anche attraverso il confronto con caratteri simili o in qualche modo ad esso collegati: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

carta d’identità del carattere; specimen dei pesi; tavola anatomica comparativa; glifi chiave per riconoscere il carattere; galleria fotografica del carattere nel contesto d’utilizzo; ԀԀ consigli per l’utilizzo; ԀԀ altre versioni derivanti dal medesimo originale. Si è pensato di suddividere i caratteri secondo un indice di rilevanza, prendendo quelli considerati i principali nel corso della storia ed usandoli

a typefaces atlas

come termine di paragone per gli altri. In questo modo si vuole superare il problema di navigabilità derivante dall’eccessivo materiale e l’inconveniente opposto, ossia il ripetersi dei soliti caratteri. In questo modo invece anche caratteri di solito meno citati vengono messi in relazione con i genitori più famosi ed illustri. 3.3

target

Come anticipato l’obiettivo del progetto è la realizzazione di uno strumento didattico. Gli utenti principali saranno quindi studenti e neofiti del campo della comunicazione visiva. Di rimando saranno da prendere in considerazione i docenti che potranno servirsene come supporto alla didattica. Un terzo target è rappresentato dai professionisti, meno attratti dall’aspetto didattico e più dalla possibilità di esplorare il database alla ricerca del carattere idoneo alle proprie esigenze. Oltre alle esperienze personali, per la definizione del target ci si è avvalsi di un questionario diffuso tra studenti e professionisti. I risultati per esteso sono disponibili nell’Appendice A – Target, a pagina 151. ґґ studenti e neofiti Gli studenti che si approcciano alla comunicazione visiva raramente possiedono un bagaglio di competenze legato alla tipografia. È ben più frequente che siano ferrati circa la storia dell’arte, la percezione ed il colore. La tipografia infatti non è mai oggetto di studio nel corso della formazione pre-universitaria. Ci si ritrova quindi catapultati in un mondo nuovo, ignorando tutte le relazioni che legano questo mondo al resto delle discipline che compongono la borsa di competenze di un comunicatore. Senza un adeguato riferimento storico e progettuale la scelta di un carattere si basa sulla curiosità personale che alimenta la ricerca ed il puro gusto estetico dello studente, che si vede costretto ad abbinare un carattere ad un progetto senza strumenti utili alla decisione come la conoscenza del periodo storico di riferimento, dell’ambiente sociale e culturale derivante dalla geografia, dell’uso per cui il carattere è stato progettato e delle ripercussioni che esso avrà sul progetto.

Gli studenti dei primi anni di formazione universitaria difficilmente avrebbero le disponibilità economiche per acquistare un iPad o un tablet. Gli studenti universitari sono generalmente familiari con i device tecnologici e i nuovi metodi d’interazione, dispongono tutti di un computer con accesso a Internet. Sono generalmente interessati alla tipografia, ma la loro curiosità è più indirizzata a conoscere caratteri nuovi e diversi. Di solito cerco un carattere adatto al contesto, stilisticamente e se possibile storicamente, privilegiando la leggibilità in casi di testi medio-lunghi, e che sia il più completo possibile (dopo l’esperienza di font istituzionali senza i glifi basilari per i numerosi autori russi citati in continuazione, la mia ossessione per i glifi e le scritture non latine si è acutizzata). Laura Sans

»» Selezione di risposte alla domanda: In base a che cosa scegli i caratteri da usare?

In base a come secondo il mio giudizio il carattere rispecchia il contenuto di ciò che andrà a comunicare. In alternativa in base a come, sempre secondo il mio giudizio, il carattere si presta al tipo di impaginazione che gli sto dando. Roberto Penso che sia fondamentale in quanto alcuni caratteri sono stati disegnati per specifici scopi (vedi il Microgramma, per esempio) e alcuni caratteri portano con sè anche una forte connotazione storica e culturale: basti pensare a come il Futura segnò indelebilmente il periodo e la cultura del tempo e quanto sia ancora attuale. Marina Mangiat

»» Selezione di risposte alla domanda: In che modo conoscere l’evoluzione dei caratteri può incidere nella scelta di un font?

Può incidere perché fa capire i filoni estetici della tipografia e quindi l’evoluzione della comunicazione grafica. Francesco F. Ad esempio nel non scegliere un carattere pensato per la stampa nel web.

ґґ insegnanti Gli insegnanti di tipografia necessitano di strumenti che supportino le lezioni tenute in classe. Tali strumenti devono permettere di mostrare agli alunni le diversità ed affinità tra caratteri, la

a typefaces atlas

collocazione storica e cronologica, quali sono stati i caratteri più importanti e in che modo hanno influenzato l’evoluzione della tipografia. Altro argomento che è difficile spiegare senza un adeguato numero di esempi è la classificazione degli stili, e in che modo caratteri di epoche diverse rientrino nello stesso gruppo. Avere uno strumento che abbia già catalogati e ordinati questi dati e queste informazioni significherebbe un risparmio di tempo per ricercare e ricreare degli esempi esplicativi. Sarebbero utili alcune funzionalità interattive che permettano il confronto tra diversi caratteri. I docenti universitari di riferimento sono dotati di computer, che usano quotidianamente, dispongono di accesso a Internet in aula; poiché generalmente gli insegnati di tipografia sono principalmente professionisti, hanno risorse di tempo limitate che sarebbe più utile indirizzare verso conoscenze approfondite piuttosto che nella raccolta di caratteri e materiale informativi. Dal punto di vista professionale, i docenti potrebbero utilizzare l’applicazione anche al di fuori del contesto didattico. ґґ professionisti Per i professionisti uno strumento del genere risulterebbe un utile mezzo di ricerca, se ai caratteri principali venissero accomunati altri caratteri di secondaria o limitata importanza, magari di recente creazione. In questo modo sarebbe per loro possibile sfruttare le proprie competenze per effettuare ricerche veloci e mirate all’interno di uno stile che è già stato inquadrato. Oltre agli esperti della comunicazione visiva A Typefaces Atlas un atlante del genere potrebbe essere utilizzato da chi si trova a dover utilizzare la tipografia o effettuare ricerche a partire da essa, senza avere delle basi in materia, come per esempio giovani scenografi, bibliofili, progettisti industriali, architetti, illustratori. Questo gruppo di utenti avrebbe necessità di appigli storici che possano connettere la tipografia al proprio campo professionale, così come percepire immediatamente quali sono i caratteri e gli autori di riferimento per ogni periodo o contesto.

Mi baso sulla relazione carattere tipografico<>contenuto da rappresentare<->supporto su cui lavorare. Luigi Bevilacqua

»» Selezione di risposte alla domanda: In base a che cosa scegli i caratteri da usare?

considerazioni estetiche (se le forme esprimono un certo mood: compressione, densità, rotondità, ritmo, aspetto geometrico, script, gotico, etc etc); considerazioni tecniche (il font è ben disegnato, coerente, set di glifi vasto, varianti opentype, famiglia con pesi e varianti più o meno estesa); considerazioni economiche (costo delle licenze desktop/ webfont/app, scalabilità e evoluzione del font); considerazioni di coerenza (abbinamento con con identità preesistente); considerazioni di comunicazione(relazione di contrasto o assimilazione con stili dei competitors). Jan In base allo “stile” che voglio dare all’artefatto finale, alle necessità di leggibilità, al tipo di supporto (web, espositivo, cartaceo...). Naturalmente poi seguo anche il mio gusto personale e mi aggiorno sui nuovi caratteri e su quelli più in voga. Cristina Foundry (this is something ultra-Swiss – everyone tends to support Swiss type designers); the shape how it meets with the general concept of my work Safak Credo incida in modo radicale. È ciò che permette di fare scelte consapevoli e non solo dettate da trend o luoghi comuni. Vittoria Fontana

»» Selezione di risposte alla domanda: In che modo conoscere l’evoluzione dei caratteri può incidere nella scelta di un font?

Cultura generale: sapere che un carattere origina in un contesto ed un’epoca lo associa in modo più o meno conscia a certi temi. Si può quindi creare un’associazione cognitiva/storica tra elementi. Può anche essere utile per fare del blabla dotto col cliente e argomentare con successo che il font scelto per lui è il migliore. Jan

a typefaces atlas

3.4 supporti Allo scopo di rendere accessibile l’atlante al maggior numero possibile di utenti si è scelto di svilupparlo su una piattaforma web, sfruttando le nuove potenzialità di html5, dei css3 e di JavaScript. Ovviamente sarà necessario l’utilizzo di un database e di un sistema di gestione che permetta la generazione di contenuti da parte degli utenti. La maggior parte degli utenti infatti ha facilmente accesso a questo tipo di sistemi, che necessitano di un semplice computer connesso a Internet. Si è scelta una piattaforma di ampio accesso a scapito delle nuove funzionalità interattive di device avanzati, come l’iPad o i nuovi tablet, che comunque possono sfruttare l’applicazione come farebbe un normale computer. Per questo motivo si è voluto evitare l’utilizzo di Flash e di altre tecnologie per l’interattività che non siano altamente compatibili con i sistemi attualmente in uso. Oltre all’accessibilità a basso costo, sviluppare un atlante sotto forma di sito web permette la visualizzazione su monitor anche di grandi dimensioni, che possono rendere più agevole la lettura di alcuni dati e specialmente delle mappe complesse; gli ultimi prodotti tecnologici però stanno puntando ad un incremento della risoluzione a monitor – come i recenti display Retina di Apple – rendendo una riproduzione sempre più fedele dei caratteri, sebbene ancora di livello inferiore rispetto alla stampa. ґґ html 5

»» Il World Wide Web Consortium (W3C)è una community internazionale in cui le organizzazioni membro, uno staff a tempo pieno ed il pubblico lavorano assieme per sviluppare gli standard del Web. www.w3c.org

L’html5 è un linguaggio di markup per la strutturazione delle pagine web. Proposto dal gruppo di lavoro whatwg inizialmente in contrasto con il World Wide Web Consortium per le lungaggini nel processo di evoluzione dello standard html e per la decisione del w3c di orientare la standardizzazione verso l’xhtml 2 che non garantiva retro compatibilità. Il w3c ha poi riconosciuto valide tali motivazioni, annunciando di creare un apposito gruppo per la standardizzazione dell’html 5 e abbandonare l’xhtml 2.0. Il World Wide Web Consortium ha annunciato che la prima versione dello standard sarà pronta per fine 2014 e l’html 5.1 per

il 2016. Dal 2007 il whatwg ha collaborato con il w3c in tale processo di standardizzazione, per poi decidere nel 2012 di separarsi dal processo di standardizzazione del w3c, creando di fatto due versioni dell’xhtml 2: la versione del whatwg viene definita come “html Living Standard” e quindi in continua evoluzione, mentre quella del w3c sarà una unica versione corrispondente ad uno snapshot del Living Standard. Le novità introdotte dall’html 5 rispetto all’html 4 sono finalizzate soprattutto a migliorare il disaccoppiamento tra struttura, definita dal markup, caratteristiche di resa (tipo di carattere, colori, eccetera), definite dalle direttive di stile, e contenuti di una pagina web, definiti dal testo vero e proprio. Inoltre l’html 5 prevede il supporto per la memorizzazione locale di grosse quantità di dati scaricati dal browser, per consentire l’utilizzo di applicazioni basate su web, come le caselle di posta di Google, anche in assenza di connessione. In particolare: ԀԀ vengono migliorati ed estesi gli elementi di controllo per i moduli elettronici; ԀԀ vengono introdotti elementi specifici per il controllo di contenuti multimediali; ԀԀ vengono estesi a tutti i tag una serie di attributi, specialmente quelli finalizzati all’accessibilità, finora previsti solo per alcuni tag; ԀԀ viene supportato Canvas che permette di utilizzare JavaScript per creare animazioni e grafica bitmap; ԀԀ introduzione della geolocalizzazione, dovuta ad una forte espansione di sistemi operativi mobili (quali Android e iOS, tra i più diffusi); ԀԀ sistema alternativo ai normali cookie, chiamato Web Storage, più efficiente, il quale consente un notevole risparmio di banda; ԀԀ standardizzazione di programmi JavaScript, chiamati Web Workers e possibilità di utilizzare alcuni siti off line. Con questi aggiornamenti si sta già assistendo ad un rinnovamento dei siti web, che hanno mantenuto l’alto livello di interattività nonostante la decadenza di Flash.

a typefaces atlas

Inoltre la separazione tra contenuti e mark-up e un uso più semantico delle tag rendono più semplice la visualizzazione di database in maniera dinamica. ґґ css 3 Sebbene siano lontani da diventare uno standard accettato dal w3c, i css3 sono già supportati parzialmente dalla maggior parte dei browser comunemente usati. Rispetto alle precedenti versioni permettono di alleggerire il traffico dati, svolgendo alcuni compiti in precedenza affidati alle immagini. Inoltre tra le grandi novità dei css3 c’è la possibilità di effettuare animazioni e trasformazioni, come per esempio ruotare e traslare un blocco di testo. Altro campo in cui si sta ricercando a livello mondiale è la responsività dei siti, per far sì che a diverse risoluzioni il contenuto risponda adattandosi, al fine di ottimizzare il traffico dei dati e le dimensioni degli oggetti visualizzati. ґґ javascript & jquery

»» AJAX, acronimo di Asynchronous JavaScript and XML, è una tecnica di sviluppo per la realizzazione di applicazioni web interattive (Rich Internet Application).

La crisi di Flash ha lasciato via libera a JavaScript, che ormai è diventato lo standard per l’interattività sui siti web, grazie ad ajax. In JavaScript lato client, il codice viene eseguito direttamente sul client e non sul server. Il vantaggio di questo approccio è che, anche con la presenza di script particolarmente complessi, il server non viene sovraccaricato a causa delle richieste dei clients. Di contro, nel caso di script che presentino un sorgente particolarmente grande, il tempo per lo scaricamento può diventare abbastanza lungo. Un altro svantaggio è il seguente: ogni informazione che presuppone un accesso a dati memorizzati in un database remoto, come nel caso di interesse, deve essere rimandata ad un linguaggio che effettui la transazione, per poi restituire i risultati ad una o più variabili JavaScript; operazioni del genere richiederebbero il caricamento della pagina, ma con l’avvento di ajax tutti questi limiti sono stati superati. JQuery è una libreria di funzionalità JavaScript, facilmente utilizzabile per lo sviluppo anche da personale non specializzato, ma con una buona competenza nel campo della progettazione web.

ґґ display ad alta risoluzione Un altro elemento critico è la risoluzione dei monitor, da sempre inferiore rispetto alla carta. Se infatti la stampa offset prevede una risoluzione generalmente di 300 dpi, i monitor si attestano intorno ai 100 dpi. Il boom di smartphone e tablet ha però dato una spinta al progresso in questo campo. Gli iPhone di ultima generazione, quelli dotati di Display Retina, infatti, forniscono una risoluzione di 326 dpi. La stessa tecnologia applicata ad iPad e MacBook permette di avere risoluzioni rispettivamente di 264 e 220 dpi. Auspicabilmente anche altri concorrenti tenderanno ad allinearsi a questa offerta. Già al giorno d’oggi i display forniscono risoluzioni maggiori dei canonici 72 dpi. 3.5

concept

Da queste informazioni è possibile trarre una definizione di quello che sarà il progetto, di cui parleremo in dettaglio nei capitoli seguenti. L’Atlante sarà uno strumento didattico interattivo, fruibile liberamente sul web. Avrà un indirizzo didattico, sia nella visualizzazione delle mappe, che non dovranno essere delle semplici rappresentazioni di un database, sia nel mostrare i dettagli di ciascun carattere e i parenti a lui prossimi. Il corpo principale dei contenuti saranno i 100 caratteri più importanti nella storia della tipografia occidentale; alcuni di questi sono considerati pietre miliari nelle timeline. Ad essi sarà attribuito il grado più elevato di importanza, ai restanti il secondo grado. Dei caratteri principali saranno da subito disponibili le pagine che descrivono in modo dettagliato l’anatomia e gli elementi che caratterizzano il carattere e quelli appartenenti al medesimo stile. A questo insieme di contenuti, gestito in modo redazionale, si aggiungeranno i caratteri di importanza inferiore, caricati dagli utenti tramite un sistema Wiki e sempre controllato dal corpo redazionale per l’approvazione. I caratteri di importanza 2 e 3 saranno riconducibili ai relativi capostipiti. Così facendo sarà più semplice per gli utenti capire le affinità secondo cui i caratteri sono classificati, di quali sono gli stili principali al di là delle etichette, quali alterna-

a typefaces atlas

tive possono esistere per un determinato carattere. Gli utenti registrati potranno, oltre che aggiungere voci all’Atlante, creare le proprie liste di caratteri preferiti. Le mappe che comporranno l’Atlante saranno: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

timeline; geografia; autore; publisher; classificazioni; metodi di produzione; destinazione d’uso.

Queste mappe, oltre a visualizzare le famiglie di caratteri secondo criteri che restituiscano al meglio il punto di vista ad esse relativo, forniranno anche spunti per l’approfondimento della materia. Di ogni carattere saranno poi sviluppate le seguenti schede che ne permetteranno una conoscenza approfondita: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

carta d’identità; specimen dei diversi stili; scheda anatomica comparativa; il carattere in uso; versioni e alternative.

Per i caratteri di primaria importanza saranno poi disponibili anche le seguenti schede: ԀԀ glifi chiave; ԀԀ consigli per l’utilizzo. Oltre a questa modalità principale, di natura esplorativa, è stata pensata una funzione di ricerca, con un sistema di filtri che prende spunto dal progetto di Nick Sherman[pg.38] unito alla precisione della classificazione Dixon; in questo modo sarebbe possibile ricercare un carattere in base alle sue proprietà anatomiche, oltre che per lo stile, il periodo storico, i metodi di produzione, la destinazione d’uso ed ovviamente nome, autore, fonderia, nazione. Il progetto, si vuole ribadire, non sarà un manuale di tipografia, bensì un atlante dei caratteri tipografici occidentali dall’invenzione della stampa a caratteri mobili fino ai giorni nostri.

3.6 lingua di fruizione La lingua scelta per lo sviluppo dell’Atlante è stata l’inglese; questo nella speranza di raggiungere un maggior numero di utenti e di collaboratori. Inoltre la gran parte della bibliografia di settore è reperibile esclusivamente in lingua inglese. Non è secondaria la volontà di inserirsi in un contesto accademico e di studio internazionale, motivo per cui la scelta dell’italiano sarebbe, purtroppo, risultata limitante. In un secondo momento, tuttavia, si potrebbe valutare l’ipotesi di una traduzione dell’applicazione in italiano, così come in altre lingue. 3.7 attori ruoli relazioni strumenti Si è quindi proceduto a pensare il sistema generale di funzionamento del sito. Come viene spiegato nel grafico seguente vengono identificati gli attori principali che prenderanno parte al progetto: ԀԀ studenti, docenti, professionisti, nel ruolo di utenti; ԀԀ esperti di tipografia, nel ruolo di creatori e ricercatori e validatori di contenuti da pubblicare nel portale – fanno parte della redazione; ԀԀ webmasters, che si occuperanno di pubblicare sul sito i contenuti creati e validati dagli esperti – fanno parte della redazione; ԀԀ le fonderie e i distributori di caratteri, forniranno alla redazione il materiale da visualizzare. La principale modalità d’interazione con il sito per gli utenti è la navigazione delle mappe. Un’altra modalità d’uso si baserà su ricerche mirate. In ciascuno di questi casi vengono presentate le famiglie di caratteri corrispondenti ai criteri. Relativamente ai caratteri, questi sono divisi in tre classi di importanza; le prime due classi vengono gestite dalla redazione e devono costituire il cuore del progetto già dalla sua nascita. La terza classe di importanza è composta dal materiale proposto dagli utenti e validato dalla redazione. Gli utenti possono anche creare la propria libreria di caratteri preferiti. •

a typefaces atlas

fornitori Disegnatori

Fonderie

Forniscono materiale dimostrativo

redazione Esperti di type

Webmasters

Produce e cura

Inserisce e gestisce

Caratteri Caratteri di classe A di classe B

Controlla e verifica

utenti Studenti

Docenti

Professionisti

Computer Si connettono

tramite

Tablet

a Typefaces atlas

mappe

ricerca

visualizzazioni interattive delle famiglie di caratteri

database di caratteri

area utente

Aggiunge e integra voci

area upload

Caratteri di classe C

fig. 54â&#x20AC;&#x201A; Tavola Attori ruoli relazioni strumenti.

a typefaces atlas

4 contenuti

3 er quanto riguarda i contenuti si è ritenuto necessario fare riferimento a fonti autorevoli, che indicassero quali famiglie di caratteri fosse necessario inserire perché l’Atlante avesse un’utilità effettiva. Incrociando poi i risultati di questi testi e calcolando quanto fossero ricorrenti i riferimenti ai caratteri si è riusciti a definire un gruppo di pietre miliari o capostipiti, che nel corso della storia hanno segnato dei punti di svolta per la progettazione tipografica. Oltre ai caratteri è stato necessario reperire contenuti anche per la parte più enciclopedica dell’Atlante, come per esempio l’evoluzione dei metodi di produzione dei caratteri o le informazioni sugli autori. In questi casi, le informazioni sono state reperite, oltre che dai manuali già consultati per i contenuti principali, anche su altri testi relativi all’argomento, così come da articoli pubblicati on-line da fonti considerate attendibili e autorevoli dalla comunità dei tipografi. Come definito dal concept i contenuti saranno relativi ai caratteri tipografici occidentali progettati dall’invenzione della stampa fino ad oggi. Si è pensato che prendere in considerazione la tipografia di altri ceppi linguistici sarebbe stato ben oltre le possibilità. Ciò non toglie che il progetto sia declinabile anche per adattarsi a queste realtà.

4.1

»» Il Type Directors Club (TDC) è un’organizzazione internazionale per il supporto dell’eccellenza tipografica.

criteri per la scelta dei caratteri

Per scegliere quali caratteri dovessero rientrare nelle prime due classi si è fatto riferimento ad alcuni libri, principalmente Letter Fountain [pg.23], sfruttando sia la timeline iniziale che la selezione di famiglie scelte a rappresentare le famiglie di serif e sans. Si è fatto anche riferimento ai caratteri citati nel libro Type & Typography [pg.24] e nello specimen posto a conclusione di Gli elementi dello stile tipografico [pg.21]. Sebbene questi sopra elencati siano le fonti principali si è anche preso in considerazione l’elenco dei 100 caratteri più importanti secondo i membri del Type Directors Club, compilata da Paul Shaw ed in seguito utilizzata da Ben Archer per il suo progetto.[pg.29] Altra classifica utilizzata come riferimento è The 100 best typefaces of all time [pg.36] stilata da FontShop interpellando una giuria di esperti e intersecando le loro opinioni con i dati di vendita. In questa classifica però non sono presenti caratteri gratuiti o disponibili di default sui sistemi operativi – per esempio l’Arial o il Verdana. Nel caso, piuttosto frequente, di diversi caratteri derivati dallo stesso progetto originale – come, per esempio, il Garamond o il Bodoni – viene visualizzata una versione scelta basandosi sulle indicazioni e motivazioni date da Robert Bringhurst e in secondo luogo dal libro Letter Fountain. Le altre versioni ritenute valide sono inserite nella scheda Versioni e Alternative riguardante il carattere. ґґ caratteri di importanza primaria Per definire quali di questi caratteri fossero imprescindibili dal punto di vista storico, o che potessero essere definiti dei capostipiti di un determinato stile, a cui fare riferimento per classificare e contestualizzare gli altri ci si è rifatti alla timeline presente nelle pagine iniziali di Letter Fountain e dal settimo capitolo de Gli elementi dello stile tipografico: Intermezzo storico. ґґ caratteri di importanza secondaria Questo gruppo raccoglie le altre famiglie citate nelle fonti considerate, ma che non si è ritenuto dover includere nella ristretta selezione dei caratteri di importanza primaria. Questo non vuole

sminuirne la qualità di fattura o la diffusione, talvolta maggiori rispetto ai primi. Questi caratteri sono stati tratti dai suggerimenti delle seguenti fonti: ԀԀ Gli elementi dello stile tipografico, Robert Bringhurst; ԀԀ Type & typography, Phil Baines e Andrew Haslam; ԀԀ Thinking with type, Ellen Lupton. ґґ caratteri di terza classe di importanza A questa classe appartengono i caratteri che verranno proposti dagli utenti. Le candidature vengono prese in esame dalla redazione che ne verifica la qualità e la non conflittualità nel caso di voci già presenti nel database. Alcune di queste proposte potrebbero, a discrezione della redazione, venire spostate in una delle classi superiori. In questo modo viene mantenuto aggiornato il cuore dell’Atlante. 4.2 indice di rilevanza Classificare in questo modo le famiglie di caratteri è stato ritenuto opportuno al fine di fornire a ciascuno stile o periodo storico una faccia rappresentativa. In questo modo sarebbe stato più facile per gli utenti capire, tramite il confronto, a quale stile o epoca corrisponde un dato carattere. Analogamente alle comuni mappe geografiche interattive, quando si osserva un panorama in piccola scala i dettagli meno importanti vengono nascosti o assimilati dalle voci ritenute più importanti. In questo modo è sufficiente ingrandire la vista e passare ad una grande scala per vedere comparire voci meno importanti, ma comunque rilevanti. La vicinanza tra diversi caratteri considerati più e meno importanti favorirà la conoscenza di questi ultimi. In questo consiste uno dei pilastri principali dell’Atlante: utilizzare i caratteri ritenuti storicamente fondamentali come guida e rappresentanti per arrivare a conoscere altre espressioni a loro vicine per contesto o per stile, ma diverse nei dettagli. Dal punto di vista dell’utente ciò si tradurrebbe in un ampliamento del bagaglio conoscitivo, rendendolo però strutturato e non casuale, grazie ai continui riferimenti al contesto e agli autori.

contenuti

4.3

»» Giò Fuga: Tipometria e composizione tipografica, 2009. »» Robin Kinross: Tipografia moderna, Stampa alternativa & Graffiti, 2005. »» Simon Garfield: Sei proprio il mio typo, Ponte alle Grazie, 2012.

scelta dei contenuti d’approfondimento

Anche in questo caso la maggior parte dei contenuti è stato tratto dai testi indicati precedentemente. A questi si aggiungono: la pubblicazione di Giò Fuga riguardo la classificazione Novarese, specialmente per la rivisitazione e l’ampliamento ad opera dello stesso Fuga; il libro Tipografia Moderna di Kinross riguardo l’evoluzione legata alla geografia; Sei proprio il mio typo di Simon Garfield per quello che riguarda aneddoti e storie legate ad alcuni dei caratteri più importanti. Per i contenuti che non è stato possibile reperire in questi volumi si sono svolte delle ricerche su Wikipedia cercando tra le fonti quelle più autorevoli, prediligendo libri o autori presenti nelle bibliografie consigliate dagli esperti o nei volumi già presi in considerazione. Gli Elementi dello Stile Tipografico presenta delle sintetiche ma esaustive biografie degli autori e delle fonderie. Su queste, specialmente le principali, è molto approfondita l’appendice di Letter Fountain, completa di una utilissima timeline. 4.4 conflitti e casi particolari Nei numerosi casi di rivisitazioni, in cui da un disegno originale – generalmente precedente la composizione a caldo – siano poi stati ricavati diverse versioni, tutte considerate figlie dirette e riproduzioni del medesimo disegno, verrà utilizzata la versione che le fonti prese in considerazione, hanno valutato essere la più fedele all’originale. Le altre versioni saranno raggiungibili dalle schede di approfondimento del carattere o tramite le funzioni di ricerca. Visto il carattere didattico dell’opera si è scelto di prediligere infatti un approccio più storico che non di compilazione, che avrebbe comportato un proliferare di cloni derivante più dalla necessità di aggiornamento alle nuove tecnologie che non da evoluzioni storiche e progettuali. •

contenuti

5 struttura

• efinita la natura del progetto e i contenuti che avrebbe ospitato si è pensato a come strutturarlo. Si è ritenuto opportuno dedicare parecchio peso a questa fase, in quanto era prioritario avere un sistema che potesse sopportare eventuali lacune e mancanze di alcune sue parti, così come favorire un’espansione modulare. Il sistema viene strutturato secondo un’architettura che permette di navigare un database composto da numerose famiglie di caratteri, scegliendo di volta in volta diverse chiavi di lettura. In questa fase si è quindi lavorato in tre direzioni: quali contenuti trattare, come navigare tra di essi in modo istruttivo, cosa mostrare dei caratteri e come farlo. Si è scelta la strada della modularità, prendendo spunto dai tradizionali atlanti geografici, in cui le diverse mappe sono autonome tra loro. Le mappe degli atlanti sono modalità per conoscere di volta in volta aspetti diversi di ogni Stato. Di questi si ritrovano poi le schede che sinteticamente ribadiscono le informazioni visualizzate nelle mappe. Per l’Atlante si è scelto di utilizzare un sistema simile: una volta raccolto il corpo dei contenuti, ossia le diverse famiglie di caratteri si è pensato, basandosi sulla ricerca e sulle esigenze del target, a quali proprietà fosse necessario comunicare. Le mappe sono state progettate pensando a come visualizzare queste proprietà, valorizzando ognuna di esse piuttosto che cercando un’uniformità espressiva. Ogni carattere avrà poi una scheda in cui le sue proprietà saranno analizzate e spiegate in profondità.

5.1

architettura dell’applicazione

Come anticipato nei paragrafi precedenti e sintetizzato in fig. 55 Scheda di sintesi dell’architettura dell’Atlante a pagina 95, l’Atlante sarà composto di tre parti principali: ԀԀ i caratteri tipografici; ԀԀ le schede dettagliate delle loro proprietà; ԀԀ le mappe per navigarli. Inoltre saranno talvolta presenti delle altre pagine di approfondimento generale, non strettamente legate ad un carattere o ad una delle loro proprietà; per esempio pagine di approfondimento che spiegano i perché di una determinata classificazione. 5.2 i caratteri tipografici I caratteri sono la materia prima dell’Atlante. Una volta selezionati, sono stati catalogati e taggati in base alle loro proprietà e caratteristiche. Poiché il conoscere un buon numero di caratteri è considerato importante tanto quanto lo studio approfondito di un singolo carattere, si è deciso di dividere l’insieme dei caratteri in 3 classi di importanza. La prima classe è destinata ai caratteri che hanno segnato un punto topico nella storia della tipografia. Sono poche decine e la loro scelta è basata sul numero di riscontri nei testi presi in esame e dalla lista dei 100 migliori caratteri proposta dal Type Directors Club e già sfruttata da Ben Archer. Le seconda classe è composta da quei caratteri che sono citati abitualmente nei testi di riferimento, ma non hanno assunto lo status di pietre miliari, in quanto si inserivano in un filone già precedentemente inaugurato. Sono caratteri validissimi e spesso storici, che talvolta non sono conosciuti perché è troppo forte l’egemonia di quelli più famosi. La terza classe raccoglie i caratteri proposti dagli utenti; spesso ottime famiglie di caratteri vivono nell’ombra, presenti quasi esclusivamente nei cataloghi della fonderia o nel portfolio di chi li ha progettati. La loro ammissione all’Atlante avviene secondo il giudizio della redazione, che si dovrà occupare di vagliare le proposte avanzate dagli utenti registrati. La loro presenza ha lo scopo di in-

coraggiarne e aiutarne la diffusione, tramite una conoscenza strutturata. L’idea alla base di questo sistema tripartito è semplice: una volta conosciuto un carattere chiave, come per esempio il Bodoni e dopo averne studiato caratteristiche e peculiarità, sarà possibile esplorare i caratteri che appartengono alla sua stessa epoca, come per esempio il Walbaum, arrivando così ad ampliare la propria visione panoramica sul mondo dei caratteri tipografici. Avere a disposizione un gran numero di progetti diversi, ma legati di volta in volta da un contesto storico, geografico, stilistico, autoriale, permetterà a sua volta di inquadrare meglio quel determinato contesto, anziché lasciare che i caratteri, anche quelli più noti, galleggino in un aura di avulsione rispetto al contesto in cui sono nati. 5.3

le schede dei caratteri

Le schede presenteranno le proprietà di ogni carattere, cercando di sfruttare le opportunità tecnologiche per favorire confronti e analisi approfondite. In particolare le schede tratteranno i seguenti argomenti: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

carta d’identità del carattere; storia del carattere; specimen interattivo; anatomia; galleria fotografica del carattere in uso; alternative e altre versioni.

Per i caratteri più importanti, ossia quelli appartenenti alla classe A, saranno disponibili due schede aggiuntive: ԀԀ glifi chiave; ԀԀ consigli per l’uso. Ogni scheda verrà spiegata in modo dettagliato in seguito, ma la linea guida alla base della loro progettazione è l’intento di raccontare quanto più possibile del carattere sotto i tre aspetti risultati essenziali: contesto storico, anatomia e caratteristiche tecniche, teorie e metodologie progettuali. In alcune schede, in particolar modo quelle più relative all’anatomia, sarà ampiamente sfruttata l’interattività, per permettere una visione personalizzata dei glifi, come nei siti delle fonderie.

struttura

Timeline

mappe

Geografia

Classificazione Autore

Le mappe raccolgono i caratteri inclusi nellâ&#x20AC;&#x2122;atlante secondo diverse gerarchie, e permettono di mettere in relazione i caratteri tra di loro attraverso diverse chiavi di lettura.

Produzione

Destinazione dâ&#x20AC;&#x2122;uso

Pagine di filtro con contenuti di approfondimento

Pagine con contenuti di approfondimento

Pagine con la funzione di filtro

Publisher

Ognuna, organizzando i contenuti secondo la propria logica, restituirĂ una visione aumentata del panorama, aggiungendo valore didattico ad una semplice collezione di caratteri.

struttura

In uso

Mostrano i dettagli di ogni carattere. Come per le mappe verranno studiati i metodi per amplificare la portata didattica derivata

fig. 55 Scheda di sintesi dell’architettura dell’Atlante

schede

(solo rilevanza 1)

Glifi chiave

(solo rilevanza 1)

Consigli per l’uso

dalla fruizione di quelle che altrimenti sarebbero semplici informazioni.

Alternative e versioni

Classe 3

Anatomia

Sezione wiki con caricamento da parte dell’utente, controllato dalla redazione.

Classe 2

Specimen

Aggiunta di caratteri di secondaria importanza, secondo le stesse fonti.

Classe 1

Carta d’identità

Selezione di caratteri principali in base ad alcuni testi fondamentali ed autorevoli.

caratteri

5.4 le mappe Le mappe sono il vero cuore dell’Atlante Saranno gli strumenti per navigare il database di caratteri. Ciascuna di esse sarà progettata in modo da rendere al meglio il punto di vista che rappresenta. Punto fondamentale di tutto il progetto è lo studio indipendente di ciascuna delle mappe. Seguendo questo metodo è stato possibile rendere evidenti le diversità tra i vari punti di vista.: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

timeline; geografia; classificazione; autore; fonderia; metodo di produzione; destinazione d’uso; ordine alfabetico.

Le mappe saranno navigabili interattivamente e porteranno alle schede dei caratteri, oppure a pagine intermedie di approfondimento. L’interattività in questi casi è risultata importante per mantenere un’adeguata leggibilità e pulizia, evitando un sovraffollarsi di contenuti, senza però dover eliminare alcuna informazione per motivi di spazio, seguendo i consigli di John Maeda: »» John Maeda Le leggi della semplicità Bruno Mondadori, 2006

“

Quando tutte le cose che si potevano rimuovere sono state rimosse e un prodotto è stato reso snello, leggero e sottile, è tempo di procedere con il secondo metodo: nascondere la complessità.

”

In alcuni casi, in particolare la geografia e la destinazione d’uso, aggiungono una componente narrativa. In altri casi si è puntato sul visualizzare le voci in modo da rendere evidenti le connessioni e i contesti, sfruttando la capacità delle tecnologie a disposizione di passare da un panorama generale ad una vista di dettaglio senza compromettere o dover eliminare informazioni importanti. Alle mappe è possibile applicare dei filtri, gli stessi della modalità ricerca, in modo da utilizzare la medesima visualizzazione in contesti diversi; per esempio sarà possibile esplorare su una timeline tutti i caratteri sans-serif inglesi.

5.5

le pagine di filtro

In alcune mappe i caratteri saranno presentati in gruppo – per esempio tutti i caratteri progettati in Francia – anziché singolarmente – per esempio: Garamond, Didot, Metro. In questi casi sono necessarie alcune pagine con funzione di filtro, che, separate dalla mappa principale, elenchino le famiglie di caratteri precedentemente visualizzati solo come gruppo. Si tratta di situazioni in cui scelta primaria sarà mantenuta sotto forma di filtro da applicare ad una delle altre mappe. Volendo mantenere lo stesso esempio di prima, sarà possibile vedere la timeline dei caratteri disegnati in Francia, oppure gli stessi caratteri suddivisi per autore. Queste pagine conterranno anche del materiale di approfondimento, di tipo enciclopedico, come, per esempio, la storia della Francia dal punto di vista tipografico. Le mappe che necessitano di questa funzione aggiuntiva sono: ԀԀ geografia; ԀԀ fonderia; ԀԀ autore. Sebbene in quest’ultimo caso sia anche possibile accedere direttamente alla pagina di uno dei suoi caratteri, si è scelto di creare un collegamento con una pagina dedicata a ciascun autore in cui elencare i progetti da egli realizzati. 5.6 pagine di approfondimento Alcune pagine si occuperanno di svolgere una funzione di approfondimento anche dove un filtro non è necessario. Si è optato per questa scelta viste le finalità didattiche del progetto. Si è ritenuto infatti utile ai fini dell’apprendimento specificare quali sono stati i criteri e le storie dietro ciascuna classificazione e non semplicemente utilizzarle per categorizzare i caratteri. Altre pagine di approfondimento si trovano collegate ai metodi di produzione, dove oltre a scegliere i caratteri in base a come sono stati realizzati originariamente, sarà possibile documentarsi sulle peculiarità di ciascuno di questi metodi.

struttura

home page

Timeline

Publisher

Geografia

Classificazione

Produzione

Destinazione d’uso Autore

schede carattere

Specimen

Anatomia

fig. 56 Albero delle pagine principali dell’Atlante.

Consigli

Glifi chiave

In uso

Versioni e alternative

Dati

RicercaRicerca Area utente Area utente CreditsCredits

Gestione Gestione ProfiloProfilo

FavoritiFavoriti

Caricamento Caricamento Aggiunta Aggiunta Font Font AutoreAutore

Classificazione ClassificazioneGeografia Geografia Publisher Publisher British STD British STD Italia Italia Novarese/Fuga Novarese/Fuga FranciaFrancia Dixon Dixon Inghilterra Inghilterra Vox+ Vox+ [...] [...]

struttura

About About

LinotypeLinotype FontFont FontFont Emigre Emigre [...] [...]

AutoreAutore MajoorMajoor Spiekermann Spiekermann Miedinger Miedinger [...] [...]

I contenuti trattati in queste pagine di approfondimento saranno tratti da libri ed altre fonti autorevoli, sintetizzati per essere adatti ad una fruizione on-line. 5.7

ricerca

Una parte volutamente tenuta a margine del progetto è la funzione di ricerca, un’utilità che di solito è fondamentale davanti ad enormi database; questo per favorire l’esplorazione delle mappe, in modo da scoprire le relazioni tra i caratteri piuttosto che cercare secondo ciò che già si conosce, riducendo così drasticamente la serendipità. Per la ricerca è stato pensato un sistema di filtri intrecciabili tra di loro. I filtri ricalcano grossomodo le proprietà esplorabili con le mappe. Sarà infatti possibile scegliere un periodo di tempo, un’area geografica, una categoria, un autore o una fonderia, così come un metodo di produzione o una destinazione d’uso. Inoltre si è pensato di sfruttare la classificazione Dixon e i suoi parametri per effettuare ricerche basate sull’anatomia del carattere. Come già detto, gli stessi filtri saranno applicabili anche alle mappe. •

100

102

6 dettagli e funzioni

• uando sono stati definiti obiettivi, contenuti e architettura generale dell’Atlante si è passato a progettare i singoli tasselli che avrebbero composto il sistema. Si è proceduto in principio definendo funzioni e wireframe delle mappe, lavorando con lo scopo di capire come sfruttare l’interattività e la disposizione degli elementi per ottenere uno strumento didattico. Da subito è risultata chiara la necessità di evitare i classici elenchi di caratteri, tipici dei database o di operazioni più enciclopediche, come per esempio Typedia. Le schede dei caratteri sono invece state pensate per approfondire la conoscenza delle singole famiglie. In questo caso oltre le schede più interattive si è ritenuto opportuno inserire alcune parti di approfondimento storico. Nel caso di caratteri appartenenti alla prima classe di importanza si è scelto di fornire indicazioni circa l’utilizzo concreto. Il passaggio successivo è stato la progettazione dell’interfaccia dell’applicazione, partendo dalla homepage fino a definire le mappe e le schede.

103

6.1 grafica dell’interfaccia L’interfaccia del sito è stata pensata per mettere al centro dell’attenzione le mappe. Poiché le mappe presentano spesso complessità di visualizzazione si è scelto uno stile poco invasivo, con molti spazi bianchi, a richiamare lo stile tipografico, per facilitare la concentrazione dell’utente. Fatta eccezione per la home page, le altre pagine del sito sono strutturate in maniera simile tra loro, condensando i link alle diverse pagine nella barra di navigazione superiore e mantenendo a sinistra una barra laterale contenente le informazioni relative alla mappa oppure ai contenuti della pagina ed i filtri applicabili per la ricerca. La maggior parte dello spazio sarà destinato alla mappa o alla scheda del carattere. La parte alta di ogni mappa sarà destinata ad ospitare i controlli della stessa, solitamente zoom dei contenuti e selettore temporale. Dal punto di vista grafico si è puntato al minimalismo che si ritrova nei manuali tipografici, limitando gli interventi grafici, per non condizionare la percezione dei testi o creare confusione nella lettura delle mappe. ґґ colori La palette colori è incentrata sul rosso ed il nero, usati in molti manuali di tipografia, al fine di inserire il lavoro dentro questo contesto tematico. A fig. 57 Palette dei colori.

#C0272D

#00A89C

R 51 G 51 B 51

R 192 G 39 B 45

R 0 G 168 B 156

#FFFFFF

#C0272D

#00A89C

R 255 G 255 B 255

R 192 G 39 B 45

R 0 G 168 B 156

#333333

104

#999999

R 153 G 153 B 153 #999999

R 153 G 153 B 153

questi si è affiancato un turchese come terzo colore, da usare specialmente in negativo sul nero, per dare all’aspetto un sentimento più contemporaneo. L’uso del turchese trova fondamento anche nella sua complementarietà con il rosso scelto, al fine di mantenere una certa neutralità dei toni. Per lo stesso motivo si è anche fatto largo uso di grigi chiari. ґґ font utilizzati L’interfaccia fa uso di due font: uno adatto al testo, che garantisse un’ottima leggibilità anche a corpi piccoli, dotato di corsivo e diversi pesi, ed uno per le intestazioni, che abbia un forte impatto visivo, ma che non occupasse troppo spazio in orizzontale. La scelta, nel primo caso, è ricaduta sull’Adelle, famiglia di caratteri disegnata da Jose Scaglione e Veronika Burian, i fondatori di Type Together. Le motivazioni, oltre alla piena soddisfazione dei criteri sopra descritti, sono da trovarsi nel look fresco dei loro lavori, sebbene nel rispetto nella tradizione. L’Adelle è uno slab-serif con grazie raccordate a cuneo, dal contrasto basso e le aperture ampie. Questo lo rende ottimale per la resa a schermo, senza sacrificare la leggibilità in testi lunghi. L’Adelle è anche fornito di maiuscoletto, numeri minuscoli e di frecce, che sono risultate utili in fase di progettazione, ma lo saranno ancor di più in fase di sviluppo, eliminando la necessità di usare le immagini per creare le frecce. L’Adelle è stato insignito del premio d’oro nella categoria “Carattere originale” nella competizione ED-Awards 2010. Ad affiancare l’Adelle, specialmente per le intestazioni è stato scelto il League Gothic, carattere prodotto dalla League of Moveable Type, una lega che si propone la diffusione di caratteri gratuiti ma di qualità per il web. Il League Gothic riprende i disegni dei caratteri gotici americani; di preciso è un revival dell’Alternate Gothic #1, disegnato da Morris Fuller Benton nel 1903 per la American Type Founders, fallita nel 1993. È stato scelto per la sua forza e la compattezza delle proporzioni, che lo rendono utile nel caso di elenchi di date o nelle colonne strette. È disponibile un solo peso classificabile come bold. Ha inciso nella scelta la tendenza attuale che vede una nuova popolarità di questo modello di caratteri.

dettagli e funzioni

»» www.type-together.com è una fonderia digitale fondata nel 2006 da Veronika Burian e Josè Scaglione; ha ricevuto diversi riconoscimenti dal Type Directors Club e dagli Ed-Awards

Adelle Light – 12 pt Regular Semibold Extrabold Heavy 5 pt – Quel fez sghembo gli copriva davanti!

8/10 – The quick brown fox jumps over the lazy dog!

Light Bold – 12 pt Regular Semibold Extrabold Heavy fig. 58 Adelle, nei vari pesi e corsivi.

»» The League of Moveable Type www.theleagueofmoveabletype.com

League Gothic 18pt

UPP3RCASE no le4ding fig. 59 Il League Gothic regular.

105

La commistione di questi due stili permette di avere un progetto che appaia contemporaneo, ma non legato ad una moda, capace di colpire l’utente senza negargli la possibilità di leggere testi di una certa lunghezza. ґґ logo Il logo, composto in Adelle Heavy e Light, è stato pensato appositamente come cartello di benvenuto al sito. La scelta di usare l’Adelle deriva da motivi di coerenza con il resto del testo, ma anche dall’aspetto contemporaneo e accattivante. Il peso heavy gli conferisce una forza notevole agli occhi dei visitatori. Il f leuron di sfondo definisce un altro elemento caratterizzante l’Atlante, ossia la presenza di ornamenti risalenti alla tradizione tipografica, utilizzati per indicare aree speciali o per separare sezioni di contenuto. fig. 60 Il logo di a Typefaces Atlas, con le versioni ridotte adattate alla navbar.

Typefaces atlas

a Typefaces atlas a Typefaces atlas ґґ homepage La homepage è stata progettata per accogliere i visitatori ed indirizzarli in breve tempo alla navigazione dei contenuti. Al centro della pagina si trova il logo, con un brevissimo abstract, in modo da definire subito il tono e gli obiettivi dell’Atlante. Tramite l’ampio uso di spazi bianchi viene da subito resa chiara l’importanza che hanno le mappe, poste in rilevanza sotto il logo. Al di sotto della folding line si trova il modulo per la ricerca tramite parole chiave: è possibile

106

C login

signup

maps

about

credits

Typefaces atlas

choose the map that will lead you trough the discovery of typefaces

perform a search in our database

TIM

MAPS →

ELI GEO NE GR CLA APHY SS AUT IFICAT HO ION PUB R LIS PRO HER DU USA CTION GE

typeface knowledge through interactive maps

↑ BACK UP

FILTERS Period

Free search

From To

Typeface

Production manual

Author

mechanical

apply filters to narrow down the search results

Usage book invitation infographic logo text display

digital

Publisher

le erpress

Nation

Classification serif

other

CONTACTS Andrea Gessa via Candiani 112, 20158 Milano +39 3400914931 ag@andreagessa.com

fig. 61 Homepage di a Typefaces Atlas.

↑ BACK UP

clarendon/ionic

humanist

grecian

aldine taste

latin/runic

dutch taste

italian antique

british taste

sans serif

continental taste

grotesque

fat face

neogrotesque

tuscan

geometric

egyptian

roman sans

ABOUT → “A Typefaces Atlas” is a project aimed to improve knowledge of typefaces. → It consists of interactive maps that browse through the milestones of typography. → Registered users can upload other typefaces IDs.

Can I download your thesis?

dettagli e funzioni

A Typefaces Atlas è un supporto dida ico per l’apprendimento dei cara eri tipografici più importanti, delle loro storie e dei loro autori. www.andreagessa.com/atypefacesatlas.pdf

107

effettuare una ricerca libera tra tutti i tag, oppure scegliere quale campo sfruttare, tra nome del carattere, autore, nazione, fonderia. Sulla destra è possibile applicare i filtri a questa ricerca, per scremare i risultati. Al di sotto della ricerca sono presenti i contatti, i crediti e le informazioni generali riguardanti l’Atlante, con una breve sezione faq e i link alla documentazione. Sotto le intestazioni principali – mappe, ricerca, filtri – sono state inserite delle brevi istruzioni per guidare il visitatore nell’utilizzo dell’Atlante. In cima alla pagina è presente, come nel resto del sito, la barra di navigazione. ґґ barra di navigazione Questa presenta il logo, con funzione di link alla homepage – ad eccezione, ovviamente, della home page stessa – l’area per il login e la registrazione a tendina sulla sinistra, un menu a tendina per selezionare le mappe e i link per la ricerca avanzata, le informazioni sul progetto e i crediti. Una volta eseguito il login, la parte sinistra della barra ospiterà un pannello per spostarsi alla gestione del proprio account, con le seguenti opzioni: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

profilo; favoriti; carica un carattere; impostazioni account; logout.

Si è pensato di mantenere le dimensioni ridotte al fine di non occupare spazio utile alla visualizzazione delle mappe. Il colore scuro di sfondo è stato scelto per staccare la barra dal resto e fornire al visitatore un punto di riferimento stabile e costante all’interno di tutto l’Atlante. 6.2 le mappe Le mappe rappresentano il cuore dell’Atlante; esse sono gli strumenti interattivi pensati per navigare ed esplorare il database di caratteri. La loro particolarità risiede nell’essere state progettate indipendentemente l’una dall’altra al fine di rendere al meglio il punto di vista relativo ad ognuna di esse. Contestualmente all’utilizzo delle mappe sarà presente un sistema di filtri che permetterà di ot-

108

dettagli e funzioni

109

a Typefaces a Typefaces atlas atlas

fig. 63 La barra di navigazione con il menu a tendina per il profilo aperto.

Logout

Your profile Favourites Upload a typeface Account settings

Hello login Andrea signup CC

fig. 62 La barra di navigazione con il menu per il login aperto.

Forgot Forgot your your password? password?

Remember Remember me me

Password Password

Username Username

search search

about about

fig. 64 La barra di navigazione con il menu a tendina per le mappe aperto.

Timeline Geography Classification Author Publisher Production Usage

maps maps

→

about about

Advanced Advanced search search

SelectSelect a yeara year

search search

fig. 65 La barra di navigazione con il pannello per la ricerca rapida.

maps maps

credits credits

tenere una esplorazione più efficacemente mirata verso i contenuti che l’utente vorrà ricercare. 6.2.1 timeline La prima delle mappe è relativa alla collocazione nel tempo dei caratteri. Nella parte alta è presente uno scroll che permette di scorrere velocemente la timeline. Sono segnati in rosso gli anni in cui sono nati i principali periodi della tipografia, secondo Letter Fountain. fig. 66 È presente uno zoom con cui è possibile passare da una vista più panoramica e che fornisca già ad una visione superficiale un’idea dell’evoluzione della tipografia, fino ad approfondire i caratteri di seconda e terza classe. Lo zoom non ingrandisce gli elementi della mappa, ma aumenta lo spazio a disposizione di ogni elemento. fig. 68 Poco sotto è presente un nastro dove vengono riportate brevi informazioni riguardanti il contesto storico in un determinato periodo, riguardanti la tipografia. Nella mappa vengono riportati i caratteri uno di fianco all’altro. La riga superiore è popolata da caratteri appartenenti alla classe di importanza principale. Questi si comportano come pietre miliari sotto cui vengono posizionati i caratteri di minore importanza storica. Ogni famiglia avrà a disposizione un box, composto con di breve scheda identificativa e a seguire alcune foto che lo ritraggono in contesti d’uso. La dimensione del box dipende dalla classe d’importanza del carattere e dal livello di zoom. All’aumentare dello zoom aumenteranno le dimensioni del box, ma non delle immagini, che cresceranno invece in numero. Nel box le informazioni saranno le seguenti: ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ ԀԀ

110

nome del carattere; autore; anno di progettazione; nazione; fonderia; anno della versione considerata; autore della versione considerata; anno di edizione della versione considerata; nazione della versione considerata; fonderia della versione considerata.

a Typefaces atlas

signup

– ZOOM +

Maps/ TIMELINE Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

1725 →

FILTERS Importance ↑

medium low Period ↑ From

Select a year

↓

Select a year

↓

Production ↓ Usage ↓

Anatomy ↓

Baskerville

1789 Bodoni

1845

1915

1924

1926

1915

J. Baskerville UK J. Baskerville

M.F. Benton USA ATF

1750 Cochin 1977

1750 Nome D. Caslon UK U. Caslon

1915

1764 Fournier P.S. Fournier France Fournier

1925

M.F. Benton USA ATF

P.S. Fournier France Monotype

1750 Nome

1788 Bell

R. Austin UK British Le er Foundry

1931

R. Austin UK Monotype

1804

Walbaum J.E. Walbaum Germany Berthold

1975 G.G. Lange Germany Berthold

Egyptian V.Figgins UK U. Caslon

1813

1875

Monotype Scotch Roman

Bruce

R. Austin UK Miller

1915

M.F. Benton UK Monotype

1750 Nome D. Caslon UK U. Caslon

1915

1975

M.F. Benton USA ATF

1896 Cheltenham B. Goodhue USA Kingsley/ATF

1757

Baskerville

1789 Bodoni

1924

1915

J. Baskerville UK J. Baskerville

medium low Period ↑ From

Select a year

↓

Select a year

↓

Production ↓ Usage ↓ Classification ↓ Anatomy ↓

Fournier P.S. Fournier France Fournier

1925 P.S. Fournier France Monotype

1750 Nome D. Caslon UK U. Caslon

D. Caslon UK U. Caslon

about

credits

First Industrial Revolution Steam engine is used in mechanical production England pioneers this development

G. Bodoni Italy G. Bodoni

M.F. Benton USA Monotype

1764

M.F. Benton USA Linotype

1750 Nome

T. Stan USA ITC

1800 →

high

L.B. Benton USA ATF

145 0 147 5 150 0 152 5 155 0 157 5 160 0 162 5 165 0 167 5 170 0 172 5 175 0 177 5 180 0 182 5 185 0 187 5 190 0 192 5 195 0 197 5 200 0

maps

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

Importance ↑

Century

fig. 67 Schermata della mappa Timeline, secondo livello di zoom.

a Typefaces atlas

FILTERS

1894

D. Caslon UK U. Caslon

1986

M.F. Benton USA ATF

fig. 66 Schermata della mappa Timeline, panoramica sul 1725.

– ZOOM +

H. Eidenbenz Switzerland Haas

1915

D. Caslon UK U. Caslon

Maps/ TIMELINE

B. Fox UK Robert Besley & Co.

H. Jost Germany Bauer

1817

D. Caslon UK U. Caslon

Clarendon

G. Bodoni Italy G. Bodoni

M.F. Benton USA Monotype

1750 Nome

signup

credits

First Industrial Revolution Steam engine is used in mechanical production England pioneers this development

1757

M. Carter USA Linotype

C login

about

1725 Caslon

C.N. Cochin France C.N. Cochin

Classification ↓

1800 →

British Period

D. Caslon UK U. Caslon

high

maps

145 0 147 5 150 0 152 5 155 0 157 5 160 0 162 5 165 0 167 5 170 0 172 5 175 0 177 5 180 0 182 5 185 0 187 5 190 0 192 5 195 0 197 5 200 0

C login

M.F. Benton USA ATF

1788 Bell

R. Austin UK British Leer Foundry

1931

R. Austin UK Monotype

1804

Walbaum J.E. Walbaum Germany Berthold

1975 G.G. Lange Germany Berthold

1813 Monotype Scotch Roman R. Austin UK Miller

1915

M.F. Benton UK Monotype

1817

Egyptian V.Figgins UK U. Caslon

1915 M.F. Benton USA ATF

dettagli e funzioni

111

a Typefaces atlas

signup

– ZOOM +

Maps/ TIMELINE Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

maps

1800 →

FILTERS

about

credits

145 0 147 5 150 0 152 5 155 0 157 5 160 0 162 5 165 0 167 5 170 0 172 5 175 0 177 5 180 0 182 5 185 0 187 5 190 0 192 5 195 0 197 5 200 0

C login

First Industrial Revolution Steam engine is used in mechanical production England pioneers this development

1789 Bodoni

Importance ↑

G. Bodoni Italy G. Bodoni

high medium

1915

low Period ↑ From

Select a year

↓

Select a year

↓

Production ↓ Usage ↓ Classification ↓ Anatomy ↓

M.F. Benton USA ATF

1804

Walbaum J.E. Walbaum Germany Berthold

1975 G.G. Lange Germany Berthold

1813 Monotype Scotch Roman R. Austin UK Miller

1915

M.F. Benton UK Monotype

1817

Egyptian V.Figgins UK U. Caslon

1915 M.F. Benton USA ATF

fig. 68 Schermate della mappa Timeline; all’aumentare dello zoom aumenta lo spazio dedicato a ciascun carattere.

112

Nel caso di sovrapposizione temporale di due caratteri di classe 1 – per esempio Helvetica e Optima – questi verranno presentati appaiati. Gli eventuali caratteri sotto di essi, catalogati secondo le classificazioni e dove possibile secondo parametri anatomici, confluiranno sotto il carattere principale con cui condividono maggiori caratteristiche. Qualora capitassero due caratteri entrambi di primaria importanza, appartenenti alla stessa categoria e che si susseguono direttamente – per esempio Didot e Bodoni – questi saranno posti affiancati senza delimitazioni e i caratteri a loro riconducibili saranno posti indistintamente sotto l’uno o l’altro come se fossero lo stesso carattere. Le voci presenti nella carta d’identità qui presente sono link diretti alla voce stessa. Prendiamo per esempio l’Helvetica: cliccando sul nome Helvetica si arriverà alla pagina di dettaglio del carattere con le schede annesse. Cliccando su Miedinger – designer dell’Helvetica – si verrà condotti alla pagina di approfondimento relativa all’autore, così come cliccando su Linotype si arriverà alla pagina di approfondimento sulla fonderia. All’aumentare del livello di zoom aumenteranno anche le informazioni visibili, che includeran-

no così categoria di appartenenza, metodo di produzione, destinazione d’uso. Questa mappa ha due scopi: da un lato fornire una visione d’insieme della storia della tipografia, da scorrere come un film. Dall’altro fornire un approfondimento sugli stili propri di un periodo storico. 6.2.2 geografia La seconda delle mappe mostra il peso che le diverse nazioni hanno avuto nel campo della tipografia nel corso del tempo. Nella mappa le Nazioni sono rappresentate da simboli circolari, le cui dimensioni sono proporzionali al numero di caratteri che ogni nazione ha prodotto nello span temporale considerato. I simboli sono disposti secondo la geografia reale, adattata alle nuove dimensioni dipendenti dal numero di caratteri.fig. 69 Le barre strumenti in alto permettono di regolare l’ingrandimento fisico della mappafig. 70 e di impostare uno span temporale di riferimento. fig. 71 La mappa sarà navigabile come le comuni mappe geografiche. Ogni cerchio conterrà il nome della nazione per esteso, o, se le dimensioni ridotte non lo permettono, la sigla internazionale. Inoltre, dove possibile, sarà visualizzato il numero di caratteri considerato. Anche in questo caso è possibile attivare i filtri nella barra laterale di sinistra, che avranno effetto direttamente sulla mappa. Per esempio sarà possibile considerare quali Nazioni hanno avuto un peso maggiore nello sviluppo dei sans-serif nella prima metà del XX secolo. Cliccando una delle nazioni si andrà alla pagina di approfondimento legata a quella nazione. Qui, oltre ai contenuti testuali di tipo storico-tipografico, si avrà una lista dei caratteri appartenenti a quella nazione e che soddisfano i criteri impostati negli altri filtri. fig. 72 Lo scopo di questa mappa è mostrare il peso che le diverse nazioni hanno avuto nel corso degli anni. Una volta messo in relazione questo dato con i periodi storici, oppure studiate le schede di approfondimento di ogni nazione, si capirà come essa ha inciso nella storia della tipografia, quali sono stati i motivi e se ad una lezione è legato particolarmente uno stile.

dettagli e funzioni

113

a Typefaces atlas

signup

– ZOOM +

Maps/ GEOGRAPHY

maps

about

credits

145 0 147 5 150 0 152 5 155 0 157 5 160 0 162 5 165 0 167 5 170 0 172 5 175 0 177 5 180 0 182 5 185 0 187 5 190 0 192 5 195 0 197 5 200 0

C login

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

FILTERS Importance ↑ high medium low Period ↑ From

Select a year

↓

Select a year

↓

Production ↓ Usage ↓

UK 6

USA 5

Classification ↓

NED 2

France 4

Anatomy ↓

GER 5 SWI 3

Italy 4

fig. 69 La mappa Geografia, con i caratteri di importanza principale dal 1450 al 2000, con uno zoom ridotto e centrato sull’Europa. a Typefaces atlas

signup

– ZOOM +

Maps/ GEOGRAPHY

UK 6

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

FILTERS Importance ↑ high medium

maps

NED 2

low

Select a year

↓

Select a year

↓

about

credits

GER 5

Period ↑ From

145 0 147 5 150 0 152 5 155 0 157 5 160 0 162 5 165 0 167 5 170 0 172 5 175 0 177 5 180 0 182 5 185 0 187 5 190 0 192 5 195 0 197 5 200 0

C login

Production ↓ Usage ↓ Classification ↓ Anatomy ↓

France 4

SWI 3

Italy 4 fig. 70 La mappa Geografia con gli stessi criteri precedenti ma un maggiore livello di zoom.

114

a Typefaces atlas

signup

– ZOOM +

Maps/ GEOGRAPHY

maps

about

credits

145 0 147 5 150 0 152 5 155 0 157 5 160 0 162 5 165 0 167 5 170 0 172 5 175 0 177 5 180 0 182 5 185 0 187 5 190 0 192 5 195 0 197 5 200 0

C login

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

FILTERS Importance ↑ high medium low Period ↑ From

Select a year

↓

Select a year

↓

UK 3 NED 2 GER

Production ↓ Usage ↓

France 4

Classification ↓ Anatomy ↓

Italy 4

fig. 71 La mappa Geografia, con i caratteri di importanza principale dal 1450 al 1800; risulta evidente che Nazioni come l’Italia e la Francia hanno avuto maggior peso nelle prime fasi della storia della tipografia. a Typefaces atlas

signup

– ZOOM +

Maps/ GEOGRAPHY

maps

about

credits

145 0 147 5 150 0 152 5 155 0 157 5 160 0 162 5 165 0 167 5 170 0 172 5 175 0 177 5 180 0 182 5 185 0 187 5 190 0 192 5 195 0 197 5 200 0

C login

FILTERS Importance ↑ high medium low Period ↑ From

Select a year

↓

Select a year

↓

←

Italy

BACK TO THE MAP

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

1465

Sweynheym & Pannartz cut the firt roman in Subiaco

1485

Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese.

1501

Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese. Storia dell’Italia che ha peso sulla tipografia di quel Paese.

1524

1800

Production ↓ Usage ↓ Classification ↓ Anatomy ↓

Centaur Bembo Bodoni UK 3 NED 2 GER

France 4

Italy 4

fig. 72 La scheda relativa all’Italia, con brevi cenni alla sua storia tipografica e un elenco dei caratteri italiani.

dettagli e funzioni

115

6.2.3 classificazione La mappa delle classificazioni ha lo scopo di chiarire le confusioni tra le diverse nomenclature degli stili. Inoltre serve per capire le differenze tra le categorie, raccogliendo esempi concreti. Le diverse classificazioni sono inserite in colonne. A fianco sono presenti i caratteri che corrispondono ai criteri scelti nei filtri. Selezionando uno stile di una classificazione si evidenziano automaticamente le corrispondenze nelle altre classificazioni e i caratteri che ad essa appartengono.fig. 73 Selezionando invece un carattere viene evidenziato lo stile a cui quel carattere appartiene secondo le diverse classificazioni nonché i caratteri appartenenti alla stessa classe.fig. 74 Cliccando sul nome di ogni classificazione è possibile andare alla pagina di approfondimento relativa alla classificazione, dove sono esposti la genesi, i criteri secondo cui funziona, le classi che vengono definite ed eventuali rivisitazioni.fig. 75 Le classificazioni scelte sono quelle maggiormente citate nei manuali di tipografia. Di alcune di queste si è fatto riferimento a versioni recena Typefaces atlas

DIXON

FONT

humanist

century

medium low

didones slab serif

scri i / calligrafiche

grotesque

benton

ornati / fregiformi

neogrotesque

egiziani

geometrical

humanist

Select a year

↓

glyphic

Select a year

↓

Production ↓ Usage ↓ Classification ↓ Anatomy ↓

modern

didones slab serif

fantasie / moda

From

serif

transizionali / barocche bodoniani / neoclassiche

lineari / bastoni

Period ↑

garaldes transitional

neoclassical

vernacular

high

garaldes transitional

old face

VOX+

humanist

mediovali / gotiche

Importance ↑

credits

BRITISH STD

veneziani / rinascimentali

FILTERS

about

lapidari / romani antichi

aldine taste

jenson

dutch taste

bembo

british taste

garamond

continental taste

caslon

fat face

baskerville

tuscan

times new roman

egyptian

bodoni

clarendon/ionic

didot

grecian

walbaum centennial

onciali e amanuensi

script

latin/runic

nuovi lapidari / incisi

graphic

italian antique

rockwell

gothic

grotesque

clarendon

nuovi transizionali geometrici / slab serif

classic deco

lineari lapidari / modulati

typographic

lineari a contrasto

disorder

sans serif

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

NOVARESE/FUGA

text

Maps/ CLASSIFICATION

maps

display

signup

lineale

C login

neogrotesque

joanna

geometric

franklin gothic

roman

akzidenz grotesk

techno

helvetica

spezze ati / stencil

modular

universe

da ilografici

fantasy

lineari quadrati

computerizzati

futura frutiger meta avenir gill sans optima syntax

fig. 73 La mappa Classificazioni, filtrata per i caratteri delle prime due categorie di importanza.

116

a Typefaces atlas

high medium low

DIXON

FONT

humanist

bodoni

mediovali / gotiche

garaldes

transitional

didones

slab serif

scri i / calligrafiche

grotesque

benton

ornati / fregiformi

neogrotesque

egiziani

geometrical

humanist

glyphic

onciali e amanuensi

script

nuovi lapidari / incisi

graphic

fantasie / moda

From

Select a year

↓

Select a year

↓

nuovi transizionali

Usage ↓ Classification ↓ Anatomy ↓

neoclassical

walbaum

british taste

centennial

continental taste

rockwell

fat face

clarendon joanna franklin gothic

clarendon/ionic

akzidenz grotesk

grecian

helvetica

script

latin/runic

universe

graphic

italian antique

futura

gothic

grotesque

frutiger

classic deco typographic

lineari quadrati

didot

dutch taste

tuscan

geometrici / slab serif

lineari a contrasto

aldine taste

egyptian

lineari lapidari / modulati

display

Production ↓

modern

transizionali / barocche bodoniani / neoclassiche

old face

VOX+

humanist

lineari / bastoni

Period ↑

credits

BRITISH STD

vernacular

Importance ↑

about

lapidari / romani antichi

veneziani / rinascimentali

FILTERS

NOVARESE/FUGA

sans serif

Informazioni su come funziona la mappa. Informazioni su come funziona la mappa.

maps

text

Maps/ CLASSIFICATION

serif

signup

lineale

C login

disorder

neogrotesque