lafayette b. melo – cefet-pb - coinfo cor no design cor sensações da cores tipos de cores alguns...
TRANSCRIPT
![Page 1: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/1.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
Cor no design
Cor Sensações da cores
Tipos de coresAlguns termos técnicos
![Page 2: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/2.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• Você aplica algum princípio ou usa algum termo técnico relacionado a cores nos seus trabalhos?
• Como você escolhe as cores?
• Há alguma boa cor para um site?
![Page 3: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/3.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• A cor não tem existência material e é considerada muitas vezes como apenas um fenômeno da luz
• Os seus estudos passaram pela filosofia, pela arte, pela física, até chegar muito tempo depois ao design e à Internet
CORCOR
![Page 4: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/4.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• Em linguagem corrente, cor tanto designa sensação cromática, como o estímulo que a provoca– A rigor o estímulo é a matiz e a sensação a cor
• Para um estudo aprofundado de cores, seria necessário entender toda a teoria das cores, mas isso nos ajudaria a entender a Web?
• Qualquer estudo de cor, por mais que oriente e considere os efeitos psicológicos das cores, admite que as sensações de cor podem ser as mais diversas
SENSAÇÃO DAS CORESSENSAÇÃO DAS CORES
![Page 5: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/5.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• No entanto, há ainda divisões como
– Cores quentes: vermelhovermelho, amareloamarelo e laranjalaranja• Para sensações de agitação e euforia
– Cores frias: azul-turquesaazul-turquesa e violetavioleta• Para sensações calmas
– Cores acromáticas: branco, cinza e preto• Podem dar sensações quentes ou frias
– Cores marginais: verdeverde e magentamagenta• A sensação que provoca varia de acordo com o
que estiver ao redor
![Page 6: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/6.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• As cores podem surgir em síntese subtrativa ou aditiva
TIPOS DE CORESTIPOS DE CORES
![Page 7: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/7.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• Os efeitos luminosos das cores têm três grupos distintos:– Cores-luz (vermelho, verde e azul)– Cores-pigmento opacas (vermelho, amarelo e azul)– Cores-pigmento transparentes (magenta, amarelo e
ciano)
![Page 8: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/8.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
![Page 9: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/9.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• CLASSIFICAÇÃO DAS CORES
• 1) Cor primária ou geratriz– Cada uma das cores indecomponíveis que, misturadas
em proporções variáveis, produzem todas as cores do espectro solar
• 2) Cor secundária– É aquela formada pela combinação de duas cores
primárias
• 3) Cor complementar– É a designação dada à cor secundária que em
justaposição com uma cor primária, complementa o espectro solar
![Page 10: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/10.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
![Page 11: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/11.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• Há ainda outras denominações e classificações importantes / curiosas:– Matiz– Valor ou brilho– Croma– Cor viva– Amarelo-canário– Azul-piscina– Verde-bandeira– …
![Page 12: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/12.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
– Valor ou brilho• Na legibilidade geral de qualquer imagem, página
ou composição• DICAS: não posicionar informações importantes
em áreas escuras, ver diferentes plataformas, testar o monitor com escala de cinza
ALGUNS TERMOS TÉCNICOSALGUNS TERMOS TÉCNICOS
![Page 13: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/13.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• Brilho e contraste– Contrastes baixos podem ser difíceis de ler– O segundo plano precisa contrastar com o valor do texto– O texto com um segundo plano de granulação de contraste alto
pode ser difícil de ler
– DICAS:• Escolher valor similar para as cores dentro do quadro de
imagem (contraste claro / escuro)• Torne o texto mais largo para que o sólido seja lido em
contraste com o granulado• Em vez de usar HTML, lembre-se de fazer seu texto uma
imagem
![Page 14: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/14.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• Saturação– Medida da intensidade da cor– A saturação total é preto ou branco– Quanto menos saturada a cor no computador mais próximo do
cinza se torna
– DICAS:• Utilizar saturação como dispositivo de “interesse”ou para chamar
atenção para um texto, botão ou elemento• Separar itens na tela por saturação contrastante
![Page 15: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/15.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• Textura e granulação– Se a textura tiver muito contraste e granulações evidentes, o
texto em tamanhos normais tende a se perder
1.5 Mb
2560 x 1920
ornate grand gateway
1.5 Mb
2560 x 1920
ornate grand gateway
1.1 Mb
1920 x 2560
traditional doorway
![Page 16: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/16.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• Relativização de cores– Que cor você vê abaixo?
– Que cor você vê no centro?
![Page 17: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/17.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• Observações em relação à cor Web X Impressa
– O padrão CMYK, diferentemente do RGB, trabalha com peças “de processo de quatro cores” translúcidas
– CMYK é refletiva (luz do sol e reflexão do objeto)– Spot color (“tinta na lata”) não está impressa nem na
Web– RGB é a junção de milhares de combinações de luzes– As intensidades, matiz e brilho em RGB possuem
valores de 0 a 255– HTML traduz sua cor para hexadecimal– Uma cor indexada é uma paleta de cores limitadas
de cores RGB– Monitores dependem da configuração e browsers
podem utilizar “cores seguras”
![Page 18: Lafayette B. Melo – CEFET-PB - COINFO Cor no design Cor Sensações da cores Tipos de cores Alguns termos técnicos](https://reader037.vdocuments.pub/reader037/viewer/2022100309/552fc111497959413d8c6686/html5/thumbnails/18.jpg)
Lafayette B. Melo – CEFET-PB - COINFOLafayette B. Melo – CEFET-PB - COINFO
• Analise um trabalho de um colega seu, algo que você fez ou um site na Internet quanto a todos os termos técnicos relacionados à cor no design (sensações provocadas, brilho, contraste, saturação etc).
Tarefa