Prof.

Alessandro Ricardo

Os princpios do Design (Parte II)

Fontes True type, Post Script, Open Type

CONTRASTE
O objetivo do contraste evitar
elementos
meramente similares em uma pgina. Se
os
elementos (tipo, cor, tamanho, espessura
da linha
forma, espao etc.) no forem os
mesmos,
difencie-os completamente.
O contraste costuma

CONTRASTE

CONTRASTE

CONTRASTE

CONTRASTE

CONTRASTE

CONTRASTE

CONTRASTE

REPETIO

Repita os elementos visuais do design e

espalhe-os pelo material. Voc pode
repetir: a cor, a forma, a textura e as
relaes espaciais como a espessura,
os tamanhos, etc. Isso ajuda a criar uma
organizao e fortalece a unidade.

REPETIO
Fio duplo consistente
e todas as pginas
Fontes consistentes
em ttulos e subtitulos
e espaos
consistentes entres
eles
Fio nico ser repete
em todas as pginas
N de pgina no
mesmo lugar com
mesma fonte em
todas as pginas

REPETIO

REPETIO

REPETIO

REPETIO

ALINHAMENTO

Nada deve ser colocado arbitrariamente

em uma pgina. Cada elemento deve
ter uma ligao visual com outro
elemento da pgina. Isso cria uma
aparncia limpa, sofisticada e suave.

ALINHAMENTO

Parece que os elementos deste carto foram

simplesmente jogados em qualquer lugar e
colados. Nenhum dos elementos tem qualquer
conexo com qualquer outro elemento do
carto.

ALINHAMENTO

Movendo todos os elementos para a direita e

alinhando-os de maneira igual, as informaes
ficam mais organizadas.
Foi percebido que foi agrupado os elementos
interligados em proximidade entre si.)

ALINHAMENTO

Movendo todos os elementos para a direita e

alinhando-os de maneira igual, as informaes
ficam mais organizadas.
Foi percebido que foi agrupado os elementos
interligados em proximidade entre si.)

ALINHAMENTO

ALINHAMENTO

ALINHAMENTO

PROXIMIDADE

Itens relacionados entre si deveriam ser

agrupados. Quando vrios itens esto
prximos, tornam-se uma unidade visual, e
no vrias unidades individualizadas. Isso
ajuda a organizar as informaes e reduz a
desordem.

PROXIMIDADE

Por acasso seu olho parou cinco vezes? Lgico: H cinco itens
independentes neste pequeno carto.
Por onde voc comeou e leitura?
Por onde voc comeou da parte central, porque a frase do meio
a com maior evidncia (negrito).
O que voc leu e seguir (de esquerda para e direita)?
O que aconteceu quando voc alcanou o canto inferior direito;
Para onde seu olho se dirigiu?
Ele ficou vagando para certificar-se de no ter perdido alguma
informao espelhada pelos centos?

PROXIMIDADE

Agora que existem duas freses em negrito (bold), por onde

comear? Pelo canto superior esquerdo ou pelo rodo?
E aps ler esses dois itens, para onde seu olho vai?
Talvez voc fique indo e vindo entre as duas palavras em negrito,
em uma tentativa angustiada de "capturar" as outras palavras
colocadas nos cantos. fcil determinar o fim da leitura?
Seu amigo fez a leitura da mesma maneira que voc?

PROXIMIDADE

Ser que ainda existe alguma dvida sobre onde comear a ler o
carto? E sobre o final? Veja, observando este conceito multo
simples, este carto est organizado tanto lgica quanto
visualmente.
CONCLUSO: Quando vrios itens esto prximos entre si, eles se
tornam uma unidade visual e no vrias unidades separadas.
Assim como na vida, a proximidade implica em uma relao. Vrias
coisas acontecem quando elementos similares so agrupados em
uma unidade. A pgina fica mais organizada. possvel saber por
onde comear a leitura e onde termin-la. Alm disso, o espao em

PROXIMIDADE
Se torna uma tarefa
difcil encontrar as
informaes: os eventos,
onde eles acontecem, o
horrio etc;
Para agrupar os
elementos ser
nescessario realizar
algumas modificaes:
tamanho da fonte,
posicionamento de texto,
imagens e ilustraes;
A hierarquia e ordem de

