Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

Tipografia

No description
by

Stephan Capistrano

on 17 June 2015

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of Tipografia

ipografia
Prof. Stephan Capistrano
T
Tipografia
O que é e pra que serve
Do grego,
typos
(forma, imagem) e
graphein
(escrita), é o processo artístico de criação de letras, palavras, frases e textos. Serve para a criação de uma formatação de texto que dá uma identidade ao conteúdo, deixando mais próximo do contexto geral, com maior organização e legibilidade.
O que é escrita
Sistema de comunicação por símbolos, que podem ser chamados de caracteres ou grafemas, que possuem uma representação sonora.
Tipos de escrita
Ideogramas:
Símbolos que representam uma palavra.
Silabários:
Símbolos que representam uma sílaba.
Abjads:
Primeiro tipo de alfabeto, só possui símbolos para consoantes.
Abugidas:
Simbolos para apenas consoantes, mas representa a vogal com simples alterações da forma da consoante.
Alfabética:
Letras que representam um fonema. Origem grecolatina.
Mista:
Mistura dos tipos anteriores.
Origem da escrita
Depois da criação da fala, houve uma necessidade de representar essa fala visualmente para que tivesse uma melhor forma de comunicação e registrar fatos.
Ideogramas
China:
Silabários
Maias:
Abjads
Hebraico:




Aramaico:
Abugidas
Etiópia:
Alfabética
Mista
Japão:
Egito:
A B C D E
F G H I J
K L M N O
P Q R S T
U V W X Y
Z
Quase todas as escritas hoje
Alfabeto latino
Do grego,
Alpha
+
Beta
. As duas primeiras letras do alfabeto grego. Nasceu do alfabeto etrusco.
Alfabeto etrusco
Letra
Representação mínima de um som ou de uma fonética.
Sílaba
Conjunto de letras que tenha uma emição de voz completa, podendo conter um ou mais fonema.
Palavra
Conjunto de sílabas que formam um sentido.

Pode ser separadas por sílabas:
monossílaba, dissílaba, trissílaba, polissílaba
Separadas por escrita:
Simples (guarda, chuva) ou composta (guarda-chuva)
Separas por função:
Preposições, conjunções, advérbios, artigos, pronomes, verbos, adjetivos e substantivos
Frase
Conjunto de palavras que tenha começo, meio, fim e um sentido. Pode ser separada por alguns tipos, sendo eles:

Frases exclamativas:
expressam surpresa ou atenção.
("Oh meu Deus!" , "NINTENDO SIXTY FOUR!!")

Frases imperativas:
expressam ordens, proibições ou conselhos.("Dirija devagar!" , "Calem a boca!")

Frases interrogativas:
expressam pergunta.
("MEU PAI? JARBAS?" , "Quem é que transa nessa porra?")

Frases declarativas:
Simplesmente informam algo.
("O meu pai vai me matar." , "Não sei, só sei que foi assim.")
Vogais
Consoantes
Som aberto, passagem de ar sem interrupção ou alteração.
A E I O U
Som interrompidou ou alterado pela língua, lábio ou dente.
B C D F G H J K L M N P Q R S T W X Y Z
Divisão silábica
Ditongo:
encontro de duas vogais na mesma sílaba (Ex: di-nh
ei
-ro)
Tritongo:
encontro de três vogais na mesma sílaba (Ex: Pa-ra-g
uai
)
Hiato:
encontro de duas vogais, mas em sílabas separadas (d
u
-
e
-lo)
Dígrafo:
encontro de duas letra com um único som.
-Junto: ch, lh, nh, gu e qu (Ex:
ch
u-va, ma-
lh
a,
qu
es-tão)
-Separado: rr, ss, sc, sç, xs, e xc (Ex: ca
r
-
r
o, na
s
-
c
er, e
x
-
c
e-ção)
Encontro consonantal:
encontro de duas consoantes. Devem ser saparados silabicamente, a não ser que a segunda consoante seja
L
ou
R
.
(Ex: A
s
-
t
u-to,
pr
e-go) (Excessão: a
b
-
r
up-to)
Se o encontro for na primeira sílaba, devem ficar juntos independentes das consoantes. (Ex:
gn
ós-ti-co,
mn
e-má-ti-co)
Texto
Conjunto de frases, orações e períodos que expressem uma ideia e sigam uma sequencia lógica e coerente. Podemos definir por dois tipos:

Texto literário:
poemas, contos, livros de romances, novelas, quadrinhos, roteiro de cinema e jogos.

