SlideShare uma empresa Scribd logo
 Não é ordenada da mesma forma que
  na linguagem verbal e escrita;
 Relacionamento interativo dos
  elementos;
 LUZ e a natureza tonal são os elementos
  mais importantes;
 O design trabalha com a subjetividade;
  e o significado depende de quem
  observa;
Composição visual

                                                                                                 A intenção de design e a
                                                                                                 condução do olhar pelo
                                                                                                 campo visual.
                                                                                                 O cartaz apresenta a
                                                                                                 preferência de composição
                                                                                                 iniciando pelo lado inferior
                                                                                                 esquerdo.




http://www.jovenscriativos.com.br/files/imagecache/blogImg/files/an%C3%BAncio%20santander2.jpg
Composição visual


EMOÇÃO CRIADORA   GESTALT – A boa organização da forma.


INPUT             Equilíbrio X Instabilidade

OUTPUT            Tensão X Harmonia
                  Nivelamento X Aguçamento


                  Ângulo Inferior Esquerdo
                  Peso visual
                  Atração e agrupamento
                  Positivo e Negativo
Composição visual


Equilíbrio X Instabilidade
Composição visual

                                                  Estabilidade, harmonia, equilíbrio
                                                  O equilíbrio, ou estabilidade, é a
                                                  referência mais forte e firme do
                                                  homem.
                                                  Obtemos o equilíbrio de maneira
                                                  mais fácil na composição
                                                  centralizada, ou na composição
                                                  simétrica.




http://rodolphosantos.files.wordpress.com/2008/
02/anuncio-tao_final.jpg
Composição visual

Tensão X Harmonia
Tensão = Falta de       O raio do
estabilidade;           círculo cria uma
Perturbação do          tensão na
equilíbrio.
                        imagem pois
                        saiu do centro
Harmonia = equilíbrio
entre os elementos.     da figura. Gera
                        movimento e
                        tensão.
Composição visual

                                                                                            Tensão, aguçamento

A composição está centralizada,
porém existe tensão e
aguçamento em virtude dos
elementos decorativos do fundo.
O aguçamento ocorre quando
de uma composição harmônica
ocorre uma surpresa inesperada.




http://img2.pict.com/94/ea/64/7cc1d0a49ee77296be00573e04/QQ8vd/800/du
                                                                        etobamawebbw1.jpg
Composição visual

                                                                                                                          Harmonia e nivelamento

                                                                                                                  Harmonia é o oposto de Tensão.
                                                                                                                  Nesta composição harmônica,
                                                                                                                  feita a partir do quadrado central
                                                                                                                  existe ainda o Nivelamento, isto é,
                                                                                                                  não oferece nenhuma surpresa
                                                                                                                  visual. Poderíamos dizer que é
                                                                                                                  estático.




http://www.ecofuturo.org.br/imprensa/titulo/ANUNCIO%20ECOFUTURO_BIBLIOTECAS%20COMUNITARI
                                                                                           AS.jpg/image_preview
Composição visual

Ângulo Inferior Esquerdo

 O olho favorece o ângulo inferior
  esquerdo, devido a tendência dos
  eixos vertical e horizontal;
 Influência do modo ocidental de
  leitura;
 Existem valores, ou pesos, diferentes
  para ALTO-BAIXO e DIREITA-ESQUERDA
http://twinznews.files.wordpress.com/2008/11/a
nuncio_hakushika_cocktail.jpg
                                                 inferior esquerdo
                                                 Preferência pelo ângulo
                                                                           Composição visual |
Composição visual |




   Em resumo: Quando estamos diante de
    uma composição em que se obedece
    nossos sentidos da base horizontal ,
    quando predomina o lado inferior
    esquerdo estamos diante de uma
    composição nivelada. Os pesos estão
    equilibrados e sem tensão.
Composição visual

Agrupamento por similaridade,
desorientação

                                                 Agrupamento cujo critério é a
                                                 semelhança ou similaridade
                                                 (exemplo: fotos).
                                                 A desorientação se dá pela
                                                 mudança inesperada da direção,
                                                 ou orientação.




DAvi7bI/AAAAAAAAAL8/zcNIZF7neGI/s400/an%C3%BAncio+m3edcenter1.jpg
http://4.bp.blogspot.com/_1gHZPzPqprU/Saf-
Composição visual

                                                                Agrupamento por atração

                                                             GESTALT. Vemos primeiro o TODO e
                                                             depois as PARTES. Existe uma força de
                                                             atração entre os elementos.
                                                             Agrupamento por atração devido a
                                                             SIMILARIDADE dos elementos.




content/uploads/2008/05/anuncio_caderno_constru_decor2.jpg
http://www.comunicacaoexponencial.com.br/wp-
Composição visual

                       Agrupamento por proximidade

