domingo, 18 de outubro de 2009

Sistemas de cores II

Continuando o post anterior, vamos ver algumas características per- ceptivas das cores. Determinadas ilustrações foram retiradas da apos- tila da professora Ana Sofia Mariz e da apostila dos professores Daniel Maldonado e Cecilia Rozenberg.

Cores complementares:

São cores que ocupam lados opostos no círculo cromático, ou seja, o máximo de contraste. Essa característica pode ser explorada quando se quer dar destaque a um objeto, um personagem, um nome em um banner, etc.


Cores quentes e cores frias:

Cores frias são próximas ao azul e verde. Dão idéia de leveza, ausência de peso, tristeza, passividade, vazio e outras características perceptivas similares.

Cores quentes são próximas ao vermelho e ao amarelo. Dão idéia de peso, fúria, atividade, preenchimento, choque e outras características perceptivas similares.


Fenômeno postimage:

Observe durante uns trinta segundos o quadrado da esquerda. Depois fixe a visão no quadrado da direita que está sem saturação.


O que você vê é a cor complementar do primeiro quadrado. A primeira cor impregna na retina, que reage contrariamente, mostrando a cor oposta. Essa cor permanece por alguns segundos após o objeto sair da visão.

Contrastes simultâneos:

Ocorrem pelas alterações de percepção de brilho, tom e saturação provocada pelo contraste das cores que estão ao redor de determinado objeto.

Contraste simultâneo de valor/brilho:

Abaixo os dois quadrados centrais tem a mesma cor. Porém, quando o fundo é mais escuro, ele parece mais claro. E quando o fundo é mais claro, ele parece mais escuro. A percepção muda devido ao contraste.


Contraste simultâneo de saturação:

Ocorre de maneira idêntica ao contraste simultâneo de brilho. Porém com a saturação: se o fundo for pouco saturado, o quadrado parece mais saturado e vice-versa.


Contraste simultâneo de tom:

Diferentes tons de fundo geram diferentes percepções de cor. Os quadradinhos centrais abaixo tem a mesma cor, o verde. Mas observe que o quadrado da esquerda, rodeado de amarelo, parece mais com azul. Enquanto que o quadrado da direita, rodeado de azul claro, parece mais com amarelo.


Efeitos da cor na percepção da forma:

Tamanho:

Os círculos centrais abaixo tem o mesmo tamanho. Porém, o contraste com o tamanho dos círculos que os rodeia faz com que pareçam ter tamanhos diferentes.


Transparência:

Se produz efeito de transparência quando se mistura as cores (bleend mode screen).


Peso, massa e calor:

Os tons frios parecem mais leves e mais sustentáveis. Os tons quentes parecem mais pesados e menos sustentáveis.


Variação das cores:

Comparação das cores com máxima saturação e seus corres- pondentes em tons de cinza (grayscale).


Essa comparação ajuda a entender características do contraste. Quanto menos contraste entre as cores, mais igualdade tem seus correspondentes em tons de cinza. Na figura abaixo, observe como fica o letreiro com suas cores convertidas em cinza e a relação do contraste.


Cores que vazam ou retrocedem:

Cores frias se sobressaem se são mais ou tão saturadas e luminosas quanto às cores quentes, sob um fundo neutro.


Bom, espero que tenha ajudado de alguma forma. Fiquem a vontade para criticar e/ou complementar esse post através de comentários.

Até a próxima. Vlws;;; :)

quarta-feira, 7 de outubro de 2009

Sistemas de cores

Hoje resolvi compartilhar um conhecimento que às vezes deixa um pouco perdidos os iniciantes em computação gráfica. Principalmente quem quer aprender design, animação, edição, web e / ou outras aplicações que a computação oferece. Veremos uma síntese sobre sistemas de cores para entender melhor seu funcionamento dentro dos programas em geral. Algumas ilustrações foram retiradas da apostila da professora Ana Sofia Mariz e da apostila dos professores Daniel Maldonado e Cecilia Rozenberg. No entanto, não esgotaremos o tema. Haverá outros posts.


Observando o Color Picker do Photoshop, si- milar em quase todos os programas, vemos cinco diferentes sistemas de cores. Dois deles são bem conhecidos RGB e CMYK. Portanto, deixaremos a explicação desses para o final da postagem. Vamos aos outros sistemas. Através deles veremos as cores por um outro ângulo. Para entendê-los, veja- mos seu princípio de funcionamento.

Círculo Cromático