PROXIMIDADE
Conceito de proximidade
no significa que tudo
precise estar prximo;
significa que os
elementos logicamente
conectados, com algum
tipo de ligao, tambm
deveriam estar
visualmente conectados.
Outros elementos
separados ou conjuntos
de elementos no
deveriam estar juntos. A
proximidade ou a falta

PROXIMIDADE

PROXIMIDADE

PROXIMIDADE (Anlise
aprofundada)

PROXIMIDADE
Segregao: Tem-se nos cantos
da imagem, a gua, que
separada do verde das matas,
no gerando uma fuso entre
os elementos da imagem,
ficando assim, fcil a
compreenso do anncio, que
tem no seu canto esquerdo
superior, um pergaminho com o
texto do anncio.
Unificao: A unificao dos
crculos cheios de plantaes
formou uma figura (que no caso
se parece com a cabea do
mickey).

PROXIMIDADE (Anlise
aprofundada)
Fechamento: o fechamento
a cabea do mickey.

Proximidade: Os 3 crculos
que formaram a cabea do
mickey.
Semelhana: As rvores se
assemelham entre si.
Pregnncia: A rea verde
lembra a amaznia, tornando
o anncio mais fcil de ser
interpretado, assim, quando
olhamos para a foto,
imaginamos ligeiramente

Fontes

TrueType
OpenType
PostScrip
t

Fontes
TrueType
As fontes TrueType podem ter seu fator de escala
definido para qualquer tamanho e so legveis em todos
os tamanhos.

OpenType
Fontes OpenType so baseadas em fontes do tipo
TrueType, mas incorporam uma extenso maior do
conjunto bsico de caracteres, como letras
maisculas pequenas, numerais em estilo antigo e
formas mais detalhadas, como glifos e ligaturas. As
fontes OpenType tambm podem ter seu fator de escala
definido para qualquer tamanho, so ntidas e legveis
em todos os tamanhos.

PostScript
As fontes PostScript so suaves, detalhadas e de alta

Fontes (Gestalt em Composio)

EMERGNCIA:
O rosto aparece por inteiro,
depois identificamos suas
partes. Ao contrrio de um
texto escrito, no se v
pedaos de uma imagem
que, aos poucos, compem
um todo.
REIFICAO:
O rosto construdo pelos
traos que se formam nos
espaos entre as linhas e
letras (repare a franja). Eis
um excelente exemplo da
importncia dos espaos em
branco (vazios) no desenho
de uma pgina. Eles do

Fontes (Gestalt em Composio)

PERCEPO MULTI-ESTVEL:
Em uma composio bemfeita, a viso no pra em
um lugar. Perceba como voc
olha para o rosto, o nome, o
fundo.
INVARINCIA: As letras so
reconhecidas e podem ser
lidas, pouco importa seu
tamanho, distoro ou
escala.
FECHAMENTO: Tendemos a
completar a figura, ligando
as reas similares para
fechar espaos prximos.
fcil ver as bochechas, a
lngua (escrita soul, genial)

Fontes (Gestalt em Composio)

SIMILARIDADE:
Agrupamos elementos
parecidos, instintivamente.
Perceba que, por mais que
voc tente evitar, o rosto se
destaca do fundo, mesmo
sendo da mesma cor.
PROXIMIDADE:
Elementos prximos so
considerados partes de um
mesmo grupo.
SIMETRIA:
Imagens simtricas so
vistas como parte de um
mesmo grupo, pouco
importa sua distncia. o

Fontes (Gestalt em Composio)

CONTINUIDADE:
Compreendemos qualquer
padro como contnuo,
mesmo que ele se
interrompa. o que nos
faz ver a pele de James
Brown como algo
contnuo, mesmo com
todos os buracos das
letras.
DESTINO COMUM:
Elementos em uma
mesma direo so vistos
como se estivessem em
movimento e formam uma
unidade, como se percebe

Bibliografia
Williams, Robin. Design para quem no Designer: noes bsicas de
planejamento visual. So Paulo. Callis, 1995.
https://livinonmovin.wordpress.com/page/2/
http://windows.microsoft.com/pt-br/windows/difference-truetype-pos
tscript-opentype-fonts#1TC=windows7
http://www.luli.com.br/2007/05/22/aprenda-gestalt-com-james-brown/