Lectures on typefaces

Lectures on

Alexei Kapterev

Moscow State University Higher School of Business Administration

TYPEFACES

I could not imagine a situation in which Apple would ever

be bigger and more profitable than Microsoft.

WILLIAM GATES III

Microsoft, founder and then CEO

But in the end, Microsoft didn’t create products of

ethereal beauty. Steve believed you had to control

every brush stroke from beginning to end …

because he had a passion for perfection.

WALTER ISAACSON

Steve Jobs’ biographer

Stanford, 2005

I learned about serif and sans serif typefaces, about

varying the amount of space between different letter

combinations, about what makes great typography

great. It was beautiful, historical, artistically subtle in a

way that science can't capture, and I found it fascinating.

STEVEN PAUL JOBS

Apple, Inc. founder and then CEO

serif and sans serif

E SERIFS

EESERIF SANS-SERIF

STEVEN PAUL JOBS

typefaces

Fedra Sans Normal Italic

Fedra Sans Light

Fedra Sans Bold

TYPE FAMILY Семейство шрифтов

TYPEFACE ГарнитураFedra Serif

Fedra Sans

FONT Шрифт

I. Serifs

II. Contrast

III. Antiqua

IV. Grotesque

I WILL TRY NOT TO BOTHER YOU WITH TERMINOLOGY

STEVEN PAUL JOBS

beautiful, historical, artistically subtle

a aHelvetica Myriad Pro

STEVEN PAUL JOBS

about what makes great typography

great.

Robert Paladino’s calligraphy

Mac OSX + Firefox

Windows XP + Firefox

WHO THE HELL

CARES?It’s just a font

Imagine you have to stay at one of these hotels…

BELVEDEREHotel

BELVEDEREHOTEL

Belvedere

BELVEDEREHotel

BELVEDEREHOTEL

Belvedere

BELVEDEREHotel4.

MOST OF YOU VOTED FOR №4!

Just what I’ve expected!

CENSORED

MAMMOTHMammoth

http://onlinelibrary.wiley.com/doi/10.1111/j.2044-8295.1989.tb02317.x/abstract

HEAVYElegant

ELEGANTHeavy

Temptation

TEMPTATION

http://www.sciencedirect.com/science/article/pii/S0148296302004873

TRACTOR

Tractor

Source: Phil Renaud, 2006 http://goo.gl/GOZYe

Georgia 23

Trebuchet 18

Times 11

5 4–

This is the case with car dealers also. And I recently had an experience at Fiat of Manhattan that was nothing short of mind-blowingly bad.

RECALL

http://hbr.org/2012/03/hard-to-read-fonts-promote-better-recall/

Lorem impu dolor sit amet, consetetur more. Lorem impus dolor sit amet,

consetetur sadipsing elitrsed. Loremimpus dolor sit met...

Lorem impu dolor sit amet, consetetur more. Lorem impus dolor sit amet,

consetetur sadipsing elitrsed. Loremimpus dolor sit met...

MOTIVATION

http://dornsife.usc.edu/assets/sites/780/docs/08_ps_song___schwarz_effort.pdf

15.1 min.

8.2 min.

Arialhttp://www.ncbi.nlm.nih.gov/pubmed/18459353

HUMOUR

Source: Benjamin Berman, David Dunning

http://goo.gl/cMd3H

Is it true that “we live in an era of unprecedented safety”?

( ) Yes: The claim is true

( ) No: The claim is false

How confident are you in your conclusion?

( ) Slightly confident

( ) Moderately confiden

( ) Very confident

Source: Benjamin Berman, David Dunning

http://goo.gl/cMd3H

The page from June 9-10, 1855, is notable because the handwriting changes suddenly, halfway down the page. On first inspection it appears to be written by two different people or perhaps someone with multiple personality disorder. The writing on the top half of the page is elegant but unreadable, the writing on the bottom half, awkward but entirely legible. The reason for the abrupt change becomes clear only through reading the journal.

The page from June 9-10, 1855, is notable because the handwriting changes suddenly, halfway down the page. On first inspection it appears to be written by two different people or perhaps someone with multiple personality disorder. The writing on the top half of the page is elegant but unreadable, the writing on the bottom half, awkward but entirely legible. The reason for the abrupt change becomes clear only through reading the journal. 2%The page from June 9-10, 1855, is notable because the handwriting changes suddenly, halfway down the page. On first inspection it appears to be written by two different people or perhaps someone with multiple personality disorder. The writing on the top half of the page is elegant but unreadable, the writing on the bottom half, awkward but entirely legible. The reason for the abrupt change becomes clear only through reading the journal.

2%DIFFERENCE

Even though most people can’t tell Baskerville from Georgia!

TYPEFACES WORK BELOW

