Desenhando letras
para logos, lettering
& fontes.
Objetivos do Workshop
Aprender ou relembrar alguns fundamentos
de desenho de tipo.
Melhorar a análise de fontes/lettering ...
Tem esperança! Minha primeira tentativa de type 😂
Conteúdo
1	 Aquecimento
2	 Fundamentos
3	 Planejamento
4	 Desenhando letras digitais
5	 Recursos
1	 Aquecimento
2	 Fundamentos
3	 Planejamento
4	 Desenhando letras digitais
5	 Recursos
Monograma (15-20 minutos).
2 ou 3 iniciais do seu nome
a lapis ou qualquer outro
instrumento de escrita que
combine com vo...
1	 Aquecimento
2	 Fundamentos
3	 Planejamento
4	 Desenhando letras digitais
5	 Recursos
Fundamentos
2
Formas com a mesma altura absoluta…
Fundamentos
2
…precisam ser ajustadas para parecerem ter
a mesma altura.
HOAHOAHOA
Fundamentos
2
O mesmo acontece com as letras.
Fundamentos
2
Centro geométrico a vs. centro visual b.
A B
A B
Hastes horizontais parecem maiores
que verticais. Qual das 2 parece melhor?
A B
B está compensada visualmente.
A B
Qual dos “io” está melhor balanceado
Aumente a espessura das curvas para
ficarem visualmente iguais às retas.
A minúsculo – construção geométrica
e construção visual.
Todos os detalhes e ajustes que melhoram
a legibilidade da letra.
Fundamentos
2
Letras mais pesadas parecem menores.
Para compensar, aumente a altura de x.
finesse
finesse
Fundamentos
2
Quanto mais pesada a letra, menores ficam
os olhos, por isso…
finesse
Fundamentos
2
… o espaçamento também deve ser mais
justo. Sempre uma questão de equilíbrio.
finesse
Fundamentos
2
Forma?
Fundamentos
2
A contra-forma é tão importante quanto a
forma. Vale para logos, lettering e fontes.
Fundamentos
2
Curva geométrica vs. ótica
Fundamentos
2
Sem medo do Beziér!
1	 Aquecimento
2	 Fundamentos
3	 Planejamento
4	 Desenhando letras digitais
5	 Recursos
Decisões iniciais
Aplicação Final/Limitações
Personalidade/Estilo
Planejamento familiar: pesos, estilos.
Proporções
Legibi...
Aplicação final
Wayfinding Sans: Ralf HerrmannBell Centennial: Mathew Carter
Verdana: Mathew Carter Akceler Alt: Andrej Di...
Personalidade + Planejamento
Primot
Guanabara Sans ‘13
Fonte única, display. Lettering
Super família, múltiplos pesos e es...
H VH V
Contraste e estilo
Planejamento
3
Ax Ax Ax
Altura de x
Guanabara Sans | Mrs. Eaves | Maple Black
Planejamento
3
AxPeles sernatur ad
endis endae omnisti
onemquatur?
Atiatiis quodit, si sum re
nus evel et quo temporeri
dolessinvel molut...
A proporção da fonte acima não é
equilibrada como a da Myriad. Estude
as fontes clássicas para treinar o olho.
Hamburgefon...
Calligraphic origin
Garamond
Didot
Scala Sans
Helvetica
ea
ea ea
ea
Planejamento
2
Niels Shoe Meulman Tony DiSpigna
Planejamento
3
Cool letterings, different calligraphic origins.
milliliter milliliter
milliliter milliliter
Guanabara Sans
Helvetica
Planejamento
2
Legibilidade (ou não) Erik Spiekermann
Lindo.
Mas por onde começar?
1	 Aquecimento
2	 Fundamentos
3	 Planejamento
4	 Desenhando letras digitais
Dicas
Método: Módulos
Método: Scan
Método: Esq...
Rabiscar e tomar decisões cedo.
Desenhandoletrasdigitais
2
Desenhandoletrasdigitais
4
Desenhandoletrasdigitais
4
Hamburgefons
Adhesiontext
Primeira palavra
Vão dar a personalidade e característica
dos glifos restantes da fonte.
Desenha...
Pontos nos extremos
Desenhandoletrasdigitais
4
Desenhandoletrasdigitais
4
Pontos nos extremos
HO no
Comece por uma letra reta e uma curva
Muitas letras são planejadas a partir desse grupo básico.
4
Desenhandoletrasdi...
HOHOHO
hohoho
Começar o espacejamento
Para decidir o espaçejamento entre as letras, comece pelas
duplas HO maiúscula e min...
HDFEL
OQCD
MN WYX ZS
Grupos de letra (construção)
4
Desenhandoletrasdigitais
oec pdbq
fjg nmu il
kzs vwyz
Grupos de letra (construção)
4
Desenhandoletrasdigitais
ABC0123
Numerais são geralmente um pouco mais
baixos que a altura da maiúscula.
4
Desenhandoletrasdigitais
Minion Pro
01234567890
01234567890
01234567890
Numerais
4
Desenhandoletrasdigitais
Ctrl C |Ctrl V?
nn»nu
4
Desenhandoletrasdigitais
Quase isso…
nn»nu
Desenhandoletrasdigitais
4
A maravilha da interpolação (Interpolêichon)
AAALight BlackBook
Desenhandoletrasdigitais
4
Qual altura da haste é melhor?
Desenhandoletrasdigitais
4
MÓDULOS
Desenhandoletrasdigitais
4
Desenhandoletrasdigitais
4
Módulos
Wim Crouwel
SCAN
Desenhandoletrasdigitais
4
Desenhandoletrasdigitais
4
Scan
Desenhandoletrasdigitais
4
Vetorizando
Desenhandoletrasdigitais
4
Refinando a vetorização
Clube de roupas infantis
babycub
Desenhandoletrasdigitais
4
Resultado Final
ESQUELETO
Desenhandoletrasdigitais
4
Width tool (Illustrator – Shift + W)
Desenhandoletrasdigitais
4
Width Tool
Desenhandoletrasdigitais
4
Width Tool
Desenhandoletrasdigitais
4
Width Tool
Desenhandoletrasdigitais
4
Esqueleto – início de um S no illustrator.
Muitos refinamentos necessários depois
desse primeir...
DIRETO…
BOA SORTE 😈
MESTRES
Desenhandoletrasdigitais
4
Hoefler & Frere Jones
House Industries
Adrian Frutiger
Doyald Young
Herb Lubalin
Alex Trochut
Louise Fili
1	 Aquecimento
2	 Fundamentos
3	 Planejamento
4	 Desenhando letras digitais
5	 Recursos
Recursos
5
Para aprender mais
Briem.net: http://briem.net
Hoefler & Frere-Jones: http://www.typography.com/
Letritas: http...
Recursos
5
Livros
Logo, Font & Lettering Bible. http://goo.gl/4djGZt
The stroke, Theory of Writing. http://goo.gl/Xr9rR
Co...
OBRIGADO!
	email	 rodrigo@plau.co
	link	 plau.co
	behance	 behance.net/plau
	twitter	 PlauStudio
	facebook	 facebook.com/p...
