Top Banner
21/08/2013 1 Prof. José Wilker 1 Classificação e Anatomia dos Tipos 2 O que é Tipografia? 3 Tipografiaconceito 1 A tipografia (do grego typos — “forma” — e graphein — “escrita”) é a arte e o processo de criação na composição de um texto, física ou digitalmente. 4 Tipografiaconceito 2 O objetivo principal da tipografia é dar ordem estrutural e forma à comunicação impressa ou digital. A tipografia é a arte de selecionar o tipo de fonte ideal para os projetos
20

Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

Nov 24, 2018

Download

Documents

lebao
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

1

Prof. José Wilker

1

Classificação e Anatomia dos Tipos

2

O que é Tipografia?

3

Tipografiaconceito 1

A tipografia (do grego typos —

“forma” — e graphein — “escrita”) é

a arte e o processo de criação na

composição de um texto, física

ou digitalmente.

4

Tipografiaconceito 2

O objetivo principal da tipografia é

dar ordem estrutural e forma à

comunicação impressa ou digital. A tipografia é a arte de selecionar

o tipo de fonte ideal para os

projetos

Page 2: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

2

5

Tiposconceito 1

Tipo na área da tipografia, refere-

se aos tipos móveis das prensas

mecânicas para impressão de

textos. Podem ser feitos de dois

materiais: os tipos de metal (ou

tipos fundidos) e de madeira.

Tipo é , também, o termo referente

aos caracteres das letras. 6

Tiposconceito 1

Prof. José Wilker

7

Classificação e Anatomia dos Tipos

10

Classificação das Fontes

Com serifa

Sem Serifa (Sans-Serif)

Cursiva (script)

Modernas

Display

Page 3: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

3

11

Classificação das Fontes

Com serifa

Ex: Times new roman, Garamond, Bodoni, Didot e Caslon

12

Classificação das Fontes

Com serifa

13

Classificação das Fontes

Sem serifa

Ex: Helvética, Arial, Eurostile, Franklin, Optima, Univers, Kabel, Futura, Gill Sans,

Avantgarde, Optima, Fruitiger.

14

Classificação das Fontes

Cursiva (Script)

Ex: English111 Vivace BT, TypoUpringht BT e Amazone BT

Page 4: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

4

15

Classificação das Fontes

Modernas

Ex: East Side, Elif.

16

Classificação das Fontes

Display

Ex: East Side, Elif.

17

Classificação das Fontes

Legibilidade e Leiturabilidade

maria das carnes

maria das carnes

18

Classificação das Fontes

Legibilidade e Leiturabilidade

maria das carnes

maria das carnes

Page 5: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

5

19

Linha de Fonte

1. Linha da ascendente (ascender top line) ou linha de topo

2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

3. Altura-de-x (h-height ou middleline) ou linha mediana

4. Linha da Base (baseline)

5. Linha da descendente (descender line ou beardline) ou linha de

fundo 20

21 22

Page 6: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

6

23

Aplicação da Tipografia

Em marcas: Logotipos

24

Exemplos de Logotipos

25

Exemplos de Logotipos

26

Exemplos de Logotipos

Page 7: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

7

27

Exemplos de Logotipos

28

Exemplos de Logotipos

29

Exemplos de Logotipos

30

Exemplos de Logotipos

Page 8: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

8

31

Exemplos de Logotipos

32

Tipografia Urbana

33

Tipografia Urbana

34

Alfabeto da Pichação

Page 9: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

9

35

Tipografia Urbana

36

Tipografia Urbana

37

Tipografia Urbana

38

Tipografia Urbana

Page 10: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

10

39

Tipografia Urbana

40

Tipografia Urbana

41

Tipografia Urbana

42

Tipografia Urbana

Page 11: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

11

43

Tipografia Urbana

44

Tipografia Urbana

45

Desenhos com Tipos

46

Outros exemplos de Tipografia

Author: Luke Lucas

Page 12: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

12

47

Outros exemplos de Tipografia

48

Outros exemplos de Tipografia

Author: Alex Trochut

49

Outros exemplos de Tipografia

50

Outros exemplos de Tipografia

Page 13: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

13

51

Outros exemplos de Tipografia

52

Aplicação em projetos

53

Aplicação em projetos

54

Aplicação em projetos

Page 14: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

14

55

Aplicação em projetos

56

Aplicação em projetos

57

Aplicação em projetos

58

Aplicação em projetos

Page 15: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

15

59

Aplicação em projetos

60

Aplicação em projetos

61

Aplicação em projetos

62

Aplicação em projetos

Page 16: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

16

63

Aplicação em projetos

64

Aplicação em projetos

65

Aplicação em projetos

66

Aplicação em projetos

Page 17: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

17

67

Aplicação em projetos

68

Aplicação em projetos

69

Aplicação em projetos

70

Aplicação em projetos

Page 18: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

18

71

Aplicação em projetos

72

Aplicação em projetos

73

Aplicação em projetos

74

Aplicação em projetos

Page 19: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

19

75

Aplicação em projetos

76

Aplicação em projetos

77

Aplicação em projetos

78

Aplicação em projetos

Page 20: Anatomia dos Tipos - josewilker.com · Linha de Fonte 1. Linha da ascendente (ascender top line) ou linha de topo 2. Linha da caixa-alta (cap line ou cap height) ou linha de versalet

21/08/2013

20

79

Aplicação em projetos