THE CONSCIOUS LEVEL TOO

If you can’t tell the difference doesn't mean it won’t affect you

But…WHY?

TYPOGRAPHYžcreates an emotional connection

TYPOGRAPHY CREATES

AN EMOTIONAL CONNECTION

Typography creates an emotional connection

CONTROL IT?

Ok, but can we

YES◆ ◆

COFFEE 30 р.

Coffee 300 ₽

FEEL➳

It’s a question ofRESOLUTION

adidasadidas

adidas

adidasadidas

I love you

Helvetica

You can’t create good

typography with Arial.

MATHEW BUTTERICK

Typography for Lawyers

I love you

I love youArial

Helvetica

yy 97°90°

ArialHelvetica

Lufthansa

JeepJeep

GAGARINArial

Helvetica

GAGARIN

To improve your resolution

Jenson Cloister

Renaissance Baroque

Old Style ModernTransitional

Slab SerifAntiqua

Serif Sans Serif

Print Handwriting

TYPEFACE

◆ ◆

THERE IS NO UNIVERSAL

TYPE CLASSIFICATION

TextText

PRAGMATIC

Display

MEMORABLE

Display

Main body test Headlines

Слышишь

Beautiful

Readable

Readable BeautifulMight happen

READABILITY✤ There is no single “most readable typeface”, sorry

✤ Measure readability whenever you can

✤ Serifs are for paper, sans-serifs for the screen

✤ Good readability: Humanist sans-serif, Transitional serif

✤ Bad readability: Geometric sans-serif, Modern serif

Sans-Serif

Respectable, stable and classy

Modern, hip and edgy

Readable

Humanist

GEOMETRIC

Warm, friendly and emotional — but sloppy

Calculated and rational — but formal and cold

Pragmatic and dependable — but boring and easily forgettable

1. One for a logo — interesting & memorable

2. One for the main text — readable

3. Don’t use: Calibri, Times, Arial, Papyrus, Segoe Script/Print, Monotype Corsiva & Comic Sans

TASK #3: PICK TWO TYPEFACES

Visual communications

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

LOREM IPSUM

Moscow, 19.08.2015

Jannon<

Optima<

KAPTEREV

QUESTIONS?

SerifsAntiqua1

Where do theSERIFS

come from?

Phoenician writing, 16 century B.C.E.

Roman reed quill

Rustica

instagram.com/seblester/

SENATVS POPULVS

QUE ROMANVS

SERIFS CREATE NICE

LINES FOR THE EYE

Good for paper and stone

Trajan’s column, 1 century C.E.

What about theLOWER CASE?

Nn Ии

Rr Яя

AGES!◆ ◆

Roman stone inscription, 1 century C.E. - no spaces - capitals only

Italian handwriting circa 1420 - spaces - no capitals

German gothic script circa 1430

Johannes Guttenberg, 1439

Sweynheym & Pannartz, 1465

Carolingian handwriting, 9th century C.E.

oppelgängerDRoman capitals Carolingian lowercase

oppelgänger

oppelgängerDLuminari

Adobe Jenson

Doppelgängeroppelgänger

Nicholas Jenson, ~1470

Jenson’s book, 15th century C.E.

Jenson’s rotunda, 15th century C.E.

luntur imagines:& alia.

Adobe Jenson

luntur imagines:& alia.

Adobe Jenson

luntur imagines: & alia.Centaur

(кириллица есть в Venetian 301)

luntur imagines: & alia.

Centaur (кириллица есть в Venetian 301)

Where do the ITALICS

come from? ß

Italian handwriting circa 1420

Francesco Griffo, ~1501

GUCCIGUCCI

Old style

Transitional

Modern

WIKIPEDIA

The Free Encyclopedia

WIKIPEDIAThe Free Encyclopedia

Google

Google➻

AaHumanist

Fra Luca Pacioli

Leonardo da Vinci

Albrecht Durer

a aRenaissance Baroque

a a➻Humanist Transitional

John Baskerville, †1775

b bOld style Transitional

s s➻Old style Transitional

e e eOld style,

JensonTransitional, Baskerville

Carolingian handwriting

Baskerville

Centaur

Doppelgänger

Baskerville

Centaur