Próximos SlideShares
Carregando em…5
×

Plau – Desenhando letras para logos, lettering e fontes.

13.500 visualizações

Publicada em

Slides usados no 1º Workshop de tipografia da Plau.
Uma pincelada sobre os fundamentos e dicas de desenho de letras para logos, lettering e fontes.

Publicada em: Design
4 comentários
40 gostaram
Estatísticas
Notas
Sem downloads
Visualizações
Visualizações totais
13.500
No SlideShare
0
A partir de incorporações
0
Número de incorporações
8
Ações
Compartilhamentos
0
Downloads
323
Comentários
4
Gostaram
40
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Plau – Desenhando letras para logos, lettering e fontes.

  1. 1. Desenhando letras para logos, lettering & fontes.
  2. 2. Objetivos do Workshop Aprender ou relembrar alguns fundamentos de desenho de tipo. Melhorar a análise de fontes/lettering e suas proporções. Aprender melhores práticas e dicas salvadoras na hora de desenhar letras.
  3. 3. Tem esperança! Minha primeira tentativa de type 😂
  4. 4. Conteúdo 1 Aquecimento 2 Fundamentos 3 Planejamento 4 Desenhando letras digitais 5 Recursos
  5. 5. 1 Aquecimento 2 Fundamentos 3 Planejamento 4 Desenhando letras digitais 5 Recursos
  6. 6. Monograma (15-20 minutos). 2 ou 3 iniciais do seu nome a lapis ou qualquer outro instrumento de escrita que combine com você. Aquecimento 1
  7. 7. 1 Aquecimento 2 Fundamentos 3 Planejamento 4 Desenhando letras digitais 5 Recursos
  8. 8. Fundamentos 2 Formas com a mesma altura absoluta…
  9. 9. Fundamentos 2 …precisam ser ajustadas para parecerem ter a mesma altura.
  10. 10. HOAHOAHOA Fundamentos 2 O mesmo acontece com as letras.
  11. 11. Fundamentos 2 Centro geométrico a vs. centro visual b. A B
  12. 12. A B Hastes horizontais parecem maiores que verticais. Qual das 2 parece melhor?
  13. 13. A B B está compensada visualmente.
  14. 14. A B Qual dos “io” está melhor balanceado
  15. 15. Aumente a espessura das curvas para ficarem visualmente iguais às retas.
  16. 16. A minúsculo – construção geométrica e construção visual.
  17. 17. Todos os detalhes e ajustes que melhoram a legibilidade da letra.
  18. 18. Fundamentos 2 Letras mais pesadas parecem menores. Para compensar, aumente a altura de x.
  19. 19. finesse finesse Fundamentos 2 Quanto mais pesada a letra, menores ficam os olhos, por isso…
  20. 20. finesse Fundamentos 2 … o espaçamento também deve ser mais justo. Sempre uma questão de equilíbrio. finesse
  21. 21. Fundamentos 2 Forma?
  22. 22. Fundamentos 2 A contra-forma é tão importante quanto a forma. Vale para logos, lettering e fontes.
  23. 23. Fundamentos 2 Curva geométrica vs. ótica
  24. 24. Fundamentos 2 Sem medo do Beziér!
  25. 25. 1 Aquecimento 2 Fundamentos 3 Planejamento 4 Desenhando letras digitais 5 Recursos
  26. 26. Decisões iniciais Aplicação Final/Limitações Personalidade/Estilo Planejamento familiar: pesos, estilos. Proporções Legibilidade Planejamento 3
  27. 27. Aplicação final Wayfinding Sans: Ralf HerrmannBell Centennial: Mathew Carter Verdana: Mathew Carter Akceler Alt: Andrej Dieneš Planejamento 3
  28. 28. Personalidade + Planejamento Primot Guanabara Sans ‘13 Fonte única, display. Lettering Super família, múltiplos pesos e estilos Planejamento 3
  29. 29. H VH V Contraste e estilo Planejamento 3
  30. 30. Ax Ax Ax Altura de x Guanabara Sans | Mrs. Eaves | Maple Black Planejamento 3
  31. 31. AxPeles sernatur ad endis endae omnisti onemquatur? Atiatiis quodit, si sum re nus evel et quo temporeri dolessinvel molut exeraTur aut minus ulpa alitat. Voluptae senis ut laborem perumquibus. AxPeles sernatur ad endis endae omnisti onemquatur? Atiatiis quodit, si sum re nus evel et quo temporeri dolessinvel molut exeraTur aut minus ulpa alitat. Voluptae senis ut laborem perumquibus.  AxPeles sernatur ad endis endae omnisti onemquatur? Atiatiis quodit, si sum re nus evel et quo temporeri dolessinvel molut exeraTur aut minus ulpa alitat. Voluptae senis ut laborem perumquibus. Altura de x vai afetar quantas palavras cabem por linha. Fontes condensadas e/ou expandidas tb. Guanabara Sans | Mrs. Eaves | Maple Black | 30/36pt Planejamento 3
  32. 32. A proporção da fonte acima não é equilibrada como a da Myriad. Estude as fontes clássicas para treinar o olho. Hamburgefons Hamburgefons Myriad: Robert Slimbach/Carol Twombly Planejamento 3
  33. 33. Calligraphic origin Garamond Didot Scala Sans Helvetica ea ea ea ea Planejamento 2
  34. 34. Niels Shoe Meulman Tony DiSpigna Planejamento 3 Cool letterings, different calligraphic origins.
  35. 35. milliliter milliliter milliliter milliliter Guanabara Sans Helvetica Planejamento 2 Legibilidade (ou não) Erik Spiekermann
  36. 36. Lindo.
  37. 37. Mas por onde começar?
  38. 38. 1 Aquecimento 2 Fundamentos 3 Planejamento 4 Desenhando letras digitais Dicas Método: Módulos Método: Scan Método: Esqueleto Método: Direto Mestres 5 Recursos
  39. 39. Rabiscar e tomar decisões cedo. Desenhandoletrasdigitais 2
  40. 40. Desenhandoletrasdigitais 4
  41. 41. Desenhandoletrasdigitais 4
  42. 42. Hamburgefons Adhesiontext Primeira palavra Vão dar a personalidade e característica dos glifos restantes da fonte. Desenhandoletrasdigitais 4
  43. 43. Pontos nos extremos Desenhandoletrasdigitais 4
  44. 44. Desenhandoletrasdigitais 4 Pontos nos extremos
  45. 45. HO no Comece por uma letra reta e uma curva Muitas letras são planejadas a partir desse grupo básico. 4 Desenhandoletrasdigitais
  46. 46. HOHOHO hohoho Começar o espacejamento Para decidir o espaçejamento entre as letras, comece pelas duplas HO maiúscula e minúscula. Assim você já tem muitos espaçamentos resolvidos (lados circulares e retos). 4 Desenhandoletrasdigitais
  47. 47. HDFEL OQCD MN WYX ZS Grupos de letra (construção) 4 Desenhandoletrasdigitais
  48. 48. oec pdbq fjg nmu il kzs vwyz Grupos de letra (construção) 4 Desenhandoletrasdigitais
  49. 49. ABC0123 Numerais são geralmente um pouco mais baixos que a altura da maiúscula. 4 Desenhandoletrasdigitais Minion Pro
  50. 50. 01234567890 01234567890 01234567890 Numerais 4 Desenhandoletrasdigitais
  51. 51. Ctrl C |Ctrl V? nn»nu 4 Desenhandoletrasdigitais
  52. 52. Quase isso… nn»nu Desenhandoletrasdigitais 4
  53. 53. A maravilha da interpolação (Interpolêichon) AAALight BlackBook Desenhandoletrasdigitais 4
  54. 54. Qual altura da haste é melhor? Desenhandoletrasdigitais 4
  55. 55. MÓDULOS Desenhandoletrasdigitais 4
  56. 56. Desenhandoletrasdigitais 4 Módulos Wim Crouwel
  57. 57. SCAN Desenhandoletrasdigitais 4
  58. 58. Desenhandoletrasdigitais 4 Scan
  59. 59. Desenhandoletrasdigitais 4 Vetorizando
  60. 60. Desenhandoletrasdigitais 4 Refinando a vetorização
  61. 61. Clube de roupas infantis babycub Desenhandoletrasdigitais 4 Resultado Final
  62. 62. ESQUELETO
  63. 63. Desenhandoletrasdigitais 4 Width tool (Illustrator – Shift + W)
  64. 64. Desenhandoletrasdigitais 4 Width Tool
  65. 65. Desenhandoletrasdigitais 4 Width Tool
  66. 66. Desenhandoletrasdigitais 4 Width Tool
  67. 67. Desenhandoletrasdigitais 4 Esqueleto – início de um S no illustrator. Muitos refinamentos necessários depois desse primeiro passo, mas é um começo!
  68. 68. DIRETO… BOA SORTE 😈
  69. 69. MESTRES Desenhandoletrasdigitais 4
  70. 70. Hoefler & Frere Jones
  71. 71. House Industries
  72. 72. Adrian Frutiger
  73. 73. Doyald Young
  74. 74. Herb Lubalin
  75. 75. Alex Trochut
  76. 76. Louise Fili
  77. 77. 1 Aquecimento 2 Fundamentos 3 Planejamento 4 Desenhando letras digitais 5 Recursos
  78. 78. Recursos 5 Para aprender mais Briem.net: http://briem.net Hoefler & Frere-Jones: http://www.typography.com/ Letritas: http://letritas.blogspot.com Type Drawers: http://typedrawers.com Typophile: http://typophile.com Typotheque: https://www.typotheque.com/articles Unos Tipos Duros: http://www.unostiposduros.com/ Type Workshop (Underware): http://www.typeworkshop.com/
  79. 79. Recursos 5 Livros Logo, Font & Lettering Bible. http://goo.gl/4djGZt The stroke, Theory of Writing. http://goo.gl/Xr9rR Counterpunch. http://goo.gl/hcQVDo Letterletter. http://goo.gl/PcGyjF Designing Type. http://goo.gl/HZ7TL Scripts: Elegant Lettering from Design’s Golden Age. http://goo.gl/qCqyb Elementos do estilo tipográfico. http://goo.gl/sAAxZ Stop Stealing Sheep. http://goo.gl/8YKUK1 Metro Letters. http://goo.gl/5CWs5e
  80. 80. OBRIGADO! email rodrigo@plau.co link plau.co behance behance.net/plau twitter PlauStudio facebook facebook.com/plaudesign Agradecimentos: Vanessa Padua, Cristiano Junqueira, Betina Cupello e todo mundo da Saravah, Cida, Eddy e Martha, Gu, Nina, Família Padua, Mark Mullin, Eduardo Varela, Lucas Azevedo, Daniel Campos, Matheus Fragoso, todos os designers e programadores que passaram pela Niramekko e Plau e mais um monte de gente que me inspirou e ensinou tanta coisa! Fontes: Guanabara Sans, SS Social, Futura, Myriad, Minion Pro, Motiva Sans, Bordonia, Primot.

×