1 of 49

Type in Design

2 of 49

Design

four things that optimize the experience of a reader

3 of 49

  1. Layout

Artboards, grids, boxes, rule of thirds, gestalt...

4 of 49

5 of 49

2. Color

Warm, cool, scheme, primary, accent, hue, saturation...

6 of 49

7 of 49

3. Image

Photo, illustration, patterns, textures, icons, symbols...

8 of 49

9 of 49

4. Type

Serif, sans serif, bold, italics, all-caps...

10 of 49

11 of 49

It does this in two ways

12 of 49

Rhythm

adds a sense of order to the content,

making it easier to absorb

13 of 49

Before

14 of 49

After

15 of 49

Contrast

adds the element of surprise to the content,

keeping the reader entertained

16 of 49

Before

17 of 49

After

18 of 49

Each of the four design components accomplishes these in unique ways.

How does type do it?

19 of 49

Typographic Rhythm

20 of 49

Margins, columns and gutters

The spaces between edges

21 of 49

22 of 49

Measure

The number of letters per line

23 of 49

24 of 49

Alignment

Left, right, justified...

25 of 49

26 of 49

Baseline Grid

Invisible rhythm

27 of 49

28 of 49

Spacing

Leading, tracking, kerning

29 of 49

30 of 49

Tracking

Space between letters

31 of 49

32 of 49

33 of 49

Kerning

Overlapping the boxes

34 of 49

35 of 49

36 of 49

Classification

Serif, Sans-serif, ...

37 of 49

Serif

Sans Serif

Slab Serif

Script

Monospacei

Handwritten

38 of 49

Typeface anatomy

Cap height, x-height, baseline

39 of 49

descender

ascender

Two-story a

Serif

40 of 49

Ligatures

Lower case f is a bad fit

41 of 49

fling, fix, difficult, effect Z

fling, fix, difficult, effect

fling, fix, diiffcult, effect Z

42 of 49

Typographic Contrast

43 of 49

Weight and style

Bold, light, italic...just not oblique

44 of 49

Weight and style

45 of 49

Scale

Think about the voice saying the words

46 of 49

Another

Day

Another

Dollar

47 of 49

Capitalization

48 of 49

lower case

Sentence case

Capitalize Case

UPPERCASE

49 of 49

establish rhythm, �adjust contrast.