Sistemas de CoresSistemas de Cores - …professor.unisinos.br/ltonietto/jed/pgr/SistemasDeCores.pdf · Porém, ao invés de x, y e z, o sistema tem as componentes R, G e B (R-red

Sistemas de CoresSistemas de CoresSistemas de Cores

Leandro ToniettoProcessamento GráficoJogos [email protected]://www.inf.unisinos.br/~ltoniettoset-09

4-set-09 Leandro Tonietto 2

SumárioSumSumááriorio

IntroduçãoCoresRGBHSVReferências


IntroduçãoIntroduIntroduççãoão

Devemos compreender o que é e como funciona a captação das cores pelo olho humano; nos ajuda a entender como utilizar e programar com cores. Depois, faremos uma revisão sobre os sistemas de cores (color models) mais utilizados: RGB, HSV, CMYK, ...É necessário também estudar um pouco sobre a representação de cores (estrutura e dados) nas linguagens de programação.Por fim, revisaremos alguns exemplos de manipulação de imagens nas linguagens Java, Python e C++ / OpenGL.


CoresCoresCores

O que é uma cor?Cor é luz! A forma como o olho humano captura as informações de cores é através da captação de luz.

Como, então, as cores de diferenciam?A luz é uma mistura de tipos de luz, cada tipo de luz representa uma cor.Os tipos de luz são identificados pelo seu comprimento de onde (wavelength).

Distância entre picos da onda luz

E as cores preta e branca?A cor preta é definida como ausência de luz, portanto, ausência de cor. Objetos da cor preta absorvem todos os comprimentos de onda completamente.A cor branca é a combinação de todas as cores, presença de todos os tipos de luz. Objetos brancos refletem todas os comprimentos de onda de cor completamente.


CoresCoresCores

WavelengthDefine uma cor.Visible Spectrum (Espectro visível de cores):

Imagem retirada de [1]


CoresCoresCores

Cores como partículasOs objetos são iluminados por muitas (muitas mesmo) partículas de luz, ou photons.Cada um destes photons é uma onda.Todo objeto físico reflete ou absorve photons e, desta maneira, sua cor é definida. Objetos mais claros refletem mais luz (absorvem menos), objetos mais escuros refletem menos luz (ou absorvem mais).



CoresCoresCores

Captação de cores pelo olho humano:O olho captura as luzes refletidas e as interpreta como cores.Bilhões de photons são capturados pelo olho e são organizados pela retina como uma fotografia, através da excitação de milhões de células cone... depois tudo vai pro cérebro e ...O olho possui três tipos de células cone, capturam três tipos de photons:

Vermelhas, verdes e azuis (RGB)

Então como são captadas as demais cores?Pela combinação da intensidade de cada uma destas componentes de cor.


CoresCoresCores

Geração de cores no computador/monitor:O computador necessita de um hardware que emita photoeletrons RGB para reprodução de imagens coloridasCRT (Cathode Ray Tube):

Dispositivo emite eletronsTela possui fósforos (RGB) por ponto visível.A combinação das intensidades de luz destes 3 componentes reproduz uma cor (wavelength) no monitor.

LCD (Liquid Cristal Display) funciona de maneira similar. Porém, sem dispositivo de emissão de eletrons. Em cada ponto visível são “ligadas”cada uma das componentes de luz, que são combinadas para reproduzir uma cor.


ConceitosConceitosConceitos

ResoluçãoTermo utilizado para representar as dimensões qualquer matriz de pontos (tela ou imagem, por exemplo)Pode ser expressa tanto em número de pontos de largura e altura, quanto de quantidade total de pixels.Exemplo:

640 x 480, 800 x 600, 1280 x 1024, 256 x 256, ...Ou: 1 Mega pixels, 3 Mega pixels, ... Neste caso, o produto da largura pela altura.



Profundidade de cores:Número máximo de cores que ser representadas. Expressa em bits:

24 bits (RGB):1 byte (8 bits) para cada componente R, G e BTotal de 224 cores = 16 Mega-cores = 16.777.216 de cores.True-color: todas as cores que o olho humano consegue perceber.

32 bits (RGBA ou ARGB):Idem ao anterior, porém possui um componente a mais, o canal Alphadestinado a representação de opacidade/transparência da cor.Pode ser utilizado também para representar mais valores por canal (RGB).Máscaras: 10-10-10 (sobram 2) ou 8-8-8-8 (usando alpha)

16 bits:Número reduzido de cores, menor necessidade de armazenamento.Total de 216 = 64 Kilo-cores = 65.536 cores diferentesMáscaras: 5-5-5 (sobra 1) ou 5-6-5 (verde a mais por causa do brilho)



Profundidade de cores:Número máximo de cores que ser representadas. Expressa em bits:

8 bits (gray-scale ou indexed-color)Um byte para representar as cores: 28 = 256 cores possíveis (índices da paleta)Utilizado também para representação em tons-de-cinza.

4 bits (indexed-color, 2 pixels por byte)Um byte representa dois pixels 24 = 16 cores possíveis, ou melhor, 16 índices possíveis na paleta.

1 bit (b&w – preto e branco, imagem binária)Preto e branco, duas possibilidades de cores, para bitmapUm byte pode representar 8 pixels


Sistemas de CorSistemas de CorSistemas de Cor

Um modelo ou sistema de cores é uma especificação de um sistema de coordenadas ou subconjunto de cores visíveis.Determina o formato, fórmula ou forma de composição de componentes de sistemas (coordenadas) em cores. Exemplos: RGB, HSV, CMYK, HLS, YIQ, ...


Sistemas de Cor - RGBSistemas de Cor Sistemas de Cor -- RGBRGB

O sistema RGB é de longe o mais utilizado na computação, porque ébaseado no sistema de captação de cor do olho humano e porque éo sistema utilizado em monitores.Além disso, é um sistema muito simples para representação de cores. Representação no modelo é inferior ao número de cores possíveis no espectro de cores. Para maiores informações leia Foley pág. 585 [2].Sistema é representado como sistema de referência tridimensional convencional (sistema cartesiano 3D). Porém, ao invés de x, y e z, o sistema tem as componentes R, G e B (R-red ou vermelho, G-green ou verde e B-blue ou azul).Todas as cores podem ser representadas numa combinação das três componentes. Exemplo:

Esta cor é a combinação RGB (153, 205, 255)



Visualmente, podemos representar o modelo como um cubo, aonde os valores mínimos são 0 e os máximos são 1 ponto-flutuante (ou 255 inteiros).

As cores dos cantos do cubo são consideras cores puras. É aonde estão as primárias (R, G e B), as secundárias (Yellow, Cyan e Magenta) e o preto (B)

e branco (W).Ainda, do canto preto ao canto branco

residem todas os tons de cinzas, também chamada de diagonal de cinzas, com 256 valores possíveis.

Quando representado no domínio [0, 1] dos números reais; os valores são uma

fração de 255 (n/255). Quando expresso em bytes estão no domínio [0, 255] dos

números inteiros. Imagem retirada de [1]



Exemplos:

(0, 128, 0)

(99, 125, 149)

(86, 20, 80)

(153, 102, 51)

(255, 153, 51)





Considerações sobre o sistema RGB:Apesar do modelo RGB estar baseado na forma de captação de cores pelo olho humano e ser o modelo utilizado pelo monitores de computador, ele tem um grande inconveniente:

Na sua representação espacial (cubo RGB) não é possível determinar, visualmente, com exatidão, quais são os valores das componentes que determinam uma cor de interesse.

Outro ponto negativo, é que o sistema RGB não é adequado para cálculo de similaridade de cores. Isto porque, se escolhermos uma cor e tentar isolar as suas similares numa região (esfera), não temos como garantir, num mesmo raio em qualquer direção, que as cores vizinhas são similares; elas podem ser, visualmente, diferentes.

Cor-chave e um raio que delimita

uma região de proximidade. Não é

possível garantir que, em todas as direções, as cores

nos limites da esfera sejam

similares a cor-chave.




Este problema ocorre principalmente em algoritmos de detecção de região de cores numa imagem ou para eliminação de cores visualmente semelhantes (por exemplo, chroma-key).

174, 184, 235154, 204, 255

134, 224, 235 134, 184, 235

Exemplo do problema de distância entre cores:



Cálculo de distância entre cores no sistema RGB:Mesmo cálculo de distância no espaço 3D: distância euclidiana:

Onde:c é a cor-chave ou cor central que representa uma região esférica de cores no cubo RGB.o é uma cor qualquer que está sendo testada. R, G e B são os componentes de cor das cores em questãod será a “distância” entre as duas cores. Quando maior o d, menos semelhantes são as cores.

( ) ( ) ( )222

BBGGRRocococd −+−+−=



Cálculo de distância entre cores no sistema RGB:

Entretanto, esta medida de distância não étrivial para dizer uma cor é diferente de outra. Não temos uma noção precisa de qual valor de d deve ser utilizado, pois:

Depende do objetivo em questão, do que se pretende “selecionar” de cores no cuboDepende da nível de precisão que se pretendeDepende da cor de interesse, considerando que, visualmente, a área de semelhança/interesse no cubo pode ser diferente para cada cor.



Cálculo de distância entre cores no sistema RGB:

Uma boa idéia para dar uma noção de medida équalquer uma distância relativa (em %).Isto pode ajudar também na necessidade de interação com o usuário, uma vez que pode ter noção um pouco melhor do quão otimista/pessimista ele está sendo.Normalmente, esta distância relativa é chamada de critério de tolerância; percentualmente, o quão distantes as cores podem ser.



Cálculo de distância entre cores no sistema RGB:Para resolver é simples, basta dividir a distância calculada pela distância máxima (que, obviamente, é a distância entre as cores preta e branca no cubo RGB, ou a distância de qualquer diagonal do cubo).

195075max =d

441,673max ≈d

( ) ( ) ( )222255025502550max −+−+−=d

maxd

dd =∆

No código-fonte...:dd = d / dmax;

if(dd <= tolerancia){

// faz alguma coisa

}


Sistemas de Cor – HSVSistemas de Cor Sistemas de Cor –– HSVHSV

Sistema que determina um cor através da combinação de 3 componentes. Tem a forma de uma hexa-cone.Hue Saturation Value

H - Matiz – cor pura [0..360º)S - Saturação – intensidade de cor pura [0..1]V - Luminosidade – escuro ou claro [0..1]




Uma cor é determinada por um ângulo, uma intensidade e uma luminosidade.Qualquer ângulo com luminosidade zero, leva a cor preta.Qualquer ângulo com intensidade 0 e luminosidade total (1), leva à cor branca.Cores puras são obtidas pelo ângulo, com total intensidade e luminosidade.Exemplos:

0º vermelho, 60º amarelo, 120º verde, 180º o ciano, 240º o azul e 300º o magenta

R

G

B

Y

C

M




Considerações sobre o HSV:O sistema de cores que é visualmente mais “confiável” que o RGB.

Permite, com mais facilidade que o RGB, determinar uma região de cores similares, pois basta determinar um ângulo central e um mínimo e máximo.

É necessária conversão para RGB para ser utilizado no computador.Na conversão, o preto pode ser uma combinação de diversas possibilidades de H e S.


Referências bibliográficasReferências bibliogrReferências bibliográáficasficas

1. WRIGHT Jr., Richard S.; LIPCHAK, Benjamin; HAEMEL, Nicholas. OpenGL Superbible: Comprehensive Tutorial and Reference. 4ed.: Addison-Wesley. 2007.

2. FOLEY, J.D. et al. Computer graphics: principles andpractice. Reading: Addison-Wesley, 1990.

3. TONIETTO, Leandro; WALTER, Marcelo. Análise de Algoritmos para Chroma-key. Unisinos, 2000.

4. BITTENCOURT, João. Apresentação de introdução ao processamento gráfico. Disponível para download no site da disciplina.

5. Microsoft Windows Bitmap File Format Summary. FileFormat.Info. http://www.fileformat.info/format/bmp/egff.htm.

Documents

Sistemas de CoresSistemas de Cores - …professor.unisinos.br/ltonietto/jed/pgr/SistemasDeCores.pdf · Porém, ao invés de x, y e z, o sistema tem as componentes R, G e B (R-red