SlideShare uma empresa Scribd logo
1 de 23
Baixar para ler offline
PLANEJAMENTO VISUAL
Os quatros princípios básicos
Os quatro princípios básicos
  Proximidade
  Repetição
  Alinhamento
  Contraste
Proximidade
  Itens relacionados entre si devem ser agrupados
  Quando vários itens estão próximos tornam-se uma
unidade visual, e não várias unidades
individualizadas.
  Ajuda a organizar as informações e reduz a
desordem
Proximidade
  Fique atento!
  Na leitura, veja para onde seus olhos se dirigem.
  Qual o caminho que eles seguem?
  Onde termina a leitura?
  Após a leitura, para onde os olhos vão?
  Você deve seguir uma progressão lógica durante a
leitura da página, partindo de um início bem-
definido para um final bem-definido
Proximidade
  Propósito básico é organizar
  O simples agrupamento de elementos relacionados
em proximidade cria uma organização
  Informação organizada = leitura fácil e
memorização
Proximidade
  Veja este cartão abaixo:
Proximidade
  E agora:
Proximidade
  Como conseguir isto:
 Veja quantos elementos visuais tem sua página
 Veja quais podem ser agrupados num mesmo elemento,
para que se tornem uma unidade visual
Proximidade
  O que evitar:
 Evite muitos elementos separados em uma página
 Não coloque os itens somente nos cantos ou no meio da
página
 Evite criar dúvida em relação aos elementos, ou seja,
cada subtítulo, legenda, imagem, etc. devem estar junto
a seu respectivo par
 Não relacione elementos que não devem ser
agrupados.
Alinhamento
  Não deve ser colocado arbitrariamente numa
página
  Cada elemento deve ter uma ligação visual com
outro elemento da página
  Cria uma aparência limpa, sofisticada e suave
Alinhamento
  Veja o alinhamento dos cartões:
Alinhamento
  A unidade é um conceito muito importante
  Para que todos os elementos da página tenham uma
estética unificada, conectada e inter-relacionada, é
preciso que haja “amarras” visuais entre os elementos
separados
  Mesmo que eles não sejam próximos, eles podem estar
unificados simplesmente devido ao seu posicionamento
  Não importa se a aparência inicial da página seja
caótica e selvagem: você sempre encontrará os
alinhamentos correspondentes
Alinhamento
  Esteja consciente do posicionamento dos elementos
da página
  Encontre sempre algo a mais na página para fazer
o alinhamento, mesmo que os dois objetos estejam
fisicamente distantes
Alinhamento
  O que evitar:
 Evite usar mais de um alinhamento de texto por
página, ou seja, não centralize um texto e alinhe outro
à direita
 Evite o alinhamento centralizado, a não ser que você
tenha o objetivo de criar uma apresentação formal,
pacata
 Escolha o alinhamento centralizado consciente e não
por automação
Repetição
  Algum aspecto do design deve repetir-se no
material inteiro
  Repita os elementos visuais do design e espalhe-os
pelo material
  Você pode repetir a cor, a forma, a textura e as
relações espaciais como a espessura, os tamanhos,
etc.
  Ajuda a criar uma organização e fortalece a
unidade
Repetição
  Repetição dos elementos visuais unifica e fortalece
o material
  É essencial em documentos de muitas páginas
  É considerada, neste último caso, consistência
Repetição
  Considere a repetição como consistência
  O elemento repetitivo pode ser uma fonte em negrito,
um fio (linha) para destacar uma seção, algum sinal de
tópico, um elemento gráfico
  Pode ser qualquer item que o leitor reconheça
visualmente
  Repetir é como dar ênfase às suas roupas
  Por exemplo, se uma mulher usar um vestido preto de
noite maravilhoso com um chapéu, ela poderá enfatizar
sua roupa usando sapatos e bolsa de outra cor, para
realçar a composição
Repetição
  O que evitar:
 Repetir elemento em demasia, para que ele não se
torne excessivo e cansativo
 Pense na roupa da mulher de preto, se ela usar
chapéu, brincos, sapatos, batom vermelho e ainda,
acrescentar um casaco vermelho, a repetição criaria um
efeito espalhafatoso e confuso
Contraste
  O objetivo do contraste é evitar elementos
meramente similares em uma página
  Se os elementos (tipo, cor, tamanho, espessura da
linha, forma, espaço, etc.) não forem os mesmos,
diferencie-os completamente
  Costuma ser a mais importante atração visual de
uma página
Contraste
  O contraste de uma página chama a atenção
  Se você colocar dois elementos diferentes em uma
página (como duas fontes ou duas espessuras de
fio), eles não devem ser similares
  Para que o contraste cumpra seu papel, os dois
elementos devem ser diferentes
  Utilizar o contraste é como retocar a parede: não
se pode combinar mais ou menos a cor; ou você
encontra a cor exata ou precisará pintar a parede
inteira
Contraste
  Aplique contraste em suas opções de tipologia, nas
