SlideShare a Scribd company logo
1 of 50
Download to read offline
Fundamentos Teóricos:
   Percepção Visual
      Jair C Leite




                        © Jair C Leite
Percepção
•   Percepção Visual
     – É a mais utilizada em IHC.
•   Percepção Auditiva
     – Normalmente como informação auxiliar, feedback ou alertas.
     – Algumas interfaces utilizam mensagens sonoras para ajuda (MS
       Money) ou informações de status (Gerenciador da impressora
       Compaq I700)
•   Percepção tátil
     – Normalmente utilizada como feedback em jogos
•   Olfato e Paladar
     – Muito pouco usados
     – Já existem experimentos para transmitir cheiro digital




                                                                © Jair C Leite
Fundamentos da percepção visual
• Roteiro
  –   Elementos fundamentais
  –   Anatomia do olho humano
  –   Percepção de cores
  –   Harmonia cromática
  –   Campo de visão
  –   Fenômenos da percepção visual
  –   Teorias da percepção visual




                                      © Jair C Leite
Elementos fundamentais - 1
•   Luz
    – Porção (1/70) do espectro
      eletromagnético (com
      comprimentos de onda entre 4
      mil e 8 mil angstrons) que
      impressiona as células
      fotoreceptoras existentes no
      olho: cones e bastonetes.
•   Cor
    – A cor percebida depende do
      conteúdo espectral da luz
      incidida.




                                     © Jair C Leite
Elementos fundamentais - 2
• Luminância
     – Intensidade de energia luminosa recebida na retina
• Contraste
     – Influência da luminância de objetos vizinhos.
• Brilho
     – luminância percebida influenciada pelo contraste.

   A luminância é a capacidade de percepção da intensidade da luz de
    um objeto de um objeto não depende da sua vizinhança.
   O brilho de um objeto é a luminância percebida e depende da
    vizinhança contraste.
      Dois objetos com com diferentes vizinhanças, mas com luminâncias
         idênticas podem ter brilhos diferentes.


                                                                © Jair C Leite
Influência do contraste




• Os círculos são todos do mesmo tom de cinza




                                                © Jair C Leite
Grid de Hermann




Você está vendo os círculos   Existem apenas círculos
entre os quadrados?           brancos entre os quadrados!

Eles não existem!
                                                 © Jair C Leite
© Jair C Leite
© Jair C Leite
Anatomia do olho humano
•   A retina capta os sinais luminosos e os transforma em impulsos
    nervosos.
•   A retina contém dois tipos diferentes de fotorreceptores: cones e
    bastonetes.
•   Os bastonetes (120 milhões) são sensíveis a quantidades relativamente
    pequenas de luz. Extraem informações sobre intensidade luminosa
    (luminância). Não diferenciam cores.
•   Os cones (6 milhões) são de três tipos de cones, cada um capaz de
    detectar uma cor diferente: vermelho, verde e azul.




                                                                  © Jair C Leite
Cores primárias
•   Cores Primárias (cores-luz)
     –   Vermelho, Verde, Azul (RGB)
     –   Sistema aditivo
     –   Soma: Branco
     –   Ausência: Preto
•   Cores primárias (pigmentos)
     –   Azul, Vermelho e Amarelo (CMY)
     –   Sistema subtrativo
     –   Soma: Preto
     –   Ausência: Cor da superfície
•   Espectro de cores
     – Variação do comprimento de onda




                                          © Jair C Leite
Elementos fundamentais da cor
•   Matiz (Hue)
     – É a característica que define e
       distingue uma cor. Vermelho,
       verde ou azul, pôr exemplo,
       são matizes
•   Intensidade (Saturação)
     – Um matiz de intensidade alta
       ou forte é vívido e saturado,
       enquanto o de intensidade
       baixa ou fraca caracteriza cores
       fracas ou quot;pastelquot;.
•   Valor (Brilho)
     – Refere-se a maior ou menor
       quantidade de luz presente na
       cor. Varia acrescentando
       branco ou preto                    H - Hue
                                          S - Saturação
                                          B - Brilho


                                                          © Jair C Leite
Percepção de Cores - 1
•   A visão humana é tricromática (teoria de Young-Helmholtz). Com os
    três tipos de cones, podemos distinguir um número quase infinito de
    cores.
•   A quantidade de cada um dos três tipos de cones na retina não é igual.
    Os cones sensíveis ao azul representam apenas 5% do total.
•   O mecanismo de visão das cores se dá por oposição das cores por
    pares mutuamente excludentes (teoria de Hering).
         • Vermelho x Verde
         • Azul x Amarelo (que decorre da soma do vermelho com o verde).
•   O contraste (branco x preto) percebido nos bastonentes, dá conta do
    brilho ou da intensidade da luz.




                                                                      © Jair C Leite
Percepção de Cores - 2
•   Nem todas as cores focalizam no mesmo plano na retina.
•   O vermelho focaliza um pouco à frente do verde e do azul.
•   Testes mostram que em objetos formalmente idênticos mas de cores
    diferentes, o de cor vermelha é percebido como mais próximo do que o
    verde e o azul.




                                                                 © Jair C Leite
Interação entre cores
• Cores vizinhas afetam as propriedades percebidas
  da cor




                  Mudança na matiz



                   Mudança no brilho



                 Mudança na saturação
                                               © Jair C Leite
Problemas com cores
•   Os cones azuis raramente
    apresentam deficiências,
    comuns nos outros dois
    tipos sensíveis ao vermelho
    e ao verde (Daltonismo.
    Incidente em 8% da
    população. Raro nas
    mulheres).




                                  © Jair C Leite