Desenvolvido por Issac Newton (1642-1727) é a base de todos os sistemas de cores usados na computação gráfica. Newton chegou a ele atráves de experiências com prismas na decomposição de cores e na observação de fenômenos físicos da luz. Através do círculo cro- mático podemos relacionar as cores e classificá-las como primárias, secundárias, terciárias, complementares, análogas, entre outras.


A partir do Círculo Cromático foi desenvolvido quase todos os sistemas de cores que utilizamos hoje em dia.

HSB - Hue, Saturation, Brightnees

Esse sistema foi desenvolvido por Albert Munsell (1858 -1918). Foi um dos responsáveis pela criação do padrão internacional de cores em computadores.

H - Hue é o que representa a posição do tom de cor no círculo cromático. É medido em graus. O zero é o tom vermelho, 120º o verde e 240º o azul.

S - Saturação é a quantidade de cor presente. Varia entre o cinza total e a cor. É medida em porcentagem, variando de Zero (branco) a 100% (totalmente colorido).

B - Brilho, valor, ou luminosidade representam a quantidade de luz refletida de uma fonte emissora. Também é medida em porcentagem. Pode variar de zero (preto) ou 100% (máximo de reflexão da cor).

Percepção tridimensional do modelo:


Esse sistema também aparece com outras nomeclaturas, como HSV e HSL, pelo fato de brilho, valor e luminosidade serem sinônmos. O funcionamento é similar.

CIE Lab Color

É o padrão internacional de conversão de cores em qualquer sistema. Por causa dele conseguimos que as cores correspondam exatamente em saídas di- frentes. Ex.: Para converter o RGB de um vídeo em CMYK de uma impressora, o software primeiro con- verte ele em Lab para depois converter em CMYK.

O sistema Lab considera três eixos:

L - Considera a luz, variando do branco ao negro. Varia de zero a 100.

a - Eixo que varia entre o vermelho e o verde. Compreende valores entre -120 e +120.

b - Eixo que varia entre o amarelo e azul. Compreende valores entre -120 e +120.

Visão tridimensional do modelo:


Modelo hexadecimal

É a representação para as cores usada em HTML e em outras linguagens de programação. Esse sistema apresenta uma funcionalidade muito interessante: você pode copiar uma cor no Color Picker de um programa e colar no Color Picker de outro programa, usando Ctrl + C / Ctrl + V. É só copiar e colar o número hexadecimal no campo correspondente. Isso é muito prático quando estamos trabalhando com vários programas de com- putação gráfica ao mesmo tempo.

Na internet uma paleta de apenas 216 cores pode ser reconhecida por qualquer linguagem de web e por qualquer browser. Se você marcar a opção Only Web Collors no canto inferir esquerdo da janela do Color Picker do Photoshop, apenas as cores que aparecem em qualquer circunstância na web são exibidas. Assim, sites mantêm a fidelidade de cores em qualquer lugar que são acessados.


Sistema RGB

O sistema RGB caracteriza as cores formadas por adição de luz. Por isso é considerado sistema aditivo. A luz vermelha R, verde G e azul B são representadas, cada uma, por valores que podem variar de 0 (ausência de luz) a 255 (máximo de luz).

Se o valor de R, G e B são iguais, teremos um tom de cinza que varia do preto (todos os três iguais a zero) e branco (todos os três iguais a 255).

As propriedades RGB são aplicadas onde a luz dá origem a cor: monitores, LCDs, projetores, iluminação de ambientes, etc.


Sistema CMYK

O sistema CMYK funciona de maneira oposta ao RGB: por subtração de luz. Quando olhamos para um objeto, enxergamos sua cor porque esse objeto está refletindo essa cor. As outras são "absorvidas" ou subtraídas pelo objeto. Por usar a subtração de cores, CMYK é considerado sistema subtrativo.

No sistema CMYK os valores de Cyan (azul claro), Magenta (Roxo) e Yellow (amarelo) variam em porcentagem. Se os valores CMYK são iguais, também teremos um tom de cinza. Porém, o Zero representa o branco, que aqui é a ausência de cores, e o 100% o preto, que aqui é a presença de todas as cores. Exatamento o oposto do sistema RGB.

As propriedades de CMYK são aplicadas à mistura de tintas e a todos os sistemas de impressão. Porém, o K (preto) é usado apenas para melhorar os contornos e as sombras.


Similaridade entre RGB e CMYK

As cores principais que representam esses sistemas são comple- mentares. A variação entre uma e outra formam o mesmo ângulo no círculo cromático.



Bom, por hoje é isso. Nos próximos posts teremos mais. Espero ter ajudado de alguma forma.

Fiquem a vontade para acrescentar criticas, sugrestões e comple- mentos pelos comentários. ;) ...