O isolamento também contribui para
agrupar elementos.




http://rodolphosantos.files.wordpress.com/2009/06/anuncio_exata_pt.jpg
http://blog.sabernaweb.com.br/portfolio/wp-
content/uploads/2008/05/whirlpool-anuncio-
aspirador.jpg
                                              e por proximidade, equilíbrio
                                              Agrupamento por similaridade
                                                                              Composição visual
•   Conflito
•   Desordem
•   Ilegibilidade
•   Quebra da leitura
•   Excesso de
    imagens
http://www.andi.org.br/tid/arquivos/anu/Campan
haTid_Campanha%20MacCannErickson_An%
C3%BAncio%20TID.jpg
                                                 Obscuridade, baixa legibilidade
                                                                                   Composição visual
http://www.cyberindian.net/wp-content/uploads/lumix-dmc-fx30-digital-camera.jpg
http://garimpodacasa.files.wordpress.com/2008/
07/criado_mudo.jpeg
http://www.anavilhana.com.br/media/catalog/pro
duct/cache/1/image/5e06319eda06f020e43594
a9c230972d/3/9/391-20.jpg
http://i.s8.com.br/images/homeappliances/cover
/img8/1941668_4.jpg
Bibliografia:

ARNHEIM, Rudolf. Arte e percepção visual: uma
psicologia da visão criadora. 2ª Ed. USP, 1980.

DONDIS, Donis A. Sintaxe da linguagem visual.
São Paulo: Martins Fontes, 2007.

Mais conteúdo relacionado

Mais procurados

Sintaxe da Linguagem Visual - parte I
Sintaxe da Linguagem Visual - parte ISintaxe da Linguagem Visual - parte I
Sintaxe da Linguagem Visual - parte I
Cíntia Dal Bello
 
Fundamentos da Linguagem Visual
Fundamentos da Linguagem Visual Fundamentos da Linguagem Visual
Fundamentos da Linguagem Visual
Tauana Parreiras
 
elementos da linguagem visual
elementos da linguagem visualelementos da linguagem visual
elementos da linguagem visual
guest1c7f7f
 
Aula 05 linguagem visual
Aula 05   linguagem visualAula 05   linguagem visual
Aula 05 linguagem visual
Elizeu Nascimento Silva
 
Composição: USO DO CONTRASTE
Composição: USO DO CONTRASTEComposição: USO DO CONTRASTE
Composição: USO DO CONTRASTEangelicaferraz
 
Aula de Desenho - Esboço, Forma e Composição Artística (+ tarefa)
Aula de Desenho - Esboço, Forma e Composição Artística (+ tarefa)Aula de Desenho - Esboço, Forma e Composição Artística (+ tarefa)
Aula de Desenho - Esboço, Forma e Composição Artística (+ tarefa)
Gabriel Ferraciolli
 
Sintaxe da linguagem visual exercicios 1
Sintaxe da linguagem visual exercicios 1Sintaxe da linguagem visual exercicios 1
Sintaxe da linguagem visual exercicios 1Dhione Oliveira
 
Elementos visuais
Elementos visuaisElementos visuais
Elementos visuais
Viviane Marques
 
Design Digital I Percepção e comunicação visual
Design Digital I Percepção e comunicação visualDesign Digital I Percepção e comunicação visual
Design Digital I Percepção e comunicação visualDESIGN DIGITAL UNIARA 2012
 
Elementos visuais
Elementos visuaisElementos visuais
Elementos visuais
Keyla Dias
 
A linguagem visual
A linguagem visualA linguagem visual
A linguagem visual
Rodolfo Ferreira de Oliveira
 
Expressão e composição da forma
Expressão e composição da formaExpressão e composição da forma
Expressão e composição da forma
Fernando Mendes
 
Elementos básicos da comunicação visual
Elementos básicos da comunicação visualElementos básicos da comunicação visual
Elementos básicos da comunicação visualvivi_belon
 
LINGUAGEM VISUAL | CONTRASTE
LINGUAGEM VISUAL | CONTRASTELINGUAGEM VISUAL | CONTRASTE
LINGUAGEM VISUAL | CONTRASTEAndrea Dalforno
 
Aula gestalt 01
Aula gestalt 01Aula gestalt 01
1. Aula Teoria das Cores
1. Aula Teoria das Cores1. Aula Teoria das Cores
1. Aula Teoria das Cores
Aline Okumura
 
Aula 3 - Direção de Arte
Aula 3  - Direção de ArteAula 3  - Direção de Arte
Aula 3 - Direção de Arte
Cíntia Dal Bello
 
Elementos visuais I
Elementos visuais IElementos visuais I
Elementos visuais I
Helena Romero
 