Cores secundárias, terciárias e
complementares
• Cores secundárias
                                           P
   – Combinação das                             T
     primárias                         T
• Cores terciárias                 S                      S
   – Combinação das
     secundárias
• Cores complementares         T                                T
   – A é complementar a B se
     B é combinação de duas
     cores nas quais A não         P                      P
     está presente
   – Aparecem em lados                           T
     oposto no círculo                 T
     cromático                             S


                                               © Jair C Leite
Cores complementares e pós-imagens




                  Efeito ‘Afterimages’
     Olhe a figura por 30 segundos e depois olhe
     para a área branca ao lado. O que você vê?
                                                   © Jair C Leite
Harmonia Cromática
•   Com uma cor
     – Escala de tons e valores –
       utiliza o índice de luminosidade   [Luciana Silveira]
       na variação para o preto ou
       branco
     – Cinzas coloridos – mistura da
       cor com o cinza.                                          consonantes
•   Com duas cores
     – Acordes conssonantes – utiliza-
       se cores vizinhas
     – Acordes dissonantes – utiliza-
       se cores complementares
       (opostas)
•   Com três cores                                             dissonantes
     – Conssonantes, Dissonantes e
       Assonantes
     – Assonantes – tríades primárias




                                                               © Jair C Leite
Exemplos de combinações hamônicas




             Harmonia monocromática




           Harmonia bicromática

                                      © Jair C Leite
Campo de visão
• Determina os ângulos nos quais um indivíduo
  consegue perceber elementos.
• Em monitores com grande largura ou em interações
  com interfaces em um ambiente, estes dados são
  importantes.
                             Ótimo
                       15o      15o
                                      62o
                 62o                         Máximo recomendado



               95o                     95o       Sem movimento


                166o                  166o
                                             Com movimento


                                                             © Jair C Leite
Cores e foco
•   Ao focalizarmos um objetos estamos movimentando os olhos
    para que a imagem se forme na fovea.
•   Os cones estão concentrados na fovea enquanto os bastonetes
    ao seu redor.
•   Isto permite que as cores sejam melhor percebidas quando o
    objeto está focado.
•   As cores vermelhas e verdes são percebidas melhor quando
    estão focadas.
•   Alguns fenômenos interessantes podem ser percebidos.




                                                         © Jair C Leite
Ilusão de movimento periférico




                                 © Jair C Leite
Ilusão de movimento periférico




                                 © Jair C Leite
Teorias para percepção visual
• Abordagem construtivista
• Abordagem ecológica




                                © Jair C Leite
Abordagem construtivista
• A percepção visual do mundo é construída a partir
  das informações do ambiente e do conhecimento
  prévio armazenado.
• O conhecimento de cada um pode transformar,
  distorcer, ampliar ou descartar aquilo que esta sendo
  percebido.
• Distinção Figura-Fundo
• Princípios da Psicologia Gestalt




                                                  © Jair C Leite
Distinção figura-fundo




                         © Jair C Leite
Figura-fundo
• Quantas rostos
  você consegue
  ver nesta
  árvore?




                   © Jair C Leite
O que você percebe na figura abaixo?




                                 © Jair C Leite
Gestalt
• Teorias da percepção visual desenvolvido por
  psicólogos alemães na década de 20.
• Significa ‘unificado’
• São princípios baseados em fenômenos da
  percepção:
  –   Proximidade
  –   Similaridade
  –   Fechamento
  –   Continuidade
  –   Figura-fundo

                                         © Jair C Leite
Proximidade
• Os elementos próximos são interpretados
  como pertencentes a um grupo




                                     1 grupo
 Nenhum grupo         3 grupos




                                         © Jair C Leite
Efeito do posicionamento (humor)




                                   © Jair C Leite
Similaridade
• Elementos com atributos semelhantes (cor ou
  forma) são interpretados como de um mesmo
  grupo ou categoria




   Similaridade




                                         © Jair C Leite
Fechamento
• Partes incompletas de uma figura são
  completadas pela mente humana




                                         © Jair C Leite
Continuidade
• Os olhos tendem a seguir as formas da
  imagem




                                          © Jair C Leite