espessuras das linhas, nas cores, nas formas, nos
tamanhos, nos espaços, etc.
  É fácil descobrir maneiras de contrastar os itens e,
provavelmente, esta é a maneira mais divertida e
satisfatória de criar interesse visual
  O importante é criar elementos marcantes
Contraste
  Um exemplo:
Contraste
  O que evitar:
 Se você criar contrastes, faça-os de maneira forte
 Evite contrastar uma linha um pouco espessa com uma
linha um pouco mais espessa
 Evite contrastar um texto em marrom com títulos em
preto, por exemplo.
 Evite usar duas ou mais fontes similares
 Se os itens forem exatamente iguais, diferencie-os

Mais conteúdo relacionado

Semelhante a Planejamento visual os 4 principios basicos

Semelhante a Planejamento visual os 4 principios basicos (11)

Diagramacao ua
Diagramacao uaDiagramacao ua
Diagramacao ua
 
aula-6_principios_design.pdf
aula-6_principios_design.pdfaula-6_principios_design.pdf
aula-6_principios_design.pdf
 
Design para quem nao eh designer
Design para quem nao eh designerDesign para quem nao eh designer
Design para quem nao eh designer
 
design-para-quem-nao-e-design.pdf
design-para-quem-nao-e-design.pdfdesign-para-quem-nao-e-design.pdf
design-para-quem-nao-e-design.pdf
 
O design equilibrado7
O design equilibrado7O design equilibrado7
O design equilibrado7
 
Design para quem_nao_e_designer
Design para quem_nao_e_designerDesign para quem_nao_e_designer
Design para quem_nao_e_designer
 
EXPOTEC IFRN - Noções básicas de planejamento visual
EXPOTEC IFRN - Noções básicas de planejamento visualEXPOTEC IFRN - Noções básicas de planejamento visual
EXPOTEC IFRN - Noções básicas de planejamento visual
 
Design - SLIDES
Design - SLIDESDesign - SLIDES
Design - SLIDES
 
Composição gráfica
Composição gráficaComposição gráfica
Composição gráfica
 
Apresentação principios do design share
Apresentação principios do design shareApresentação principios do design share
Apresentação principios do design share
 
O design equilibrado9
O design equilibrado9O design equilibrado9
O design equilibrado9
 

Mais de Blogotipos - Diário das Marcas

Mais de Blogotipos - Diário das Marcas (20)

Teoria das cores
Teoria das coresTeoria das cores
Teoria das cores
 
Significado das cores para outros paises
Significado das cores para outros paisesSignificado das cores para outros paises
Significado das cores para outros paises
 
Significado das cores riccardo benetti
Significado das cores   riccardo benettiSignificado das cores   riccardo benetti
Significado das cores riccardo benetti
 
Hsv
HsvHsv
Hsv
 
Entendendo as cores e seus significados
Entendendo as cores e seus significadosEntendendo as cores e seus significados
Entendendo as cores e seus significados
 
Daltonismo
DaltonismoDaltonismo
Daltonismo
 
Cor
CorCor
Cor
 
Cor nas artes visuais
Cor nas artes visuaisCor nas artes visuais
Cor nas artes visuais
 
Cor na teatro
Cor na teatroCor na teatro
Cor na teatro
 
Cor na sinalização
Cor na sinalizaçãoCor na sinalização
Cor na sinalização
 
Cor na psicologia
Cor na psicologiaCor na psicologia
Cor na psicologia
 
Cor na moda
Cor na modaCor na moda
Cor na moda
 
Cor na arquitectura
Cor na arquitecturaCor na arquitectura
Cor na arquitectura
 
Cor azul
Cor azulCor azul
Cor azul
 
Anexo lista de cores
Anexo   lista de coresAnexo   lista de cores
Anexo lista de cores
 
A cor
A corA cor
A cor
 
Teoria da cor estudo de algumas cores ii
Teoria da cor   estudo de algumas cores iiTeoria da cor   estudo de algumas cores ii
Teoria da cor estudo de algumas cores ii
 
Teoria da cor estudo de algumas cores i
Teoria da cor   estudo de algumas cores iTeoria da cor   estudo de algumas cores i
Teoria da cor estudo de algumas cores i
 
Teoria da cor estudo de algumas cores ii
Teoria da cor   estudo de algumas cores iiTeoria da cor   estudo de algumas cores ii
Teoria da cor estudo de algumas cores ii
 
Teoria da cor estudo de algumas cores i
Teoria da cor   estudo de algumas cores iTeoria da cor   estudo de algumas cores i
Teoria da cor estudo de algumas cores i
 

