UNIDADE DE APRENDIZADO 2

Cores
BCA 2.1 - Psicologia das cores BCA 2.2 - Estudos sobre a cor a) Cor e percepo b) Teoria das cores c) Disco cromtico d) Parmetros da cor BCA 2.3 - Esquemas de cores a) Harmonia b) Contraste BCA 2.4 - Paletas de cores para web a) Sobre as cores em tela

56

UA 2

| BCA 2.1 | Psicologia das cores

UA2 - Cores
OBJETIVOS Apresentar a psicologia envolvida no trabalho com cores Discutir teorias e estudos sobre as cores Apresentar esquemas de combinao de cores Estudar a utilizao de cores na WEB

57

UA 2

| BCA 2.1 | Psicologia das cores

UNIDADE DE APRENDIZADO 2

Cores
BCA 2.1 - Psicologia das cores BCA 2.2 - Estudos sobre a cor a) Cor e percepo b) Teoria das cores c) Disco cromtico d) Parmetros da cor BCA 2.3 - Esquemas de cores a) Harmonia b) Contraste BCA 2.4 - Paletas de cores para web a) Sobre as cores em tela

58

UA 2

| BCA 2.1 | Psicologia das cores

Cores
Escolher cores no uma tarefa simples. necessrio observar aspectos estticos, pensar na identidade que estamos representando e levar em conta conceitos de usabilidade. Ainda necessrio considerar que os displays podem apresentar at 16 milhes de cores, logo, um nmero infinito de combinaes estranhas pode ocorrer! Existem, felizmente, conhecimentos de que se pode lanar mo para a composio com cores: como estudos sobre psicologia das cores e as teorias largamente desenvolvidas sobre uso e combinao de cores.

59

UA 2

| BCA 2.1 | Psicologia das cores

Psicologia das cores

uma rea de estudo que analisa os efeitos emocionais e comportamentais produzidos pelas cores e suas combinaes. A idia de que existe um nico modo de perceber as cores equivocada. A relao das pessoas com as cores individual e culturas diferentes desenvolvem associaes bastante diferentes em relao s cores.

60

UA 2

| BCA 2.1 | Psicologia das cores

Vale a pena conhecer algumas associaes psicolgicas que a maioria das pessoas, na cultura ocidental, desenvolve com algumas cores. Vermelho: paixo ou morte?

61

UA 2

| BCA 2.1 | Psicologia das cores

BRANCO
Paz, pureza, batismo, casamento, hospital, neve, frio, palidez, vulnerabilidade, dignidade, divindade, harmonia, inocncia etc.

62

UA 2

| BCA 2.1 | Psicologia das cores

PRETO
Medo, morte, maldio, pessimismo, negao, tristeza, opresso, dor etc. Na publicidade, o preto esta associado nobreza e seriedade. Na moda o preto associado elegncia.

63

UA 2

| BCA 2.1 | Psicologia das cores

VERMELHO
Guerra, sangue, perigo, vida, fogo, mulher, conquista, masculinidade, paixo, fora, energia, movimento, violncia, excitao, emoo, ao, etc. uma cor muito atrativa. Rosas vermelhas simbolizam o amor.

64

UA 2

| BCA 2.1 | Psicologia das cores

LARANJA
Outono, pr-do-sol, calor, luz, raios, robustez, euforia, alegria, apetite, prazer, senso de humor e etc. Muito usada em embalagens de alimentos.

65

UA 2

| BCA 2.1 | Psicologia das cores

AMARELO
Ouro, sol, calor, palha, luz, vero, conforto, idealismo, espontaneidade, euforia, alegria, expectativa etc.

66

UA 2

| BCA 2.1 | Psicologia das cores

VERDE
Natureza, floresta, folhas, mar, vida, bem-estar, tranqilidade, segurana, liberdade, juventude, firmeza, coragem, esperana etc. Dependendo da tonalidade o verde pode estar associado energia. Ex: guaran (caso do Guaran Antrtica), etc.

67

UA 2

| BCA 2.1 | Psicologia das cores

AZUL
Cu, frio, mar, tranqilidade, espao, fantasia, infinito, afeto e serenidade. Dependendo da tonalidade, sobriedade, serenidade e credibilidade.

68

UA 2

| BCA 2.1 | Psicologia das cores