Texto não-literário:
manuais de eletrodomésticos, bula de remédio, receita, jornais, artigos acadêmicos e científicos, livros de ciências, história, geografia, etc...
Maiúscula e Minúscula
Caixa alta ou caixa baixa
Pi Shêng, 1040 dc
Iniciou o uso da escrita de maneira tipográfica. Era um inventor chinês e precisava facilitar a maneira de escrita de muitos volumes. Criou sistema feito de argila para fazer impressões.
Johann Gutenberg, 1450 dc
Criou uma máquina feita de madeira e seu sistema de impressão de metal. Primeiro livro impresso foi uma bíblia, onde mostrou a eficiencia de sua máquina.
Glifos
São caracteres projetados para reprodução mecânica.
Família tipográfica
Conjunto de caracteres que, apesar das variações, possuem as mesmas características (peso, inclinação, corpo)
Fonte
Conjunto de de glifos que representam uma família tipográfica.
Anatomia dos tipos
Os tipos são compostos por um conjunto de elementos.
Ligaduras
É a ligação de dois ou mais caracteres.
O mais comuns são: fi, st, ae, oe, ff, ij.
Serifa
Serifas são os pequenos traços, ou prolongamentos, que existem no final das hastes dos glifos.
Corpo
É o tamanho dos glifos de uma família tipográfica que começa do ponto mais alto (ascendente) até o ponto mais baixo (descendente).
Ascendentes
Eixo
É a parte das letras que se estendem acima da altura de x.
Arial:


Verdana:


Times New Roman:
Descendentes
É a parte das letras que se estendem abaixo da altura de x.
Angulação do traço que define o eixo de algumas letras.
Mais comumente usado nas letras "b, c, e, g, o, p e q".
Eixo humanista:
condiz com o modelo de escrita manual
Eixo racionalista:
condiz com formas neoclássicas e românticas, por ser vertical.
Caixa baixa
Caixa alta
Versalete (small caps)
Algarismos Old style
Numerais alinhados pelo texto na altura de x, então, também possuem ascendente e descendente
Algarismos Lining
Algarismos Small Caps
Numerais com o mesmo tamanho de uma versal (caixa alta) e não possuem ascendentes e descendentes.
Numerais com o mesmo tamanho de uma versalete e não possuem ascendentes e descendentes.
Categorias de tipos
Hoje, existem milhões de famílias tipográficas e fontes diferentes. Todo dia são criadas fontes novas. Podemos categorizá-las da seguinte forma:
Estilo antigo
São baseados na escrita manual. Por simular uma escrita manual, possui transição de grosso pro fino. Os estilos antigos sempre possuem serifa e as serifas da letras em caixa baixa possuem uma angulação (a da caneta).
Moderno
Possuem Serifa, mas dessa vez são horizontais, e não inclinadas, e são muito finas. A estrutura é forte e possui uma transição do grosso-fino radical. A ênfase é perfeitamente vertical, dando uma estética fria e elegante.
-
-
-
-
-
-
Com Serifa
Possui pouca ou nenhuma transição do grosso-fino. Também são chamadas de fontes egípcias, por questão histórica de sua formação, e a maioria das fontes dessa categoria possuem um nome egípcio, como: Memphis, Cairo, Scarab.
Sem Serifa
Em francês e em inglês, significa
sans serif
. Quase não possui uma transição do grosso pro fino, fazendo que os tipos possuam pesos iguais.
Manuscrito
O que define essa categoria é o fato das fontes parecerem que foram escritas a mão, seja com caneta, lápis ou pincel. A grande dica desses tipos de fontes é: nunca usar para textos longos.
Estilizados
São sempre diferentes, engraçados, fáceis de usar, únicos e sempre tem uma fonte para cada sentimento ou ideia que você queira expressar... Mas pelo fato de serem tão diferenciados, seu uso é muito limitado.
Sub-categorias de tipos
Dentro das categorias, podemos ir mais a fundo e segregar mais os tipos de fontes.
-Humanista
-Transicionais
-Mecânicas
-Grotesca
-Gótica
-Históricas
Humanista
Simulam a caligrafia clássica feita a mão e fazem parte dos primeiros tipos de metal produzidos na Itália e França entre os séculos XV e XVI.
Transicionais
Possuem serifas mais finas e planas com acabamento agudo. Seu eixo vertical é levemente inclinado.
Mecânicas
Traço e serifas retangulares. São do século XIX e vieram para uso em propagandas.
Grotesca
Uma variação das letras mecânicas sem as serifa.
Oriundas do final do séc XIX.
Gótica
É um tipo com características dos manuscritos antigos. Procuram reproduzir a escrita dos monges copistas da idade média (anterior à invenção da tipografia). Normalmente são mais densas e com baixa legibilidade.
Históricas
São tipos inspirados nas escritas greco-romanas.
Também possuem muitas irregularidades e pouca legibilidade.
Contrastes de tipos
É possível usar características das fontes tipográficas para criar contrastes. Podemos fazer uso dos seguintes atributos:
Tamanho
O nome é óbvio! Para fazer uso dessa técnica,
não seja tímido
. Porém, não se pode contrastar um tipo de 14 pontos com um de 16 pontos, nem um tipo de 62 pontos com um de 72 pontos. O resultado vai ser conflitante. Se for contrastar com tamalho, faça o contraste ficar evidente.
Peso
É referente à espessura do traço. A maioria das famílias tipográficas são desenhadas com vários pesos comuns, como: Regular, Bold, Semibold, Extrabold, Light. Ao usar o peso para contrastar, exagere! Ex: não tente constratar um Bold com um Semibold.
-Tamanho
-Peso
-Estrutura
-Forma
-Direção
-Cor
Estrutura
É referente ao contraste de fontes e famílias tipográficas. Em outras palavras, é usar duas ou mais fontes para fazer um contraste. Dicas importantes: Utilize duas famílias com estruturas diferentes. Nunca use duas fontes da mesma categoria em uma página.
Forma
A forma refere-se ao formato de uma letra. Apesar de possuir a mesma estrutura, as letras podem ter formas diferentes. Por exemplo a letra "G" (caixa alta) é diferente da letra "g" (caixa baixa). Porem, a letra "X" tem a forma muito parecida com "x".
Direção
É nada mais que a inclinação das letras. Parece ser simples, mas seu uso é extremamente complexo. Use somente quando necessário, quando for preciso.
Cor
É simplesmente fazer o uso das cores para formar um contraste. Cores complementares formam melhores contrastes. Veja mais no Prezi "Teoria da cor, prof. Stephan Capistrano".
Dica para uso de contrastes: Combine-os!
Kerning
Espaçamento horizontal de pares de letras. O kerning é definido no momento que as fontes são criadas, por isso, algumas vezes pode vir errado, fazendo o designer recorrer a processos alternativos para corrigir.
Tracking
É o espaçamento entre as letras, mas como um todo. Espaçamento entre palavras, frases, textos.
Leading
É a distancia entre o espaço de duas linhas.
Espaçamento
É a distancia dos espaços entre as letras. Para melhorar o visual, algumas letras precisam ultrapassar seu bloco, assim, tendo um melhor encaixe no conjunto. Temos três tipos espaçamentos, são eles:
-Kerning
-Tracking
-Leading
Alinhamento
Espaçamento do texto em relação a todo o conteúdo e à página. Como alinhamento, temos:
-À esquerda
-À direita
-Centralizado
-Justificado
-Assimétrico
-Capitular
-Indentação
-Recuo
À esquerda
Segue o fluxo ocidental de escrita. A margem da direita é irregular.
À direita
Possui a margem da esquerda irregular, dificultando a leitura (caso você seja acostumado com a leitura ocidental).
Centralizado
O eixo é central, então, ambas as margens são irregulares.
Justificado
Margens regulares em ambos os lados. Muito usado em livros e jornais.
Assimétrico
Composição sem padrão. É um alinhamento totalmente livre.
Capitular
É a ênfase que se dá na primeira letra do primeiro parágrafo de um capítulo.
Indentação
É o espaço que se tem na primeira linha de um parágrafo, da maneira que a gente faz em redações.
Recuo
É exatamente o inverso da indentação.
Legibilidade
Capacidade que um texto tem de poder ser lido.
Leiturabilidade
Capacidade que um texto tem de poder ser lido com facilidade.
Projetos para ver ou para ler?
Dependendo do objetivo do seu projeto, você deve saber quais fontes e técnicas devem ser usada. Se for um projeto para ver, você pode usar fontes apenas legíveis. Se for um projeto para ler, use fontes leituráveis. Basicamente, para títulos, nomes, frases curtas, pode-se usar bem uma fonte legível. Para textos longos, use uma fonte leiturável.
Hierarquia de conteúdo
É a maneira que você organiza os conteúdos de seu projeto. Geralmente, usa-se (para projetos simples) uma fonte de título, uma de subtítulo e uma de conteúdo.
Dê espaço ao conteúdo
Saiba respeitar os limites, para que o texto não fique cansativo.
Conclusão
Tipografia é uma área extremamente grande, por isso, nossos estudos não devem parar por aqui. Este material é simplesmente introdutório, onde apresenta os principais conceitos de tipografia. O conteúdo foi sintetizado de forma que ficasse mais simples e de fácil compreenção.
Na prática...
Seb Lester
Como ser fodão assim?
Título
Subtítulo
Conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo
Subtítulo2
Conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo
Conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo
Subtítulo3
Título
Subtítulo
Conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo.
Conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo.
Subtítulo
Conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo conteúdo.
Como qualquer outra arte, essa exige muuuuito treino e prática, além de analisar obras e tentar conciliar a teoria com a prática.
Digital:
Manual:
Full transcript