A dinâmica do contraste
A dinâmica do contrasteA dinâmica do contraste
A dinâmica do contraste
Daniela Fiuza
 

Mais procurados (20)

Sintaxe da Linguagem Visual - parte I
Sintaxe da Linguagem Visual - parte ISintaxe da Linguagem Visual - parte I
Sintaxe da Linguagem Visual - parte I
 
Fundamentos da Linguagem Visual
Fundamentos da Linguagem Visual Fundamentos da Linguagem Visual
Fundamentos da Linguagem Visual
 
elementos da linguagem visual
elementos da linguagem visualelementos da linguagem visual
elementos da linguagem visual
 
Aula 05 linguagem visual
Aula 05   linguagem visualAula 05   linguagem visual
Aula 05 linguagem visual
 
Composição: USO DO CONTRASTE
Composição: USO DO CONTRASTEComposição: USO DO CONTRASTE
Composição: USO DO CONTRASTE
 
Aula de Desenho - Esboço, Forma e Composição Artística (+ tarefa)
Aula de Desenho - Esboço, Forma e Composição Artística (+ tarefa)Aula de Desenho - Esboço, Forma e Composição Artística (+ tarefa)
Aula de Desenho - Esboço, Forma e Composição Artística (+ tarefa)
 
Sintaxe da linguagem visual exercicios 1
Sintaxe da linguagem visual exercicios 1Sintaxe da linguagem visual exercicios 1
Sintaxe da linguagem visual exercicios 1
 
Elementos visuais
Elementos visuaisElementos visuais
Elementos visuais
 
Design Digital I Percepção e comunicação visual
Design Digital I Percepção e comunicação visualDesign Digital I Percepção e comunicação visual
Design Digital I Percepção e comunicação visual
 
Elementos visuais
Elementos visuaisElementos visuais
Elementos visuais
 
A linguagem visual
A linguagem visualA linguagem visual
A linguagem visual
 
Expressão e composição da forma
Expressão e composição da formaExpressão e composição da forma
Expressão e composição da forma
 
Elementos básicos da comunicação visual
Elementos básicos da comunicação visualElementos básicos da comunicação visual
Elementos básicos da comunicação visual
 
LINGUAGEM VISUAL | CONTRASTE
LINGUAGEM VISUAL | CONTRASTELINGUAGEM VISUAL | CONTRASTE
LINGUAGEM VISUAL | CONTRASTE
 
Aula gestalt 01
Aula gestalt 01Aula gestalt 01
Aula gestalt 01
 
1. Aula Teoria das Cores
1. Aula Teoria das Cores1. Aula Teoria das Cores
1. Aula Teoria das Cores
 
Aula 3 - Direção de Arte
Aula 3  - Direção de ArteAula 3  - Direção de Arte
Aula 3 - Direção de Arte
 
Elementos visuais I
Elementos visuais IElementos visuais I
Elementos visuais I
 
A dinâmica do contraste
A dinâmica do contrasteA dinâmica do contraste
A dinâmica do contraste
 
PERCEPÇÃO VISUAL
PERCEPÇÃO VISUALPERCEPÇÃO VISUAL
PERCEPÇÃO VISUAL
 

Destaque

volume,profundidade e claro/escuro
volume,profundidade e claro/escurovolume,profundidade e claro/escuro
volume,profundidade e claro/escuropedro ferreira
 
Elementos da comunicacao visual
Elementos da comunicacao visualElementos da comunicacao visual
Elementos da comunicacao visual
lvuftm
 
Composição gráfica
Composição gráficaComposição gráfica
Composição gráfica
Odair Cavichioli
 
Educação visual [guardado automaticamente]
Educação visual [guardado automaticamente]Educação visual [guardado automaticamente]
Educação visual [guardado automaticamente]Sandra Bolinhas
 
Desenvolvimento de Sites
Desenvolvimento de SitesDesenvolvimento de Sites
Desenvolvimento de Sites
Patricia Mallmann
 
WEBDESIGN - P1
WEBDESIGN - P1WEBDESIGN - P1
WEBDESIGN - P1
Renato Melo
 
Lab Integrado de Design IED SP
Lab Integrado de Design IED SPLab Integrado de Design IED SP
Lab Integrado de Design IED SP
Fabio Silveira: Designer | Professor
 
Projeto Grafico V | Aula 01
Projeto Grafico V | Aula 01Projeto Grafico V | Aula 01
Projeto Grafico V | Aula 01
Fabio Silveira: Designer | Professor
 
Princípios clássicos de composição visual e Gráfica para não Designers
Princípios clássicos de composição visual e Gráfica para não DesignersPrincípios clássicos de composição visual e Gráfica para não Designers
Princípios clássicos de composição visual e Gráfica para não Designers
Leonardo Pereira
 