ROXO
F, penitncia, sonho, mistrio, dignidade, egosmo, grandeza, espiritualismo, sexualidade etc.

69

UA 2

| BCA 2.1 | Psicologia das cores

MARROM
Chocolate, caf, terra, frio, melancolia, sensualidade e tambm certo desconforto. Se combinada com o dourado, o creme, o bege ou o vinho, pode demonstrar elegncia e requinte.

70

UA 2

| BCA 2.1 | Psicologia das cores

ROSA
Feminilidade, criana, calma, afeto, delicadeza, inocncia.

71

UA 2

| BCA 2.1 | Psicologia das cores

UNIDADE DE APRENDIZADO 2

Cores
BCA 2.1 - Psicologia das cores BCA 2.2 - Estudos sobre a cor a) Cor e percepo b) Teoria das cores c) Disco cromtico d) Parmetros da cor BCA 2.3 - Esquemas de cores a) Harmonia b) Contraste BCA 2.4 - Paletas de cores para web a) Sobre as cores em tela

72

UA 2

| BCA 2.1 | Psicologia das cores

BCA 2.2 - Estudos sobre a cor

Tanto no plano fsico quanto metafrico, a cor resulta em intenso estmulo perceptivo. Na sua forma fisiolgica primeira, ela a sensao produzida nos cones e bastonetes da retina por ondas de luz de diferentes comprimentos. No seu aspecto psicolgico e/ou potico, pode suscitar reaes diferentes, envolvendo sensaes de calor ou frio e revigorantes sensaes de luz e espao.

73

UA 2

| BCA 2.2 | Estudos sobre a cor

Na comunicao visual a cor pode servir a vrios objetivos: 1. Como linguagem em produes visuais, as solues cromticas constituem objeto de manipulao e produo de significado; 2. No sentido mimtico, a cor pode ser usada para simular realidades visveis, a cor das coisas ou as luzes da paisagem e nesse caso ela opera como representaes.

74

UA 2

| BCA 2.2 | Estudos sobre a cor

COR E PERCEPO
No existem cores reais na natureza - o que existe so vrios comprimentos de onda que compem a luz branca, os quais so absorvidos, refletidos ou refratados por todos os objetos a nossa volta. Os comprimentos de ondas refletidas penetram em nossos olhos, que enviam sinais ao crebro e assim percebemos o fenmeno cromtico.

75

UA 2

| BCA 2.2 | Estudos sobre a cor

A grande contribuio para o nosso entendimento do fenmeno cromtico foi realizada pelo cientista Isaac Newton, em 1666. Newton descobriu que quando um raio de luz solar separado atravs de um prisma triangular seus raios revelam todas as cores do arcoris. Em seu livro ptica, de 1704, ele identificou as cores desse espectro como vermelho, laranja, amarelo, verde, azul, anil e violeta. Essas luzes coloridas, quando recombinadas, podem reconstituir a luz branca.

76

UA 2

| BCA 2.2 | Estudos sobre a cor

Teoria das cores - COR LUZ

Os estmulos que causam as sensaes cromticas provocadas pela ao da luz sobre o rgo da viso esto divididos em dois grupos: o das cores luz e das cores pigmentos. COR-LUZ OU LUZ COLORIDA a radiao visvel que tem com como sntese aditiva a luz branca. Sua melhor expresso a luz solar por reunir de forma equilibrada todos os matizes da natureza.

77

UA 2

| BCA 2.2 | Estudos sobre a cor

COR PIGMENTO
a substncia material que, conforme sua natureza, absorve, refrata ou reflete os raios luminosos. Comumente chamamos cores-pigmento o grupo das cores qumicas. Segundo Goethe as cores qumicas so aquelas que podemos criar. Podem ser divididas em: cor pigmento opaca (mistura) cor pigmento transparente.
Cores-pigmento opacas

Uma cor pigmento tem como sntese subtrativa o preto.

78

UA 2

| BCA 2.2 | Estudos sobre a cor

CLASSIFICAO DAS CORES

COR GERATRIZ OU PRIMRIA: cada uma das trs cores indecomponveis que, misturadas em propores variveis, produzem todas as demais, em cada modelo de representao da cor.

79

UA 2

| BCA 2.2 | Estudos sobre a cor

Cores-luz PRIMRIAS
Em COR-LUZ as cores primrias so:

Modelo RGB sntese aditiva

80

UA 2

| BCA 2.2 | Estudos sobre a cor

Cores-pigmento
A trade CMY (magenta, amarelo e ciano) encontra maior rendimento em preciso cromtica nas emulses transparentes (pelculas fotogrficas, impresses grficas, aquarelas etc.). Da a denominao cores-pigmento transparentes, em oposio outra trade de corespigmento, que chamamos de opacas (tmpera, encustica, leo, etc.)

81

UA 2

| BCA 2.2 | Estudos sobre a cor

Cores-pigmento transparentes PRIMRIAS

Em COR-PIGMENTO TRANSPARENTE as cores primrias so:

Modelo CMY sintese subtrativa

82

UA 2

| BCA 2.2 | Estudos sobre a cor

Cores-pigmento opacas PRIMRIAS

Em COR-PIGMENTO OPACA as cores primrias so:

Modelo artstico sntese subtrativa

83

UA 2

| BCA 2.2 | Estudos sobre a cor

Disco cromtico
Para melhor dispor e estabelecer relaes entre cores utiliza-se o disco cromtico, ou crculo cromtico. Se traarmos uma linha vertical poderemos perceber que do lado direito as cores so vivas e marcantes. So as chamadas cores quentes. J do lado esquerdo, as cores transmitem mais tranqilidade e calma. So as chamadas cores frias.

84

UA 2

| BCA 2.2 | Estudos sobre a cor

COR SECUNDRIA - a cor formada pelo equilbrio ptico a partir das duas primrias que lhe do origem. Pode ser conseguida por mistura, puno ou rotao de propores iguais. COR TERCIRIA - a intermediria entre uma cor secundria e qualquer uma das primrias que lhe deu origem.

85

UA 2

| BCA 2.2 | Estudos sobre a cor

CORES COMPLEMENTARES - so aquelas cuja mistura produz o branco em cor-luz e o preto em cor pigmento. Encontram-se sempre em posies opostas no disco cromtico CORES QUENTES - so o vermelho e o amarelo e as demais cores em que eles predominam. Sugerem expanso visual. CORES FRIAS - so o azul e o verde e as outras cores em que eles predominam. Em geral indicam concentrao espacial.

86

UA 2

| BCA 2.2 | Estudos sobre a cor

PARMETROS DA COR - Matiz

Matiz
Podemos identificar e avaliar uma cor a partir de um conjunto de fatores condicionantes. Quando pensamos o atributo qualitativo de uma cor, ou seja, aquilo que identifica uma cor (o seu comprimento de onda) estamos falando de matiz. O matiz a cor em si, a especificidade da cor. O nvel de saturao de uma cor est ligado ao seu grau de pureza. A cor saturada aquela que apresenta o mximo de fora perceptiva (no contm cinza nem outras cores).

87

UA 2

| BCA 2.2 | Estudos sobre a cor

PARMETROS DA COR - Valor

Luminosidade ou valor
O valor de uma cor refere-se ao seu ndice de luminosidade, e pode ser observado atravs do acrscimo de preto e branco a um determinado matiz. o efeito produzido pela suavizao ou escurecimento de uma cor pigmento pela adio do branco ou do preto. Chamamos de luminosidade a capacidade que possui qualquer cor de refletir a luz branca que h na sua composio (temos ndices de luminncia ou refletncia). Dentro do crculo cromtico, o amarelo a cor de maior luminncia e o violeta a de menor.

88

UA 2

| BCA 2.2 | Estudos sobre a cor

PARMETROS DA COR - Saturao

Saturao
Refere-se ao grau de pureza de uma cor e mede-se com relao ao cinza. As cores muito saturadas possuem maior grau de pureza e apresentam-se com mais intensidade luminosa em relao com seu valor. As cores com menor saturao mostram-se mais acinzentadas, com maior quantidade de impurezas e com menor intensidade luminosa.

89

UA 2

| BCA 2.2 | Estudos sobre a cor

UNIDADE DE APRENDIZADO 2

Cores
BCA 2.1 - Psicologia das cores BCA 2.2 - Estudos sobre a cor a) Cor e percepo b) Teoria das cores c) Disco cromtico d) Parmetros da cor BCA 2.3 - Esquemas de cores a) Harmonia b) Contraste BCA 2.4 - Paletas de cores para web a) Sobre as cores em tela