Simetria
• Partes simétricas são percebidas como
  figuras coerentes.




   [   ][   ][   ]   3 pares de colchetes


   [   [[   [[   [

                                            © Jair C Leite
Figura-fundo
• O cérebro tenta separar formas em uma
  imagem, separando-a do fundo
• Algumas imagens podem ter relações
  ambíguas de figura-fundo




                                          © Jair C Leite
Abordagem ecológica
•   Argumenta que a percepção é um processo direto e contínuo
    que ocorre através da exploração do ambiente em colaboração
    com os outros sentidos (audição, tato, olfato e paladar)
•   Noção de affordance
     – Ações possíveis que estão disponíveis num ambiente para
       um indivíduo, independente de ele perceber.
     – São as ações que o ambiente induz um indivíduo a realizar
        • Crianças de 1 a 2 anos reagem às affordances do seu
          ambiente – botão da TV, volume do som
    – D. Norman utilizou o termo em design
        • a forma do objeto deve induzir, incentivar a sua correta
          utilização




                                                                     © Jair C Leite
A abordagem ecológica (Gibson)




  quot;I have described environment as the surfaces that separate
  substances from the medium in which the animals live. But I have also
  described what the environment affords animals, mentioning the
  terrain, shelters, water, fire, objects, tools, other animals, and human
  displays. How do we go from surfaces, is there information for the
  perception of what they afford. If so, to perceive them is to perceive
  what they afford, This is a radical hypothesis, for it implies that the
  quot;valuesquot; and quot;meaningsquot; of things in the enviroment can be directly
  perceived. Moreover, it would explain the sense in which values and
  meanings are external to the perceiver.quot;
  (J. J. Gibson: The Ecological Approach to Visual Perception, 1979)
                                                                     © Jair C Leite
Exemplos de Affordances
• Os objetos “convidam” a sua utilização.
• A percepção está associada com aquilo que se pode
  fazer com o objeto




                                               © Jair C Leite
Fenômenos da percepção
• Os slides a seguir mostram exemplos de
  fenômenos da percepção visual
• Para saber mais veja
  – http://www.yorku.ca/eye/thejoy.htm




                                           © Jair C Leite
Ilusão de ótica




                  © Jair C Leite
Ilusão de Hering e Poggendorff


                 As linhas vermelhas são retas?



                 As duas linhas vermelhas
                 formam uma reta?




                                 Temos um ou
                                 dois círculos?



                                             © Jair C Leite
Ilusão de Kanizsa




Nenhum triângulo foi
desenhado aqui.

                       © Jair C Leite
Ilusão de movimento aparente




                               © Jair C Leite
Técnicas de visualização –
profundidade
•   Tamanho
     – Objetos idênticos com tamanhos maiores parecem estar mais perto
       que o menores.
•   Interposição
     – Se um objeto está desenhado por cima de um outro, entende-se
       que o primeiro está a frente do segundo
•   Contraste, claridade e brilho
     – Objetos mais brilhantes e claros aparentam estar mais perto.
•   Sombras
     – Sombras podem ser utilizadas para indicar o posicionamento do
       objeto em relação a outros
•   Textura
     – Objetos com textura mais detalhada aparentam estar mais
       próximos


                                                                  © Jair C Leite
Ilusão de perspectiva
                   • Os cubos são todos do
                     mesmo tamanho
                   • As linhas criam a ilusão
                     de perspectiva (3D)
                   • O cérebro confunde o
                     tamanho real com o
                     tamanho esperado pela
                     perspectiva




                                        © Jair C Leite
Ilusão de perspectiva
                   • A imagem do homem
                     pequeno é a mesma
                     que está no fundo do
                     corredor!
                   • Elas têm o mesmo
                     tamanho




                                       © Jair C Leite
Profundidade ambígua




                       © Jair C Leite
Distorção nas imagens




 Esta figura é formada apenas
 por retas horizontais e
 quadrados.




                                © Jair C Leite

More Related Content

What's hot

Elementos fundamentais da linguagem visual
Elementos fundamentais da linguagem visualElementos fundamentais da linguagem visual
Elementos fundamentais da linguagem visualWilliam Marques
 
COMPOSIÇÃO E PERCEPÇÃO - COMUNICAÇÃO VISUAL - 3º PERÍODO - PUBLICIDADE
COMPOSIÇÃO E PERCEPÇÃO - COMUNICAÇÃO VISUAL - 3º PERÍODO - PUBLICIDADECOMPOSIÇÃO E PERCEPÇÃO - COMUNICAÇÃO VISUAL - 3º PERÍODO - PUBLICIDADE
COMPOSIÇÃO E PERCEPÇÃO - COMUNICAÇÃO VISUAL - 3º PERÍODO - PUBLICIDADEKleiton Renzo
 
Gestalt new(fix)
Gestalt new(fix)Gestalt new(fix)
Gestalt new(fix)De Janks
 
Aula 2 composição visual
Aula  2 composição visualAula  2 composição visual
Aula 2 composição visualArtedoiscmb Cmb
 
Sintaxe da Linguagem Visual - parte II
Sintaxe da Linguagem Visual - parte IISintaxe da Linguagem Visual - parte II
Sintaxe da Linguagem Visual - parte IICíntia Dal Bello
 
Aula 02 - Princípios da Gestalt
Aula 02 - Princípios da GestaltAula 02 - Princípios da Gestalt
Aula 02 - Princípios da GestaltDanilo Aroeira
 
Teorias da aprendizagem
Teorias da aprendizagemTeorias da aprendizagem
Teorias da aprendizagemThais1976
 
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
 
AULA 1: Psicologia da Forma
AULA 1: Psicologia da FormaAULA 1: Psicologia da Forma
AULA 1: Psicologia da FormaW.COM
 
Alfabetismo visual elementos_sintaticos2
Alfabetismo visual elementos_sintaticos2Alfabetismo visual elementos_sintaticos2
Alfabetismo visual elementos_sintaticos2Denise Lima
 
Gestalt - Teoria do Design
Gestalt - Teoria do DesignGestalt - Teoria do Design
Gestalt - Teoria do DesignRodrigo Losina
 

What's hot (20)

Gestalt da forma
Gestalt da formaGestalt da forma
Gestalt da forma
 
Elementos fundamentais da linguagem visual
Elementos fundamentais da linguagem visualElementos fundamentais da linguagem visual
Elementos fundamentais da linguagem visual
 
A teoria de gestalt
A teoria de gestaltA teoria de gestalt
A teoria de gestalt
 
COMPOSIÇÃO E PERCEPÇÃO - COMUNICAÇÃO VISUAL - 3º PERÍODO - PUBLICIDADE
COMPOSIÇÃO E PERCEPÇÃO - COMUNICAÇÃO VISUAL - 3º PERÍODO - PUBLICIDADECOMPOSIÇÃO E PERCEPÇÃO - COMUNICAÇÃO VISUAL - 3º PERÍODO - PUBLICIDADE
COMPOSIÇÃO E PERCEPÇÃO - COMUNICAÇÃO VISUAL - 3º PERÍODO - PUBLICIDADE
 
Linguagem Visual - Fundamentos Compositivos
Linguagem Visual - Fundamentos CompositivosLinguagem Visual - Fundamentos Compositivos
Linguagem Visual - Fundamentos Compositivos
 
Gestalt new(fix)
Gestalt new(fix)Gestalt new(fix)
Gestalt new(fix)
 
Elementos visuais I
Elementos visuais IElementos visuais I
Elementos visuais I
 
Teoria da Gestalt
Teoria da GestaltTeoria da Gestalt
Teoria da Gestalt
 
Aula 2 composição visual
Aula  2 composição visualAula  2 composição visual
Aula 2 composição visual
 
Sintaxe da Linguagem Visual - parte II
Sintaxe da Linguagem Visual - parte IISintaxe da Linguagem Visual - parte II
Sintaxe da Linguagem Visual - parte II
 
Introdução a Gestalt
Introdução a GestaltIntrodução a Gestalt
Introdução a Gestalt
 
Percepção - Psicologia
Percepção - PsicologiaPercepção - Psicologia
Percepção - Psicologia
 
Aula 02 - Princípios da Gestalt
Aula 02 - Princípios da GestaltAula 02 - Princípios da Gestalt
Aula 02 - Princípios da Gestalt
 
Teorias da aprendizagem
Teorias da aprendizagemTeorias da aprendizagem
Teorias da aprendizagem
 
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
 
AULA 1: Psicologia da Forma
AULA 1: Psicologia da FormaAULA 1: Psicologia da Forma
AULA 1: Psicologia da Forma
 
Alfabetismo visual elementos_sintaticos2
Alfabetismo visual elementos_sintaticos2Alfabetismo visual elementos_sintaticos2
Alfabetismo visual elementos_sintaticos2
 
Teoria de Gestalt
Teoria de GestaltTeoria de Gestalt
Teoria de Gestalt
 
PERCEPÇÃO VISUAL
PERCEPÇÃO VISUALPERCEPÇÃO VISUAL
PERCEPÇÃO VISUAL
 
Gestalt - Teoria do Design
Gestalt - Teoria do DesignGestalt - Teoria do Design
Gestalt - Teoria do Design
 

Viewers also liked

sensação e percepção
sensação e percepçãosensação e percepção
sensação e percepçãoRoberto Nobre
 
Desenho e Percepção Visual modulo 2 cgav
Desenho e Percepção Visual modulo 2 cgavDesenho e Percepção Visual modulo 2 cgav
Desenho e Percepção Visual modulo 2 cgavAnacatgarrido
 
Apresentação percepção
Apresentação percepçãoApresentação percepção
Apresentação percepçãoMariana Rezende
 
Ilusão de ótica - Novos desafios
Ilusão de ótica - Novos desafiosIlusão de ótica - Novos desafios
Ilusão de ótica - Novos desafiosleidianelopes1
 
Como potencializar a experiência de uso (e vendas) pelo Mobile
Como potencializar a experiência de uso (e vendas) pelo MobileComo potencializar a experiência de uso (e vendas) pelo Mobile
Como potencializar a experiência de uso (e vendas) pelo MobileCarla De Bona
 
Estampa design superficie
Estampa   design superficieEstampa   design superficie
Estampa design superficieJuliana Reche
 
Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)Impacta Eventos
 
Criatividade e Processos de Criação
Criatividade e Processos de CriaçãoCriatividade e Processos de Criação
Criatividade e Processos de CriaçãoFabio Silva
 
Uma percepção estética do meio ambiente a partir da arte digital interativa
Uma percepção estética do meio ambiente a partir da arte digital interativaUma percepção estética do meio ambiente a partir da arte digital interativa
Uma percepção estética do meio ambiente a partir da arte digital interativaecoarte
 
Uma percepção estética do meio ambiente a partir da arte digital interativa
Uma percepção estética do meio ambiente a partir da arte digital interativaUma percepção estética do meio ambiente a partir da arte digital interativa
Uma percepção estética do meio ambiente a partir da arte digital interativaFernando Krum
 

Viewers also liked (20)

Percepção
PercepçãoPercepção
Percepção
 
sensação e percepção
sensação e percepçãosensação e percepção
sensação e percepção
 
Percepção visual
Percepção visualPercepção visual
Percepção visual
 
Percepcao visual
Percepcao visualPercepcao visual
Percepcao visual
 
Desenho e Percepção Visual modulo 2 cgav
Desenho e Percepção Visual modulo 2 cgavDesenho e Percepção Visual modulo 2 cgav
Desenho e Percepção Visual modulo 2 cgav
 
Percepção visual
Percepção visualPercepção visual
Percepção visual
 
Apresentação percepção
Apresentação percepçãoApresentação percepção
Apresentação percepção
 
Sensação e Percepção
Sensação e PercepçãoSensação e Percepção
Sensação e Percepção
 
Ilusão de ótica - Novos desafios
Ilusão de ótica - Novos desafiosIlusão de ótica - Novos desafios
Ilusão de ótica - Novos desafios
 
Como potencializar a experiência de uso (e vendas) pelo Mobile
Como potencializar a experiência de uso (e vendas) pelo MobileComo potencializar a experiência de uso (e vendas) pelo Mobile
Como potencializar a experiência de uso (e vendas) pelo Mobile
 
Percepção visual
Percepção visualPercepção visual
Percepção visual
 
Ilusão de óptica
Ilusão de ópticaIlusão de óptica
Ilusão de óptica
 
Lou borghetti usa
Lou borghetti usaLou borghetti usa
Lou borghetti usa
 
Gestalt
GestaltGestalt
Gestalt
 
Estampa design superficie
Estampa   design superficieEstampa   design superficie
Estampa design superficie
 
Percepção, Movimento e Ação
Percepção, Movimento e AçãoPercepção, Movimento e Ação
Percepção, Movimento e Ação
 
Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)
 
Criatividade e Processos de Criação
Criatividade e Processos de CriaçãoCriatividade e Processos de Criação
Criatividade e Processos de Criação
 
Uma percepção estética do meio ambiente a partir da arte digital interativa
Uma percepção estética do meio ambiente a partir da arte digital interativaUma percepção estética do meio ambiente a partir da arte digital interativa
Uma percepção estética do meio ambiente a partir da arte digital interativa
 
Uma percepção estética do meio ambiente a partir da arte digital interativa
Uma percepção estética do meio ambiente a partir da arte digital interativaUma percepção estética do meio ambiente a partir da arte digital interativa
Uma percepção estética do meio ambiente a partir da arte digital interativa
 

Similar to Fundamentos Percepcao

Similar to Fundamentos Percepcao (16)

Aula 02 semiótica e cores
Aula 02   semiótica e coresAula 02   semiótica e cores
Aula 02 semiótica e cores
 
Cores
CoresCores
Cores
 
CORES
CORESCORES
CORES
 
Teorias da cor cartografia temática
Teorias da cor   cartografia temáticaTeorias da cor   cartografia temática
Teorias da cor cartografia temática
 
Balanço de Branco: O Que É? Saiba Como Melhorar Suas Fotografias!
Balanço de Branco: O Que É? Saiba Como Melhorar Suas Fotografias!Balanço de Branco: O Que É? Saiba Como Melhorar Suas Fotografias!
Balanço de Branco: O Que É? Saiba Como Melhorar Suas Fotografias!
 
1. Aula Teoria das Cores
1. Aula Teoria das Cores1. Aula Teoria das Cores
1. Aula Teoria das Cores
 
Linguagem das Cores - Aula 4
Linguagem das Cores - Aula 4Linguagem das Cores - Aula 4
Linguagem das Cores - Aula 4
 
Estética Aplicada ao Design - Aula 7
Estética Aplicada ao Design - Aula 7Estética Aplicada ao Design - Aula 7
Estética Aplicada ao Design - Aula 7
 
Apostila cor 6o ano 2013
Apostila cor 6o ano 2013Apostila cor 6o ano 2013
Apostila cor 6o ano 2013
 
Teoria das cores
Teoria das coresTeoria das cores
Teoria das cores
 
óPtica da visão
óPtica da visãoóPtica da visão
óPtica da visão
 
cartografia_tematica - aula 3.ppt
cartografia_tematica - aula 3.pptcartografia_tematica - aula 3.ppt
cartografia_tematica - aula 3.ppt
 
Cartografia tematica aula 3
Cartografia tematica   aula 3Cartografia tematica   aula 3
Cartografia tematica aula 3
 
1-aulateoriadascores-.pdf
1-aulateoriadascores-.pdf1-aulateoriadascores-.pdf
1-aulateoriadascores-.pdf
 
Teoria das cores
Teoria das coresTeoria das cores
Teoria das cores
 
Teoria das cores aula
Teoria das cores   aulaTeoria das cores   aula
Teoria das cores aula
 

Recently uploaded

Inteligência Artificial na Saúde - A Próxima Fronteira.pdf
Inteligência Artificial na Saúde - A Próxima Fronteira.pdfInteligência Artificial na Saúde - A Próxima Fronteira.pdf
Inteligência Artificial na Saúde - A Próxima Fronteira.pdfMedTechBiz
 
ENFERMAGEM - MÓDULO I - HISTORIA DA ENFERMAGEM, ETICA E LEGISLACAO.pptx.pdf
ENFERMAGEM - MÓDULO I -  HISTORIA DA ENFERMAGEM, ETICA E LEGISLACAO.pptx.pdfENFERMAGEM - MÓDULO I -  HISTORIA DA ENFERMAGEM, ETICA E LEGISLACAO.pptx.pdf
ENFERMAGEM - MÓDULO I - HISTORIA DA ENFERMAGEM, ETICA E LEGISLACAO.pptx.pdfjuliperfumes03
 
700740332-0601-TREINAMENTO-LAVIEEN-2021-1.pdf
700740332-0601-TREINAMENTO-LAVIEEN-2021-1.pdf700740332-0601-TREINAMENTO-LAVIEEN-2021-1.pdf
700740332-0601-TREINAMENTO-LAVIEEN-2021-1.pdfMichele Carvalho
 
Fisiologia da Digestão sistema digestiv
Fisiologia da Digestão sistema digestivFisiologia da Digestão sistema digestiv
Fisiologia da Digestão sistema digestivProfessorThialesDias
 
Psicologia Hospitalar (apresentação de slides)
Psicologia Hospitalar (apresentação de slides)Psicologia Hospitalar (apresentação de slides)
Psicologia Hospitalar (apresentação de slides)a099601
 
8 - O Teste de sentar e levantar em 1 minuto como indicador de resultado nos ...
8 - O Teste de sentar e levantar em 1 minuto como indicador de resultado nos ...8 - O Teste de sentar e levantar em 1 minuto como indicador de resultado nos ...
8 - O Teste de sentar e levantar em 1 minuto como indicador de resultado nos ...Leila Fortes
 
88888888888888888888888888888663342.pptx
88888888888888888888888888888663342.pptx88888888888888888888888888888663342.pptx
88888888888888888888888888888663342.pptxLEANDROSPANHOL1
 
Avanços da Telemedicina em dados | Regiane Spielmann
Avanços da Telemedicina em dados | Regiane SpielmannAvanços da Telemedicina em dados | Regiane Spielmann
Avanços da Telemedicina em dados | Regiane SpielmannRegiane Spielmann
 
Em um local de crime com óbito muitas perguntas devem ser respondidas. Quem é...
Em um local de crime com óbito muitas perguntas devem ser respondidas. Quem é...Em um local de crime com óbito muitas perguntas devem ser respondidas. Quem é...
Em um local de crime com óbito muitas perguntas devem ser respondidas. Quem é...DL assessoria 31
 
aula entrevista avaliação exame do paciente.ppt
aula entrevista avaliação exame do paciente.pptaula entrevista avaliação exame do paciente.ppt
aula entrevista avaliação exame do paciente.pptDaiana Moreira
 

Recently uploaded (10)

Inteligência Artificial na Saúde - A Próxima Fronteira.pdf
Inteligência Artificial na Saúde - A Próxima Fronteira.pdfInteligência Artificial na Saúde - A Próxima Fronteira.pdf
Inteligência Artificial na Saúde - A Próxima Fronteira.pdf
 
ENFERMAGEM - MÓDULO I - HISTORIA DA ENFERMAGEM, ETICA E LEGISLACAO.pptx.pdf
ENFERMAGEM - MÓDULO I -  HISTORIA DA ENFERMAGEM, ETICA E LEGISLACAO.pptx.pdfENFERMAGEM - MÓDULO I -  HISTORIA DA ENFERMAGEM, ETICA E LEGISLACAO.pptx.pdf
ENFERMAGEM - MÓDULO I - HISTORIA DA ENFERMAGEM, ETICA E LEGISLACAO.pptx.pdf
 
700740332-0601-TREINAMENTO-LAVIEEN-2021-1.pdf
700740332-0601-TREINAMENTO-LAVIEEN-2021-1.pdf700740332-0601-TREINAMENTO-LAVIEEN-2021-1.pdf
700740332-0601-TREINAMENTO-LAVIEEN-2021-1.pdf
 
Fisiologia da Digestão sistema digestiv
Fisiologia da Digestão sistema digestivFisiologia da Digestão sistema digestiv
Fisiologia da Digestão sistema digestiv
 
Psicologia Hospitalar (apresentação de slides)
Psicologia Hospitalar (apresentação de slides)Psicologia Hospitalar (apresentação de slides)
Psicologia Hospitalar (apresentação de slides)
 
8 - O Teste de sentar e levantar em 1 minuto como indicador de resultado nos ...
8 - O Teste de sentar e levantar em 1 minuto como indicador de resultado nos ...8 - O Teste de sentar e levantar em 1 minuto como indicador de resultado nos ...
8 - O Teste de sentar e levantar em 1 minuto como indicador de resultado nos ...
 
88888888888888888888888888888663342.pptx
88888888888888888888888888888663342.pptx88888888888888888888888888888663342.pptx
88888888888888888888888888888663342.pptx
 
Avanços da Telemedicina em dados | Regiane Spielmann
Avanços da Telemedicina em dados | Regiane SpielmannAvanços da Telemedicina em dados | Regiane Spielmann
Avanços da Telemedicina em dados | Regiane Spielmann
 
Em um local de crime com óbito muitas perguntas devem ser respondidas. Quem é...
Em um local de crime com óbito muitas perguntas devem ser respondidas. Quem é...Em um local de crime com óbito muitas perguntas devem ser respondidas. Quem é...
Em um local de crime com óbito muitas perguntas devem ser respondidas. Quem é...
 
aula entrevista avaliação exame do paciente.ppt
aula entrevista avaliação exame do paciente.pptaula entrevista avaliação exame do paciente.ppt
aula entrevista avaliação exame do paciente.ppt
 

Fundamentos Percepcao

  • 1. Fundamentos Teóricos: Percepção Visual Jair C Leite © Jair C Leite
  • 2. Percepção • Percepção Visual – É a mais utilizada em IHC. • Percepção Auditiva – Normalmente como informação auxiliar, feedback ou alertas. – Algumas interfaces utilizam mensagens sonoras para ajuda (MS Money) ou informações de status (Gerenciador da impressora Compaq I700) • Percepção tátil – Normalmente utilizada como feedback em jogos • Olfato e Paladar – Muito pouco usados – Já existem experimentos para transmitir cheiro digital © Jair C Leite
  • 3. Fundamentos da percepção visual • Roteiro – Elementos fundamentais – Anatomia do olho humano – Percepção de cores – Harmonia cromática – Campo de visão – Fenômenos da percepção visual – Teorias da percepção visual © Jair C Leite
  • 4. Elementos fundamentais - 1 • Luz – Porção (1/70) do espectro eletromagnético (com comprimentos de onda entre 4 mil e 8 mil angstrons) que impressiona as células fotoreceptoras existentes no olho: cones e bastonetes. • Cor – A cor percebida depende do conteúdo espectral da luz incidida. © Jair C Leite
  • 5. Elementos fundamentais - 2 • Luminância – Intensidade de energia luminosa recebida na retina • Contraste – Influência da luminância de objetos vizinhos. • Brilho – luminância percebida influenciada pelo contraste.  A luminância é a capacidade de percepção da intensidade da luz de um objeto de um objeto não depende da sua vizinhança.  O brilho de um objeto é a luminância percebida e depende da vizinhança contraste.  Dois objetos com com diferentes vizinhanças, mas com luminâncias idênticas podem ter brilhos diferentes. © Jair C Leite
  • 6. Influência do contraste • Os círculos são todos do mesmo tom de cinza © Jair C Leite
  • 7. Grid de Hermann Você está vendo os círculos Existem apenas círculos entre os quadrados? brancos entre os quadrados! Eles não existem! © Jair C Leite
  • 8. © Jair C Leite
  • 9. © Jair C Leite
  • 10. Anatomia do olho humano • A retina capta os sinais luminosos e os transforma em impulsos nervosos. • A retina contém dois tipos diferentes de fotorreceptores: cones e bastonetes. • Os bastonetes (120 milhões) são sensíveis a quantidades relativamente pequenas de luz. Extraem informações sobre intensidade luminosa (luminância). Não diferenciam cores. • Os cones (6 milhões) são de três tipos de cones, cada um capaz de detectar uma cor diferente: vermelho, verde e azul. © Jair C Leite
  • 11. Cores primárias • Cores Primárias (cores-luz) – Vermelho, Verde, Azul (RGB) – Sistema aditivo – Soma: Branco – Ausência: Preto • Cores primárias (pigmentos) – Azul, Vermelho e Amarelo (CMY) – Sistema subtrativo – Soma: Preto – Ausência: Cor da superfície • Espectro de cores – Variação do comprimento de onda © Jair C Leite
  • 12. Elementos fundamentais da cor • Matiz (Hue) – É a característica que define e distingue uma cor. Vermelho, verde ou azul, pôr exemplo, são matizes • Intensidade (Saturação) – Um matiz de intensidade alta ou forte é vívido e saturado, enquanto o de intensidade baixa ou fraca caracteriza cores fracas ou quot;pastelquot;. • Valor (Brilho) – Refere-se a maior ou menor quantidade de luz presente na cor. Varia acrescentando branco ou preto H - Hue S - Saturação B - Brilho © Jair C Leite
  • 13. Percepção de Cores - 1 • A visão humana é tricromática (teoria de Young-Helmholtz). Com os três tipos de cones, podemos distinguir um número quase infinito de cores. • A quantidade de cada um dos três tipos de cones na retina não é igual. Os cones sensíveis ao azul representam apenas 5% do total. • O mecanismo de visão das cores se dá por oposição das cores por pares mutuamente excludentes (teoria de Hering). • Vermelho x Verde • Azul x Amarelo (que decorre da soma do vermelho com o verde). • O contraste (branco x preto) percebido nos bastonentes, dá conta do brilho ou da intensidade da luz. © Jair C Leite
  • 14. Percepção de Cores - 2 • Nem todas as cores focalizam no mesmo plano na retina. • O vermelho focaliza um pouco à frente do verde e do azul. • Testes mostram que em objetos formalmente idênticos mas de cores diferentes, o de cor vermelha é percebido como mais próximo do que o verde e o azul. © Jair C Leite
  • 15. Interação entre cores • Cores vizinhas afetam as propriedades percebidas da cor Mudança na matiz Mudança no brilho Mudança na saturação © Jair C Leite
  • 16. Problemas com cores • Os cones azuis raramente apresentam deficiências, comuns nos outros dois tipos sensíveis ao vermelho e ao verde (Daltonismo. Incidente em 8% da população. Raro nas mulheres). © Jair C Leite
  • 17. Cores secundárias, terciárias e complementares • Cores secundárias P – Combinação das T primárias T • Cores terciárias S S – Combinação das secundárias • Cores complementares T T – A é complementar a B se B é combinação de duas cores nas quais A não P P está presente – Aparecem em lados T oposto no círculo T cromático S © Jair C Leite
  • 18. Cores complementares e pós-imagens Efeito ‘Afterimages’ Olhe a figura por 30 segundos e depois olhe para a área branca ao lado. O que você vê? © Jair C Leite
  • 19. Harmonia Cromática • Com uma cor – Escala de tons e valores – utiliza o índice de luminosidade [Luciana Silveira] na variação para o preto ou branco – Cinzas coloridos – mistura da cor com o cinza. consonantes • Com duas cores – Acordes conssonantes – utiliza- se cores vizinhas – Acordes dissonantes – utiliza- se cores complementares (opostas) • Com três cores dissonantes – Conssonantes, Dissonantes e Assonantes – Assonantes – tríades primárias © Jair C Leite
  • 20. Exemplos de combinações hamônicas Harmonia monocromática Harmonia bicromática © Jair C Leite
  • 21. Campo de visão • Determina os ângulos nos quais um indivíduo consegue perceber elementos. • Em monitores com grande largura ou em interações com interfaces em um ambiente, estes dados são importantes. Ótimo 15o 15o 62o 62o Máximo recomendado 95o 95o Sem movimento 166o 166o Com movimento © Jair C Leite
  • 22. Cores e foco • Ao focalizarmos um objetos estamos movimentando os olhos para que a imagem se forme na fovea. • Os cones estão concentrados na fovea enquanto os bastonetes ao seu redor. • Isto permite que as cores sejam melhor percebidas quando o objeto está focado. • As cores vermelhas e verdes são percebidas melhor quando estão focadas. • Alguns fenômenos interessantes podem ser percebidos. © Jair C Leite
  • 23. Ilusão de movimento periférico © Jair C Leite
  • 24. Ilusão de movimento periférico © Jair C Leite
  • 25. Teorias para percepção visual • Abordagem construtivista • Abordagem ecológica © Jair C Leite
  • 26. Abordagem construtivista • A percepção visual do mundo é construída a partir das informações do ambiente e do conhecimento prévio armazenado. • O conhecimento de cada um pode transformar, distorcer, ampliar ou descartar aquilo que esta sendo percebido. • Distinção Figura-Fundo • Princípios da Psicologia Gestalt © Jair C Leite
  • 27. Distinção figura-fundo © Jair C Leite
  • 28. Figura-fundo • Quantas rostos você consegue ver nesta árvore? © Jair C Leite
  • 29. O que você percebe na figura abaixo? © Jair C Leite
  • 30. Gestalt • Teorias da percepção visual desenvolvido por psicólogos alemães na década de 20. • Significa ‘unificado’ • São princípios baseados em fenômenos da percepção: – Proximidade – Similaridade – Fechamento – Continuidade – Figura-fundo © Jair C Leite
  • 31. Proximidade • Os elementos próximos são interpretados como pertencentes a um grupo 1 grupo Nenhum grupo 3 grupos © Jair C Leite
  • 32. Efeito do posicionamento (humor) © Jair C Leite
  • 33. Similaridade • Elementos com atributos semelhantes (cor ou forma) são interpretados como de um mesmo grupo ou categoria Similaridade © Jair C Leite
  • 34. Fechamento • Partes incompletas de uma figura são completadas pela mente humana © Jair C Leite
  • 35. Continuidade • Os olhos tendem a seguir as formas da imagem © Jair C Leite
  • 36. Simetria • Partes simétricas são percebidas como figuras coerentes. [ ][ ][ ] 3 pares de colchetes [ [[ [[ [ © Jair C Leite
  • 37. Figura-fundo • O cérebro tenta separar formas em uma imagem, separando-a do fundo • Algumas imagens podem ter relações ambíguas de figura-fundo © Jair C Leite
  • 38. Abordagem ecológica • Argumenta que a percepção é um processo direto e contínuo que ocorre através da exploração do ambiente em colaboração com os outros sentidos (audição, tato, olfato e paladar) • Noção de affordance – Ações possíveis que estão disponíveis num ambiente para um indivíduo, independente de ele perceber. – São as ações que o ambiente induz um indivíduo a realizar • Crianças de 1 a 2 anos reagem às affordances do seu ambiente – botão da TV, volume do som – D. Norman utilizou o termo em design • a forma do objeto deve induzir, incentivar a sua correta utilização © Jair C Leite
  • 39. A abordagem ecológica (Gibson) quot;I have described environment as the surfaces that separate substances from the medium in which the animals live. But I have also described what the environment affords animals, mentioning the terrain, shelters, water, fire, objects, tools, other animals, and human displays. How do we go from surfaces, is there information for the perception of what they afford. If so, to perceive them is to perceive what they afford, This is a radical hypothesis, for it implies that the quot;valuesquot; and quot;meaningsquot; of things in the enviroment can be directly perceived. Moreover, it would explain the sense in which values and meanings are external to the perceiver.quot; (J. J. Gibson: The Ecological Approach to Visual Perception, 1979) © Jair C Leite
  • 40. Exemplos de Affordances • Os objetos “convidam” a sua utilização. • A percepção está associada com aquilo que se pode fazer com o objeto © Jair C Leite
  • 41. Fenômenos da percepção • Os slides a seguir mostram exemplos de fenômenos da percepção visual • Para saber mais veja – http://www.yorku.ca/eye/thejoy.htm © Jair C Leite
  • 42. Ilusão de ótica © Jair C Leite
  • 43. Ilusão de Hering e Poggendorff As linhas vermelhas são retas? As duas linhas vermelhas formam uma reta? Temos um ou dois círculos? © Jair C Leite
  • 44. Ilusão de Kanizsa Nenhum triângulo foi desenhado aqui. © Jair C Leite
  • 45. Ilusão de movimento aparente © Jair C Leite
  • 46. Técnicas de visualização – profundidade • Tamanho – Objetos idênticos com tamanhos maiores parecem estar mais perto que o menores. • Interposição – Se um objeto está desenhado por cima de um outro, entende-se que o primeiro está a frente do segundo • Contraste, claridade e brilho – Objetos mais brilhantes e claros aparentam estar mais perto. • Sombras – Sombras podem ser utilizadas para indicar o posicionamento do objeto em relação a outros • Textura – Objetos com textura mais detalhada aparentam estar mais próximos © Jair C Leite
  • 47. Ilusão de perspectiva • Os cubos são todos do mesmo tamanho • As linhas criam a ilusão de perspectiva (3D) • O cérebro confunde o tamanho real com o tamanho esperado pela perspectiva © Jair C Leite
  • 48. Ilusão de perspectiva • A imagem do homem pequeno é a mesma que está no fundo do corredor! • Elas têm o mesmo tamanho © Jair C Leite
  • 49. Profundidade ambígua © Jair C Leite
  • 50. Distorção nas imagens Esta figura é formada apenas por retas horizontais e quadrados. © Jair C Leite