Palestra: Otimização de websites
Palestra: Otimização de websitesPalestra: Otimização de websites
Palestra: Otimização de websites
Intrus
 
01 introducao_identidade
01 introducao_identidade01 introducao_identidade
01 introducao_identidade
Fabio Silveira: Designer | Professor
 
Como produzir conteúdo de qualidade de forma consistente
Como produzir conteúdo de qualidade de forma consistenteComo produzir conteúdo de qualidade de forma consistente
Como produzir conteúdo de qualidade de forma consistente
Emília Chagas
 
Curriculumvitae2014
Curriculumvitae2014Curriculumvitae2014
Curriculumvitae2014
rui domingues
 
Criar Páginas Web
Criar Páginas WebCriar Páginas Web
Criar Páginas WebModeradora
 
Web Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à GestaltWeb Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à Gestalt
Felipe Fernandes
 
Web Design > html (aula 2)
Web Design > html (aula 2)Web Design > html (aula 2)
Web Design > html (aula 2)Felipe Fernandes
 
Projeto grafico II | Aula 01
Projeto grafico II | Aula 01Projeto grafico II | Aula 01
Projeto grafico II | Aula 01
Fabio Silveira: Designer | Professor
 
Responsive web design
Responsive web designResponsive web design
Responsive web designTersis Zonato
 
Aula introdutória da disciplina de webdesign
Aula introdutória da disciplina de webdesignAula introdutória da disciplina de webdesign
Aula introdutória da disciplina de webdesign
Claudia Bordin Rodrigues
 
Business Analysis Canvas [Canvas para Análise de Negócio]
Business Analysis Canvas [Canvas para Análise de Negócio]Business Analysis Canvas [Canvas para Análise de Negócio]
Business Analysis Canvas [Canvas para Análise de Negócio]
Rildo (@rildosan) Santos
 

Destaque (20)

volume,profundidade e claro/escuro
volume,profundidade e claro/escurovolume,profundidade e claro/escuro
volume,profundidade e claro/escuro
 
Elementos da comunicacao visual
Elementos da comunicacao visualElementos da comunicacao visual
Elementos da comunicacao visual
 
Composição gráfica
Composição gráficaComposição gráfica
Composição gráfica
 
Educação visual [guardado automaticamente]
Educação visual [guardado automaticamente]Educação visual [guardado automaticamente]
Educação visual [guardado automaticamente]
 
Desenvolvimento de Sites
Desenvolvimento de SitesDesenvolvimento de Sites
Desenvolvimento de Sites
 
WEBDESIGN - P1
WEBDESIGN - P1WEBDESIGN - P1
WEBDESIGN - P1
 
Lab Integrado de Design IED SP
Lab Integrado de Design IED SPLab Integrado de Design IED SP
Lab Integrado de Design IED SP
 
Projeto Grafico V | Aula 01
Projeto Grafico V | Aula 01Projeto Grafico V | Aula 01
Projeto Grafico V | Aula 01
 
Princípios clássicos de composição visual e Gráfica para não Designers
Princípios clássicos de composição visual e Gráfica para não DesignersPrincípios clássicos de composição visual e Gráfica para não Designers
Princípios clássicos de composição visual e Gráfica para não Designers
 
Palestra: Otimização de websites
Palestra: Otimização de websitesPalestra: Otimização de websites
Palestra: Otimização de websites
 
01 introducao_identidade
01 introducao_identidade01 introducao_identidade
01 introducao_identidade
 
Como produzir conteúdo de qualidade de forma consistente
Como produzir conteúdo de qualidade de forma consistenteComo produzir conteúdo de qualidade de forma consistente
Como produzir conteúdo de qualidade de forma consistente
 
Curriculumvitae2014
Curriculumvitae2014Curriculumvitae2014
Curriculumvitae2014
 
Criar Páginas Web
Criar Páginas WebCriar Páginas Web
Criar Páginas Web
 
Web Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à GestaltWeb Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à Gestalt
 
Web Design > html (aula 2)
Web Design > html (aula 2)Web Design > html (aula 2)
Web Design > html (aula 2)
 
Projeto grafico II | Aula 01
Projeto grafico II | Aula 01Projeto grafico II | Aula 01
Projeto grafico II | Aula 01
 
Responsive web design
Responsive web designResponsive web design
Responsive web design
 
Aula introdutória da disciplina de webdesign
Aula introdutória da disciplina de webdesignAula introdutória da disciplina de webdesign
Aula introdutória da disciplina de webdesign
 
Business Analysis Canvas [Canvas para Análise de Negócio]
Business Analysis Canvas [Canvas para Análise de Negócio]Business Analysis Canvas [Canvas para Análise de Negócio]
Business Analysis Canvas [Canvas para Análise de Negócio]
 

AULA 2:Fundamentos composicao visual