90

UA 2

| BCA 2.3 | Esquemas de cores

BCA 2.3 Esquemas de cores

HARMONIA E CONTRASTE
Uma vez sabendo sobre valores, intensidades, associaes psicolgicas, temperaturas e localizaes no disco cromtico j possvel trabalhar com cores. necessrio agora estudar algumas estratgias para compor projetos utilizando as cores de maneira a atrair um pblico especfico. Os esquemas de cores auxiliam na escolha de uma efetiva composio harmoniosa ou constrastante conforme o desejado. Antes de mais nada necessrio escolher uma cor base que esteja de acordo com os propsitos do projeto. Para tal possvel lanar mo dos conceitos j vistos sobre psicologia das cores.. Vejamos inicialmente o que uma composio harmoniosa.

91

UA 2

| BCA 2.3 | Esquemas de cores

Combinao harmnica
a justa relao de duas ou mais cores. a busca de composio policrmica, tranqila e agradvel.
(Ribeiro, 2003: 199)

quando cada uma delas tem uma parte de cor comum em todas as demais.
(Ribeiro, 2003: 199)

92

UA 2

| BCA 2.3 | Esquemas de cores

Combinao harmnica
1. 2. 3. 4. Harmonia monocromtica Harmonia de cores anlogas Harmonia tridica Harmonia de contraste
a) b) c) Complementares simples Complementar contgua (split complementary) Dupla complementaridade (tetrdica)

93

UA 2

| BCA 2.3 | Esquemas de cores

1 - Harmonia monocromtica
a harmonia entre diferentes saturaes e luminosidades de uma mesma cor.

94

UA 2

| BCA 2.3 | Esquemas de cores

2 - Harmonia de cores anlogas

a harmonia de cores vizinhas no crculo cromtico. Formadas, principalmente, por diferentes graus de intensidade.
(Ribeiro, 2003: 199)

95

UA 2

| BCA 2.3 | Esquemas de cores

3 - Harmonia tridica
Na harmonia tridica, so usadas trs cores eqidistantes no crculo das cores. Um tringulo eqiltero dentro do crculo das cores indica quais so elas. Imagine um triangulo eqiltero sobre o crculo cromtico e utilize as cores sob os vrtices.

96

UA 2

| BCA 2.3 | Esquemas de cores

4 - Harmonia de contraste
Resulta da justaposio de cores opostas no crculo cromtico.
(Ribeiro, 2003: 199)

A mais caracterstica das harmonias de contraste obtida pela combinao das cores complementares.
(Ribeiro, 2003: 199)

97

UA 2

| BCA 2.3 | Esquemas de cores

4a - Harmonia por complementariedade simples

O mais contrastante o de duas complementares empregadas sem modulaes intermedirias. Acrescenta luminosidade cor. Para diminuir o impacto, pode-se quebrar uma das duas cores com preto ou com uma pequena parte da complementar

98

UA 2

| BCA 2.3 | Esquemas de cores

4b- Harmonia por complementariedade contgua split complementary

Formada por duas cores anlogas e uma terceira oposta a elas no crculo cromtico Vale a pena determinar qual ser a cor predominante.

99

UA 2

| BCA 2.3 | Esquemas de cores

4c - Harmonia por dupla complementariedade - tetrdica

Dois pares de cores complementares dispostos em oposio no crculo cromtico. Duas duplas de cores complementares entre si. Esquema de cores bastante radical pois apresenta um alto grau de contraste.

100

UA 2

| BCA 2.3 | Esquemas de cores

CONTRASTES CROMTICOS
A palavra contraste est relacionada organizao de elementos desiguais. a diferena ou o grau de diferena entre objetos de naturezas comparveis. As cores so completamente diversas, contudo sua aproximao no deve produzir efeitos desagradveis, inspidos ou demasiadamente bruscos. (Ribeiro, 2003: 199) O autor Johannes Itten (Professor da Bauhaus) props sete tipos de contrastes:

1. 2. 3. 4. 5. 6. 7.
101

Contraste de matiz - cor em si Contraste de claro e escuro ou contraste de valor Contraste de temperatura Contraste de qualidade ou saturao Contraste de quantidade Contrastes simultneos Contraste entre complementares
UA 2
| BCA 2.3 | Esquemas de cores