The first Roman type designed by Claude Garamond was used in an edition of the Erasmus book Paraphrasis in Elegantiarum Libros Laurentii Vallae published in 1530. The Roman design was based on an Aldus Manutius type, De Aetna, cut in 1455 by Francesco Griffo. After Claude Garamond died in 1561, most of his punches and matrices were acquired by Christophe Plantin from Antwerp, the Le Be type foundry and the Frankfurt foundry Egenolff-Berner.[4] The only complete set of the original Garamond dies and matrices is at the Plantin-Moretus Museum, in Antwerp, Belgium. The term Garamond is today mostly applied to Garamond's designs for the Latin alphabet. Garamond designed type for the Greek alphabet, but these, the glamorous and fluid Grecs du roi, are very different to his Latin designs: they mimic the elegant handwriting of scribes and contain a vast variety of ligatures and alternate glyphs to achieve this. As these are quite impractical for modern printing, several 'Garamond' releases such as Adobe's contain Greek designs that are either a compromise between Garamond's upright Latin designs and his slanted Greek ones or primarily inspired by his Latin designs.

Doppelgänger 13Century Schoolbook

Doppelgänger 13Times

Doppelgänger 13Georgia

ALBRECH DURER is dead but his ideas live

KK KOld style Transitional

➻ ➻

Modern

B O D O N I

Giambattista Bodoni

Giambattista Bodoni was born on 16 February 1740 at Saluzzo in Savoy (now the Piedmont region of Italy). He came from a printmaking background, his father and grandfather both being in that trade.[3] He worked for a time in Rome as an apprentice in the Roman Catholic Church's Propaganda Fide printing house. There, it was said, he impressed his superiors so much with his eagerness to learn, studiousness in mastery of ancient languages and types, and energy of effort, that he was allowed to place his own name on his first books, a Coptic Missal and a version of the Tibetan alphabet.[3]

Kiambattista Bodoni was born on 16 February 1740 at Saluzzo in Savoy (now the Piedmont region of Italy). He came from a printmaking background, his father and grandfather both being in that trade.[3] He worked for a time in Rome as an apprentice in the Roman Catholic Church's Propaganda Fide printing house. There, it was said, he impressed his superiors so much with his eagerness to learn, studiousness in mastery of ancient

Giambattista Bodoni was born on 16 February 1740 at Saluzzo in Savoy (now the Piedmont region of Italy). He came from a printmaking background, his father and grandfather both being in that trade.[3] He worked for a time in Rome as an apprentice in the Roman Catholic Church's Propaganda Fide printing house. There, it was said, he impressed his superiors so much with his eagerness to learn, studiousness in mastery of ancient languages and types, and energy of effort, that he was

1740-1811

Kønigin der Schriften

Giambattista Bodoni

K20 21

Giambattista Bodoni, †1813

aaBaskerville Regular Bodoni 72 Bold

CONTRASTDifference between the thickest and the thinnest part

aaHuge Small

Bodoni 72

Doppelgänger

Baskerville

Doppelgänger

Baskerville

Bodoni 72

EMPORIO ARMANI

BELVEDEREHotel

BELVEDEREHOTEL

Belvedere

BELVEDEREHotel4.

aOld style

aTransitional

➻ ➻aModern

Humanist

Modern

Transitional

APC Garamond

Times New

аaBASKERVILLE

Transitional

aDIDOT

Modern

JENSON

Old style

aCONSTANTIA

Triangular serifs

а aaBASKERVILLE

Transitional

Modern

JENSON

Old style

bCONSTANTIA

Triangular serifs

bbbBASKERVILLE

Transitional

Modern

JENSON

Old style

gCONSTANTIA

Triangular serifs

g ggBASKERVILLE

Transitional

Modern

JENSON

Old style

zConstantia

zzAdobe Jenson Bodoni 72

zConstantia

Doppelgänger 13Fedra Serif A

Doppelgänger13Constantia

Doppelgänger 13Сentro Serif

Sans-serifsGrotesque2

William Caslon IV

aaDidot News Gothic

gDidot

gFranklin Gothic

Grotesque

Gothic

Гротескный

Варварский

Yeah, that blows my mind too

PORT OF GOTHAMGOTHAM CITY

TECHNOLOGY

TECHNOLOGYАнтиква

Гротеск

TOYOTA

TOYOTAOld and neo-grotesque

Geometric sans-serifs

Humanist sans-serifs

TOYOTA

Doppelgänger 13

Doppelgänger 13News Gothic

Franklin Gothic

ALBRECHT DURER is dead but his ideas live

gBaskerville

gFranklin Gothic

➻ gFF Din

qBaskerville

qFranklin Gothic

➻ qFF Din

aBaskerville

aFranklin Gothic

➻ aFF Din

FF DIN Bold

Doppelgänger 13Franklin Gothic Medium

Doppelgänger 13

Doppelgänger 13Futura Medium

FF DIN Bold

Doppelgänger 13

instagram.com/seblester/

aFranklin Gothic

aFF Din

➻ aFutura

OldBank GothicRodchenko

OLDFutura

Doppelgänger 13

Doppelgänger 13Phosphate

Century Gothic Regular

Doppelgänger 13Avenir Medium

TOSHIBA

Eurostyle

