cores prof. roberto cabral de mello borges dez/2001
TRANSCRIPT
![Page 1: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/1.jpg)
Cores
Prof. Roberto Cabral de Mello Borges
Dez/2001
![Page 2: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/2.jpg)
Amarelo-Laranja AL
Amarelo
AM Amarelo-VerdeAV
VerdeVD
Azul-VerdeAV
AzulAZ
Azul-VioletaAV
Violeta
VTMagenta
MG
Vermelho
VM
Laranja LJ
Laranja-Vermelho
LV
CORES
![Page 3: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/3.jpg)
Olho Humano
![Page 4: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/4.jpg)
Cones e Bastonetes
![Page 5: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/5.jpg)
Cones e Bastonetes• S - Short Wavelength
• M - Medium
• L - Long
![Page 6: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/6.jpg)
Cones
![Page 7: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/7.jpg)
Caminho da Visão
![Page 8: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/8.jpg)
![Page 9: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/9.jpg)
Espectro de Cores Visíveis
400 500 600 700
Luz Visível
Ultra Violeta
Infra Vermelho
Vio
leta
Azu
l
Ve
rde
Am
are
lo
La
ran
ja
Ve
rme
lho
Comprimento de Onda (milimicrons - mµ)
![Page 10: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/10.jpg)
Sensibilidade das Cores
400 700440 500 570 590 610
![Page 11: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/11.jpg)
Ponto de foco das 3 cores básicas
AzulVerde
Vermelho
AzulVerde
Vermelho
Retina
Azul (é focado na frente da retina)Vermelho (é focado atrás da retina)
Verde (é focado sobre a retina)
![Page 12: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/12.jpg)
Sensibilidade do olho para cores
![Page 13: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/13.jpg)
Campo de Visão
30º
1
2 3
Área 1 - ConesÁrea 2 - Cones e BastonetesÁrea 3 - Bastonetes
![Page 14: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/14.jpg)
Adapta¨‹o ao Claro e ao Escuro do Olho Humano
Minutos
Sen
sib
ilid
ade
Rel
ativ
a
0,11
10100
100010000
1000001 11 21 31 41 51 61 71
Adaptação ao EscuroAdaptação ao Claro
Adaptação ao Escuro e ao Claro do Olho Humano
![Page 15: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/15.jpg)
Formato da tela
TV 3 x 4(0,75)
Slide: 2 x 3 (0,67)
HDTV 3 x 5(0,6)
Ideal (Relação de Ouro)
3 x 4,854(0,618)
![Page 16: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/16.jpg)
Contraste de Cores
![Page 17: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/17.jpg)
Contraste de Cores
Cores da tela anterior convertidas para preto e branco
![Page 18: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/18.jpg)
Contraste de Cores
• Qual dos vermelhos é mais brilhante?
![Page 19: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/19.jpg)
Uso de cores
• Cores: adicionam impacto, interesse e informação a documentos e gráficos;
• as cores nem sempre são mostradas da mesma maneira como foram projetadas, diferindo de um dispositivo para outro;
• vários fatores envolvidos na geração das cores: iluminação, contraste, forças magnéticas, brilho, entre outros;
• a cor é parte importante na interface gráfica;
• é a primeira coisa que os usuários observam no aplicativo, mesmo antes de utilizá-lo.
![Page 20: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/20.jpg)
WatermarkContraste 16%Contraste 87%
Brilho 23%Brilho 83%Normal
NormalContraste: 50%
Brilho: 50%
![Page 21: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/21.jpg)
Uso de cores• A cor é um importante auxiliar no processo de
comunicação:– enfatiza informações importantes
– identifica estruturas e subdivisões
– retrata objetos naturais de forma realista
– visualiza o tempo e o progresso de uma operação
– reduz erros de interpretação
– aumenta a compreensão
– aumenta a credibilidade e a aparência
– visando o processo de aprendizado, a cor é mais eficiente do que o preto/branco
– propicia melhor captação de memória
![Page 22: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/22.jpg)
Ilusão de Óptica
• O que você vê nesta imagem?
• Um careca com a mão no peito?
• Ou um casal de camponeses na rua e um cachorro deitado na rua?
![Page 23: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/23.jpg)
Usando cores• Dificuldades podem ser apontadas:
– algumas cores podem causar desconforto visual e produzir o efeito de persistência (afterimage)
– a cor pode contribuir para confusão visual ou criar associações negativas
– diminuição da acuidade visual (miopia temporária), mecanismos de acomodação, alterações na adaptação da seleção de cores
– Estes fatores contribuem ao aparente efeito de profundidade das cores:
–Cromostereopsia é o fenômeno onde os tons azuis parecem estar um pouco mais longe enquanto que os vermelhos parecem avançar.
![Page 24: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/24.jpg)
Efeito de Profundidade
• Qual a cor que parece estar no primeiro plano e qual a do segundo plano?
![Page 25: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/25.jpg)
Uso de coresPrincípios gerais
– Simplicidade» Usar poucas cores (2 a 7); é mais fácil de dominar e mais simples
de distinguir em monitores de menor qualidade ou preto e branco
– Não associar muitas cores para serem lembradas» Não usar mais de cinco cores quando estas possuírem
significado
» Significados mais populares: • vermelho para Pare e verde para Seguir• Cinza para HomePages, branco para Texto, verde para Apresentações e
amarelo para Planilhas
– Cores para primeiro e segundo planos» Usar sempre pares complementares para garantir legibilidade.
Por exemplo, cores que forneçam o branco, como amarelo e azul
» Contraste: não usar cores que sejam ambas claras ou escuras
![Page 26: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/26.jpg)
Uso de cores• Princípios gerais
– Manter as associações comuns» Vermelho: significa perigo, erro, pare, fogo ou altas
temperaturas
» Amarelo: significa cuidado, aviso, atenção
» Azul: significa frio, água
– Cores opostas» Se vermelho é Pare, o oposto é verde
» Se vermelho é Quente, o oposto é azul
– Diferenças culturais na associação de cores» Alguns países tem cores associadas a alguns objetos e fatos:
• Egito: amarelo é a cor da alegria e prosperidade
• Inglaterra: caixas de correio são vermelhas, nos EUA são azuis, na Grécia são verdes e no Brasil são amarelas
![Page 27: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/27.jpg)
Uso de cores
• Cores e tamanho–Cores são difíceis de distinguir em
pequenas áreas. Por exemplo letras pequenas em azul próximas a letras pequenas em preto
–Cores brilhantes parecem maiores
–Cores escuras sobre fundo claro oferecem maior legibilidade
![Page 28: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/28.jpg)
– a sensação é o efeito psico-fisiológico sentido pelo ser humano
– cada cor tem uma sensação associada e o uso inadequado da cor pode prejudicar a comunicação visual numa tela
– a sensação também pode variar em função do contraste, isto é, a cor de um texto ou objeto pode ter sensação diferente conforme a cor do fundo da tela
– algumas cores podem ser usadas apenas em alertas ou pequenos espaços; é o caso do vermelho, do preto e do roxo/violeta
– As cores exercem uma potente ação sobre os sentimentos e esta força real pode ser aproveitada com fins de melhorar as funcionalidades e produtividade.
Efeitos Psicológicos das Cores
![Page 29: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/29.jpg)
Sensação de cores
–Cores quentes e frias»cores quentes ou luminosas: amarelo,
laranja, vermelho e violeta
»cores frias ou sombrias: azul, turquesa, verde-mar e verde-alface
![Page 30: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/30.jpg)
Sensação das cores
• Vermelho:–é estimulante mental, aumenta a tensão
muscular, a pressão sangüínea e o ritmo respiratório
–é uma cor quente e que cansa rapidamente
–está associada ao fogo
![Page 31: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/31.jpg)
–Amarelo:» estimulante mental, indicado para situações de calma
e reflexão
» diminui a fadiga visual, tendo ação calmante sobre o sistema nervoso
» é a cor de maior intensidade
» letreiro preto sobre fundo amarelo âmbar é a combinação que dá melhor contraste visual (é uma das poucas cores que tem a mesma visibilidade na inversão do fundo: letreiro amarelo e fundo preto)
Sensação das cores
![Page 32: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/32.jpg)
–Azul» é calmante do sistema nervosos para pessoas
emotivas
» diminui o ritmo respiratório, por baixar a tensão muscular e a pressão sangüínea
» o excesso de exposição ao azul causa fadiga ou depressão
» inspira paz e a introspecção
» dá a sensação de amplitude, como ocorre com as outras cores frias
Sensação das cores
![Page 33: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/33.jpg)
–Verde» tem destacado efeito calmante, dilatando os
capilares, abaixando a pressão sangüínea
» é eficaz contra a irritabilidade nervosa, a fadiga e a insônia
» é uma cor fria
» é a mais repousante das cores
» simboliza a segurança, a continuidade e a natureza
Sensação das cores
![Page 34: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/34.jpg)
–Laranja:» aumenta a emotividade e acelera as pulsações,
ligeiramente
» dá a sensação de bem estar e alegria
» combina a intensidade e vitalidade do vermelho, com a alta visibilidade do amarelo
» é uma cor quente, muito luminosa e pouco fatigante
» é a representação direta do sol
Sensação das cores
![Page 35: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/35.jpg)
–violeta:»é uma cor fria, porém em tons avermelhados
ou púrpura é quente
»apesar de ser deprimente quando empregada só, torna-se calmante quando em conjunto com outras cores
Sensação das cores
![Page 36: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/36.jpg)
–Branco:» é símbolo de pureza e de paz
» em monitores é a cor que mais produz luz na tela
–Preto:» é deprimente quando usada só
» serve para marcar contrastes, especialmente com o amarelo e o branco
Sensação das cores
![Page 37: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/37.jpg)
Usando cores• Lembrar sempre que cores mal
utilizadas são piores que não usar nenhuma!
• Alguns exemplos:
TextoTextoTexto
TextoTextoTexto
![Page 38: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/38.jpg)
Padrões de cores usados em computadores:
• sistemas de representação de cores:–dependem do tipo de dispositivo a ser
utilizado
–aditivos (dispositivos que emitem luz)
–subtrativos (dispositivos de impressão)
–os mais utilizados são: RGB, HSV e HLS (aditivos) e CYMK (subtrativo)
![Page 39: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/39.jpg)
Sistemas Aditivo e Subtrativo
![Page 40: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/40.jpg)
Sistema RGB (Red Green Blue)
![Page 41: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/41.jpg)
Sistema RGB (Red Green Blue)
![Page 42: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/42.jpg)
Sistema CYMK (Cyan Yellow Magenta blacK)
![Page 43: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/43.jpg)
• Modelo CMYK–composto pelas cores Ciano, Magenta,
Amarelo e Preto (Cyan, Magenta, Yellow e blacK)
–modelo subtrativo porque suas cores subtraem da luz branca sua cor
–o subconjunto do sistema de coordenadas cartesianas é o mesmo que o RGB, exceto pelo branco (luz total) que está na origem do sistema
Sistema subtrativo de cores
![Page 44: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/44.jpg)
• Utilizado em dispositivos de impressão, depositando pigmentos coloridos sobre o papel
• a cor ciano subtrai vermelho da luz branca refletida (ciano é branco menos o vermelho)
• o magenta absorve o verde (ele é vermelho mais azul)
• o amarelo absorve o azul (ele é vermelho mais verde)
• uma superfície coberta com ciano e amarelo absorve vermelho e azul refletindo apenas verde
Sistema subtrativo de cores
![Page 45: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/45.jpg)
Sistema CMYK (Cyan Magenta Yellow blacK)
![Page 46: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/46.jpg)
Sistema HTML (#RRGGBB)
![Page 47: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/47.jpg)
Sistema HSV (Hue Saturation Value)
![Page 48: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/48.jpg)
Sistema Crayon
![Page 49: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/49.jpg)
• Cores complementares
– A cor complementar de uma cor quente é uma cor fria e vice-versa
– colocar uma cor junto com a sua complementar ocasionará a harmonia.
– Exemplo: uma rosa em um roseiral destaca-se mais entre as folhas verdes do que isolada
Harmonia das CoresAmarelo
AM
AzulAZ
Vermelho
VM
![Page 50: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/50.jpg)
Cores Complementares:• Vermelho - Ciano (azul
piscina)
• Verde - Magenta (lilás)
• Azul - Amarelo
Harmonia das Cores
Amarelo-LaranjaAL
Amarelo
AM Amarelo-VerdeAV
VerdeVD
Azul-VerdeAV
AzulAZ
Azul-VioletaAV
Violeta
VTMagenta
MGVermelho
VM
Laranja LJ
Laranja-Vermelho
LV
![Page 51: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/51.jpg)
• Harmonia das cores análogas ou vizinhas: quando emprega-se uma cor e suas vizinhas ou apenas uma delas. Ex.: laranja com o vermelho e amarelo ou só com o vermelho ou só com o amarelo. É recomendável colorir a superfície maior com a cor mais clara
Harmonia das Cores
Amarelo-LaranjaAL
AmareloAM Amarelo-Verde
AV
![Page 52: Cores Prof. Roberto Cabral de Mello Borges Dez/2001](https://reader036.vdocuments.net/reader036/viewer/2022062318/552fc104497959413d8bf8b4/html5/thumbnails/52.jpg)
• Harmonia monocromática ou de cor dominante: consiste em usar somente uma cor e aplicá-la pura e em vários tons, claros e escuros ou empregados em conjunto
• Em qualquer harmonia pode-se usar pura, uma cor neutra, obtendo-se realce no emprego do preto e branco
• O preto e o branco puros permitem a realização de harmonia de contraste
Amarelo
AM
Harmonia das Cores