1 - Contraste de matiz
Contraste entre matizes puros. O contraste entre as cores da trade primria e/ ou secundria um exemplo de contraste de matiz. Nenhuma delas se destaca.

102

UA 2

| BCA 2.3 | Esquemas de cores

2 - Contraste claro escuro ou de valor

Contraste simples e fundamental entre claro/escuro, preto/branco. Tambm funciona no modelo monocromtico de cores.

103

UA 2

| BCA 2.3 | Esquemas de cores

3 - Contraste de temperatura
Contraste evidente, pois diz respeito temperatura da cor. Numa composio quente/ fria, geralmente as cores frias parecem recuar e as quentes parecem avanar avanam para o primeiro plano. Equilbrio proporcionado entre a superfcie ocupada pelas cores e seu grau de calor. Cores quentes Cores frias

104

UA 2

| BCA 2.3 | Esquemas de cores

4 - Contraste de qualidade ou saturao

Ligada ao grau de pureza ou saturao da cor. Quando uma cor clareada, atravs do branco (menos saturao) ou escurecida, atravs do preto (menos brilho), ela perde seu grau de pureza ou valor. Ocorre quando posicionamos mesclas, nuanas e tonalidades de uma nica cor prximas umas das outras. o mais sutil dos contrastes.

105

UA 2

| BCA 2.3 | Esquemas de cores

5 - Contraste de quantidade
Contraste relacionado com as pores de cor utilizadas na organizao do espao cromtico em reas maiores e menores. Procura-se o equilbrio entre as cores, o que depende diretamente de dois aspectos: dimenso e luminosidade da cor.

106

UA 2

| BCA 2.3 | Esquemas de cores

6 - Contrastes simultneos
Esto relacionados com o contraste de complementares. Ocorrem em funo de um fenmeno de compensao que se d na retina e faz com que o aparato visual produza sobre uma cor a sombra de sua complementar. Essas sombras alteram a percepo das cores quando em presena de outras. Os contrastes simultneos estaro sempre presentes numa composio de mais de uma cor.

No quadrado cinza esquerda, o efeito do contraste simultneo reforado, pois foi adicionado a ele um pouco de azul. O quadrado central possui o tom o cinza neutro, nele o efeito do contaste simultneo est presente, entretanto no reforado nem anulado. No quadrado direita, o efeito do contraste simultneo anulado, pois foi adicionado a ele um pouco de laranja.

107

UA 2

| BCA 2.3 | Esquemas de cores

7 - Contraste entre complementares

o mais intenso de todos os contrastes. As complementares tm uma natureza altamente polarizada, pois so criadas a partir de propores exatamente opostas s cores primrias. Sua interao muito forte e pode muitas vezes perturbar a legibilidade de um texto. Ex: ciano e vermelho; verde e magenta; amarelo e roxo.

108

UA 2

| BCA 2.3 | Esquemas de cores

Influncia do entorno
Se duas cores diferentes so aproximadas, a relao entre elas se modifica e o potencial de iluses aumenta. A lei dos contrastes simultneos de Chevreul, demonstra que duas superfcies coloridas em justaposio exibiro duas modificaes: de valor e de tom. Portanto, fcil deduzir que duas cores justapostas, uma quente e outra fria, se exaltam reciprocamente.

109

UA 2

| BCA 2.3 | Esquemas de cores

UNIDADE DE APRENDIZADO 2

Cores
BCA 2.1 - Psicologia das cores BCA 2.2 - Estudos sobre a cor a) Cor e percepo b) Teoria das cores c) Disco cromtico d) Parmetros da cor BCA 2.3 - Esquemas de cores a) Harmonia b) Contraste BCA 2.4 - Paletas de cores para web a) Sobre as cores em tela

110

UA 2

| BCA 2.4 | Paletas de cores para web

BCA 2.4 Paletas de cores para web

Para que criar uma paleta se j escolhemos o esquema de cores? Um esquema de cores pode oferecer no mximo quatro cores para trabalhar. Mesmo que utilizar uma paleta com poucas cores seja exemplo de elegncia, ser necessrio utilizar ao menos algumas outras para projetar um web site. Ao criar uma paleta de cores temos a certeza de que estamos dando mais unidade ao projeto e, a partir dela, fica mais fcil escolher as cores durante o processo de desenvolvimento..