Neo-grotesqueHelvetica

GrotesqueFranklin Gothic

a aFranklin Gothic Futura

➻ аHelvetica

GROTESQUE GEOMETRIC NEO-GROTESQUE

Doppelgänger 13

Doppelgänger 13Helvetica Medium

Futura Medium

Akzidenz-Grotesk

аAkzidenz-Grotesk Helvetica

Humanist Sans-SerifMeta Black

Eric Gill

bFutura

b bFranklin G.Jenson

bGill Sans

eFutura

e eFranklin G.Jenson

eGill Sans

45˚15˚

Erik Spiekermann

р рMeta MediumHelvetica Medium

k kMeta MediumHelvetica Medium

Doppelgänger 13

Doppelgänger 13Meta Medium 96

Helvetica Neue Medium 96

Myriad Semibold

aFRANKLIN G.

Grotesque

aHELVETICA

Neo-grotesque

Humanist

aFUTURA

Geometric

aFF DIN

Realist

aPRAGMATIC

Гротески и нео-гротески

aHUMANIST

Гуманистические

aGEOMETRIC

Геометрические

iPhone

Avenir Next

Myriad

P PGEOMETRIC

Avenir NextHUMANIST

Myriad

R RGEOMETRIC

Avenir NextHUMANIST

Myriad

R RNEO-GROTESQUE

ArialHUMANIST

Myriad

NEO-GROTESQUE

RR RGEOMETRIC

AvenirHUMANIST

Myriad

cc cNEO-GROTESQUE

ArialGEOMETRIC

AvenirHUMANIST

Myriad

1. Very open “e” and “c”

2. Narrower than neo-grotesque while maintaining the same height

3. “Unnecessary” irregularities

tt 4. Much more contrast

Humanist or not?

The rest of them3 A few more things

O OTIMES

SerifARIAL Sans-serif

OROCKWELL

OOPTIMA Sans-serif

KHigh contrast Low contrast

КKHigh contrast Low contrast

Antique

Grotesque

Serifs

Sans-serifs

High Contrast Low contrast

Antique Slab Serif

Semi Sans Grotesque

Serifs

Sans-serifs

Slab SerifБрусковый

Antique Slab Serif

Aa AaSlab

ASans serifSlab serifFranklin Gothic ⇢ Rockwell

My god,WHY?!

ADVERTISING◆ ◆

American Typewriter Bold

Marcellus WallaceRockwell Bold

Marcellus WallaceAmerican Typewriter Regular

Marcellus WallaceClarendon

Marcellus WallaceOfficina Serif

Clarendon

a aOfficina SerifAmerican

Typewriter

aMemphis

KSerif

Palatino ⇢ Optima

Sans serif

KKPalatino Optima

Semi Sans

Ленточный

Stressed Sans

ASTON MARTIN

VERSACEVERSACE

Serif Slab Serif

Semi Sans Sans Serif

Serifs

Sans-serifs

IN-BETWEEN

Baskerville

AgAgHUMANIST

Adobe Jenon

GEOMETRIC

IN-BETWEEN

Helvetica

AgAgHUMANIST

GEOMETRIC

Futura

IN-BETWEEN

Clarendon

AgAgHUMANIST

Officina Serif

GEOMETRIC

Rockwell

IN-BETWEEN

AgHUMANIST

OptimaGEOMETRIC

Peignot

Did I improve yourRESOLUTION?

RESOLUTION?ß

Did I improve your

Design is a major priority

because I know it’s what will set my business apart.

BOO-KEUN YOON CEO, Samsung Consumer Electronics Division

ALEXEI KAPTEREV

www.kapterev.com

alexei@kapterev.com

+7 495 764 1898

NOVisual communications

Lectures on typefaces

Design

Type specimen posters for 50 typefaces

Typefaces for poster

Typefaces and letter forms

Camelot Typefaces

Lectures on typefaces

type basics Mixing Typefaces - Marie Anna Leemarieannalee.com/arts079/lectures/13MixingTypefaces.pdf · 2016-02-13 · approachable geometric forms are based on Frank Lloyd Wright’s

British Standards Classification of Typefaces

Designstorm: Choosing the Right Typefaces

presentation of clasification of typefaces

Designing Multiple Master Typefaces - Adobe

eText Typefaces: Typefaces for High-Quality e …monotypecom.s3.amazonaws.com/documents/8781a174ba6af315/...All typefaces in the collection have been hand-hinted to display as clearly

Dumb Typefaces

DINAMO TYPEFACES

TYPOGRAPHY 1.01 INVESTIGATE TYPEFACES AND FONTS

KOMETA Typefaces

Brief 3 - Typefaces

three typefaces

word typefaces

typefaces , woolt fonts

Waven Typefaces