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

Planejamento visual os 4 principios basicos

  • 1.
    PLANEJAMENTO VISUAL Os quatrosprincípios básicos
  • 2.
    Os quatro princípiosbásicos   Proximidade   Repetição   Alinhamento   Contraste
  • 3.
    Proximidade   Itens relacionadosentre 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
  • 6.
  • 7.
  • 8.
    Proximidade   Como conseguiristo:  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 queevitar:  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 deveser 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 oalinhamento 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 conscientedo 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 queevitar:  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 aspectodo 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 doselementos visuais unifica e fortalece o material   É essencial em documentos de muitas páginas   É considerada, neste último caso, consistência
  • 17.
    Repetição   Considere arepetiçã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 queevitar:  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 objetivodo 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 contrastede 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 contrasteem 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
  • 22.
  • 23.
    Contraste   O queevitar:  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