111

UA 2

| BCA 2.4 | Paletas de cores para web

Sobre as cores em tela

Voc j sabe que os computadores trabalham com trs cores bsicas, a partir das quais constroem todas as demais, mediante um processo de mistura por unidades de pixels. Estas cores so o vermelho, o azul e o verde. O sistema definido conhecido como sistema RGB (Red, Green, Blue). Cada pixel tem reservada uma posio na memria do computador para armazenar a informao sobre a cor que deve apresentar. Os bits de profundidade de cor marcam quantos bits de informao dispomos para armazenar o nmero da cor associada, segundo a paleta usada. Com esta informao, a laca de vdeo do computador gera sinais de voltagem adequados para representar a cor correspondente no monitor.

112

UA 2

| BCA 2.4 | Paletas de cores para web

Quanto mais bits por pixel, maior o nmero de variaes de uma cor primria podemos ter. Para 256 cores precisa-se de 8 bits (sistema bsico); para obter milhares de cores necessita-se 16 bits (cor de alta densidade) e para obter milhes de cores ser necessrio 24 bits (cor prxima ao que v o olho humano). Existe tambm outra profundidade de cor, 32 bits, porm com ela no se consegue mais cores, e sim uma visualizao mais rpida das que usamos, j que para o processador mais fcil trabalhar com registros em potncia de 2 (lembremos que computadores trabalham com nmeros binrios).

113

UA 2

| BCA 2.4 | Paletas de cores para web

Quanto maior for o nmero de cores, maior ser a quantidade de memria necessria para armazen-los e maiores os recursos necessrios para process-los. Por este motivo, os computadores antigos dispem de paletas de poucas cores, normalmente 256, por no terem capacidade para manejar mais sem uma perda notvel de prestaes. Para representar uma cor no sistema RGB utilizam-se duas formas de codificao diferentes, a decimal e a hexadecimal, correspondendo os diferentes valores com a porcentagem de cada cor bsica que tem uma cor determinada. Por exemplo, um vermelho puro (100% de vermelho, 0% de verde e 0% de azul) se expressaria como (255,0,0) em decimal, e #FF0000 em hexadecimal (antes do cdigo de uma cor em hexadecimal sempre se coloca um smbolo de tralha).

114

UA 2

| BCA 2.4 | Paletas de cores para web

Das 256 cores bsicas, o prprio sistema operacional fica com 40 para sua gesto interna, sobrando 216 cores. Delas, 18 correspondem s gamas das cores primrias: 6 tons de vermelho, 6 de azul e 6 de verde. J tendo compreendido como funciona o sistema de representao hexadecimal, o prximo passo obter os valores hexadecimais para as cores que pretendemos utilizar. Uma dica: vale a pena verificar se h contraste suficiente entre a cor do background e a cor do texto.

115

UA 2

| BCA 2.4 | Paletas de cores para web

Escolha de cores:

aplicativos WEB

Site com exerccios e dasafios para o trabalho com cores: http://poynterextra.org/cp/colorproject/color.html Experimente combinar cores utilizando aplicativos na WEB em: www.colorjack.com/articles/formulas.html www.universodacor.com.br/unicor/index.php?scr=esquem as_cores

116

UA 2

| BCA 2.4 | Paletas de cores para web

Laboratrio: etapa 2
Nesta etapa voc deve elaborar um esquema de cores (no mximo 5) para cada uma das duas marcas:

1 RESTAURANTE LA PASTA Caractersticas: Restaurante tradicional especializado em alta culinria e vinhos italianos Aconchegante, envolvente, clima familiar Decorao tradicional, mobilirio rstico O dono faz questo de recepcionar todos os clientes Pblico: Sofisticado, exigente, conhecedor de timos restaurantes internacionais Classe AA Idade: majoritariamente entre 35 e 60 anos

2 ACADEMIA POWER BODY Caractersticas: Especializada em tcnicas avanadas de musculao, running e bike indoor Estmulo ao movimento, energia, dinamismo e vigor Visual hi-tech, clima jovem, casual, atraente, sensual Enfatiza a limpeza, sade, agilidade e segurana Pblico: Jovem, dinmico, vaidoso, exigente. Classe: B e C Idade: majoritariamente entre 15 e 40 anos

117