Planejamento visual os 4 principios basicos

  • 1. PLANEJAMENTO VISUAL Os quatros princípios básicos
  • 2. Os quatro princípios básicos   Proximidade   Repetição   Alinhamento   Contraste
  • 3. Proximidade   Itens relacionados entre si devem ser agrupados   Quando vários itens estão próximos tornam-se uma unidade visual, e não várias unidades individualizadas.   Ajuda a organizar as informações e reduz a desordem
  • 4. Proximidade   Fique atento!   Na leitura, veja para onde seus olhos se dirigem.   Qual o caminho que eles seguem?   Onde termina a leitura?   Após a leitura, para onde os olhos vão?   Você deve seguir uma progressão lógica durante a leitura da página, partindo de um início bem- definido para um final bem-definido
  • 5. Proximidade   Propósito básico é organizar   O simples agrupamento de elementos relacionados em proximidade cria uma organização   Informação organizada = leitura fácil e memorização
  • 8. Proximidade   Como conseguir isto:  Veja quantos elementos visuais tem sua página  Veja quais podem ser agrupados num mesmo elemento, para que se tornem uma unidade visual
  • 9. Proximidade   O que evitar:  Evite muitos elementos separados em uma página  Não coloque os itens somente nos cantos ou no meio da página  Evite criar dúvida em relação aos elementos, ou seja, cada subtítulo, legenda, imagem, etc. devem estar junto a seu respectivo par  Não relacione elementos que não devem ser agrupados.
  • 10. Alinhamento   Não deve ser colocado arbitrariamente numa página   Cada elemento deve ter uma ligação visual com outro elemento da página   Cria uma aparência limpa, sofisticada e suave
  • 11. Alinhamento   Veja o alinhamento dos cartões:
  • 12. Alinhamento   A unidade é um conceito muito importante   Para que todos os elementos da página tenham uma estética unificada, conectada e inter-relacionada, é preciso que haja “amarras” visuais entre os elementos separados   Mesmo que eles não sejam próximos, eles podem estar unificados simplesmente devido ao seu posicionamento   Não importa se a aparência inicial da página seja caótica e selvagem: você sempre encontrará os alinhamentos correspondentes
  • 13. Alinhamento   Esteja consciente do posicionamento dos elementos da página   Encontre sempre algo a mais na página para fazer o alinhamento, mesmo que os dois objetos estejam fisicamente distantes
  • 14. Alinhamento   O que evitar:  Evite usar mais de um alinhamento de texto por página, ou seja, não centralize um texto e alinhe outro à direita  Evite o alinhamento centralizado, a não ser que você tenha o objetivo de criar uma apresentação formal, pacata  Escolha o alinhamento centralizado consciente e não por automação
  • 15. Repetição   Algum aspecto do design deve repetir-se no material inteiro   Repita os elementos visuais do design e espalhe-os pelo material   Você pode repetir a cor, a forma, a textura e as relações espaciais como a espessura, os tamanhos, etc.   Ajuda a criar uma organização e fortalece a unidade
  • 16. Repetição   Repetição dos elementos visuais unifica e fortalece o material   É essencial em documentos de muitas páginas   É considerada, neste último caso, consistência
  • 17. Repetição   Considere a repetição como consistência   O elemento repetitivo pode ser uma fonte em negrito, um fio (linha) para destacar uma seção, algum sinal de tópico, um elemento gráfico   Pode ser qualquer item que o leitor reconheça visualmente   Repetir é como dar ênfase às suas roupas   Por exemplo, se uma mulher usar um vestido preto de noite maravilhoso com um chapéu, ela poderá enfatizar sua roupa usando sapatos e bolsa de outra cor, para realçar a composição
  • 18. Repetição   O que evitar:  Repetir elemento em demasia, para que ele não se torne excessivo e cansativo  Pense na roupa da mulher de preto, se ela usar chapéu, brincos, sapatos, batom vermelho e ainda, acrescentar um casaco vermelho, a repetição criaria um efeito espalhafatoso e confuso
  • 19. Contraste   O objetivo do contraste é evitar elementos meramente similares em uma página   Se os elementos (tipo, cor, tamanho, espessura da linha, forma, espaço, etc.) não forem os mesmos, diferencie-os completamente   Costuma ser a mais importante atração visual de uma página
  • 20. Contraste   O contraste de uma página chama a atenção   Se você colocar dois elementos diferentes em uma página (como duas fontes ou duas espessuras de fio), eles não devem ser similares   Para que o contraste cumpra seu papel, os dois elementos devem ser diferentes   Utilizar o contraste é como retocar a parede: não se pode combinar mais ou menos a cor; ou você encontra a cor exata ou precisará pintar a parede inteira
  • 21. Contraste   Aplique contraste em suas opções de tipologia, nas espessuras das linhas, nas cores, nas formas, nos tamanhos, nos espaços, etc.   É fácil descobrir maneiras de contrastar os itens e, provavelmente, esta é a maneira mais divertida e satisfatória de criar interesse visual   O importante é criar elementos marcantes
  • 23. Contraste   O que evitar:  Se você criar contrastes, faça-os de maneira forte  Evite contrastar uma linha um pouco espessa com uma linha um pouco mais espessa  Evite contrastar um texto em marrom com títulos em preto, por exemplo.  Evite usar duas ou mais fontes similares  Se os itens forem exatamente iguais, diferencie-os