Gerenciamento de Cores: Controle a Consistência das Cores do Seu Projeto

O gerenciamento de cores é um fator importante para você conseguir reproduzir exatamente as cores que imaginou em seu projeto, nos diferentes tipos de dispositivos e mídias.

Uma das coisas mais frustrantes que pode acontecer é ver a sua arte de forma distorcida ou inconsistente nos celulares, tablets e computadores.

O assunto não é dos mais simples e exige bastante prática e experiência. Portanto, tenha um pouco de paciência e faça a leitura deste artigo com calma!

O que é cor?

Antes de nos aprofundarmos na questão do gerenciamento de cores, é importante revisitar alguns conceitos que, talvez, não sejam tão claros para todo mundo.

Não dá pra falar sobre gerenciar cores sem ao menos entender minimamente o que é uma cor. Aqui a ideia não é entrar nos pormenores da física, mas sim, abranger o assunto de forma suficiente para que o resto do texto faça mais sentido.

Dito isto, podemos começar falando sobre nossos olhos. Os olhos possuem células sensíveis a 3 tipos de comprimentos de onda:

• longos (vermelho);
• médios (verde);
• curtos (azul).

Quando essas células são estimuladas por esses comprimentos de onda, o nosso cérebro recebe sinais que são interpretados nas cores que enxergamos.

Ou seja, as cores são as percepções de diferentes comprimentos de onda de luz captadas pelos nossos olhos.

No entanto, é claro que não enxergamos somente as 3 cores dos comprimentos de onda descritos acima. O nosso cérebro consegue misturar os sinais e percepções para conseguirmos identificar as outras cores do espectro, como amarelo, laranja, roxo, etc.

Por que precisamos entender sobre cores?

As cores refletem o mundo no qual vivemos e fazem parte do nosso dia a dia.

Elas estão em — literalmente — todo o lugar, e nós as utilizamos das mais diferentes formas, seja para criar uma identidade ou para reproduzir o mundo real artisticamente.

Nesse sentido, para nós Designers, entender sobre cores é entender como melhor reproduzi-las em nossos projetos e, além disso, como gerenciar para que cada mídia diferente — impressa ou digital — e cada dispositivo possa refletir exatamente as cores que planejamos.

Dica de Leitura: Cores Em UI – Um Guia Rápido Para Usar Em Seus Projetos

Gerenciamento de cores: um glossário inicial

Assim como foi importante introduzir um pouco sobre o conceito de cor, existem outros conceitos que precisam ser tratados antes de falarmos sobre Gerenciamento de Cores propriamente dito.

Modelo de cores

Como visto, os nossos olhos são os responsáveis por captar as ondas de luz para que nosso cérebro transforme esses sinais em cores.

O problema é que os computadores, programas e os papéis para impressão não possuem olhos para que consigam refletir exatamente as cores que nós queremos. Parece uma constatação óbvia — e boba —, mas olhando por essa perspectiva fica mais fácil de entender o que são modelos de cores.

Para conseguirmos reproduzir da melhor maneira possível as cores que nossos olhos enxergam, a solução foi criar modelos e sistemas baseados em valores matemáticos que os computadores e outros dispositivos conseguem entender.

Os modelos de cores mais comuns são:

• RGB;
• CMYK;
• HSB;
• Lab.

RGB

O modelo RGB é baseado nos três comprimentos de onda que nossos olhos percebem: Vermelho (Red), Verde (Green) e Azul (Blue).

Esse modelo é utilizado em mídias e dispositivos e emitem luz: Televisão, computadores e celulares por exemplo. Ou seja, o gerenciamento de cores no mundo digital é primordialmente baseado no modelo RGB.

CMYK

Ao contrário do modelo RGB, o CMYK trabalha com a absorção dos comprimentos de onda e com a reflexão da luz.

Por isso, o modelo CMYK é utilizado para o gerenciamento de cores em mídias impressas. As cores base do modelo são: Ciano, Magenta, Amarelo e Preto.

HSB

O modelo HSB representa as cores de uma forma diferente, tendo como fatores determinantes a Matiz (Hue); Saturação (Saturation) e Brilho (Brightness).

Matiz: é a cor em seu estado natural, podendo ser qualquer uma das cores dentro do círculo cromático. Estar em estado natural significa que a cor não possui variações de tons claros ou escuros.

Saturação: corresponde à intensidade da cor, quanto mais saturação damos a uma cor, mais vívida ela se torna. Em contrapartida, quanto menos saturação, mais tediosa ela fica.

Brilho: é o responsável por criar variantes claras e escuras às cores. Quanto mais brilho mais branco e mais variantes claras, quanto menos brilho, mais preto e mais variantes escuras.

Lab

O modelo Lab é o que mais se aproxima da cor exata e consegue ser calculada através de fórmulas matemáticas. Por conta disso, as cores representadas por esse modelo são consistentes em qualquer tipo de mídia ou dispositivo.

O Lab se baseia na teoria de cores opostas e trabalha com a premissa de que duas cores não podem ser, ao mesmo tempo, verdes e vermelhas, ou amarelas e azuis.

O modelo Lab é bastante utilizado em softwares de gerenciamento de cores, onde:

• L = Luminosidade;
• a = coordenada cromática vermelho/ verde;
• b = coordenada cromática amarelo/ azul.

Dica de Leitura: Style Guide – Como Desenvolver o Guia de Estilo da Sua Interface?

Color Space (Espaço de Cor)

O Color Space funciona como um guia para a utilização dos modelos de cor descritos acima.

Quando utilizamos o modelo RGB, por exemplo, temos que especificar qual o % de cada comprimento de onda para conseguirmos calcular a cor desejada. Nesse sentido, temos algo assim:

• Vermelho: 33,30%;
• Verde: 35,69%;
• Azul: 96,47%.

Mas essas informações não dizem muita coisa sozinhas. Afinal, devemos pegar 33,3% de qual referência?

O objetivo do Color Space é direcionar qual é o ponto de partida que os modelos de cores devem levar em consideração.

Como padrão, o Color Space é utilizado sobre o mapa CIE 1931, que representa o espectro de cores visíveis aos nossos olhos.

Color Gamut (Gama de Cores)

O Color Gamut corresponde ao range de cores dentro de um Color Space que é capaz de ser reproduzido em diversos dispositivos, como monitores e celulares.

Quanto maior a gama de cores dentro de um espaço de cor, mais as possibilidades de cores possíveis de serem reproduzidas, e vice-e-versa.

Color Depth (Profundidade de Cor)

Color Depth corresponde a uma medida de quantidade de informações disponíveis para representar uma cor. A Color Depth é medida em bits, quanto mais bits, maior é o número de quantidade de cores que o aparelho consegue representar.

Em termos gerais, quanto maior o número de bits maior a qualidade da imagem em determinado dispositivo. No entanto, a qualidade de cor e imagem não depende somente do Color Depth, mas de fatores como qualidade da internet, por exemplo.

Gerenciamento de cores: o que é?

Agora que entendemos um pouco sobre alguns conceitos importantes sobre imagens e cores, podemos explicar melhor o que é gerenciamento de cores.

Gerenciamento de cores é o processo de garantir que as cores permaneçam consistentes — e de acordo com o planejado pelo designer — durante todo o workflow de edição, levando em consideração os diversos hardwares, softwares e dispositivos como tablets, celulares e monitores.

Ou seja, para gerenciar as cores é importante entender quais os modelos, espaços, gama e profundidade de cor que devemos utilizar para que o resultado final seja coerente e que não sofra interferência dos diversos tipos de telas.

Nesse sentido, o gerenciamento de cores deve contemplar 3 componentes básicos:

1. Um espaço de cor independente;
2. Perfis ICC para cada dispositivo ou ferramenta utilizada no processo;
3. Color Matching Module (CMM).

Espaço de cor independente para gerenciamento de cores

Quando falamos sobre espaço de cor independente estamos nos referindo a não utilizar modelo, espaço ou gama de cores que te façam dependentes a um único tipo de dispositivo.

Ou seja, evite utilizar parâmetros tão específicos que só sejam bem representados em um celular da Apple, por exemplo.

A ideia do gerenciamento de cores é justamente abranger os mais diversos aparelhos e mídias para que a arte — física, digital, foto ou vídeo — seja consistente e fiel ao que os ou as designers desenvolveram.

Dica de Leitura: Halo Effect e o Impacto Visual Em UX Design

Perfil ICC e Calibração

Se a proposta do gerenciamento de cores é manter as cores consistentes ao longo do processo, e em diferentes dispositivos, como que conseguimos saber qual é a configuração que devemos utilizar?

Para resolver esse problema, criou-se o International Color Consortium, o ICC.

O ICC é como se fosse um manual de instruções, um arquivo onde está escrito como que as cores são melhores representadas em determinado aparelho ou dispositivo.

A definição do perfil ICC é feita através de aparelhos e softwares específicos que analisam os dispositivos e criam um arquivo que contém os detalhes e instruções para melhor representar as cores.

Quando recebemos uma imagem, por exemplo, e a abrimos no Photoshop, provavelmente este arquivo possui um perfil ICC atrelado que deve ser seguido.

O mesmo acontece quando vamos imprimir uma imagem. Precisamos ter em mãos qual o perfil ICC da impressora e até do papel que será utilizado para que a imagem impressa seja o mais fiel possível àquela criada digitalmente.

Color Matching Module (CMM)

CMM é um software que ajusta matematicamente os valores das cores percebidas em diferentes dispositivos.

Isso significa que com o CMM é possível lidar com uma cor que não pode ser reproduzida em um determinado aparelho ou dispositivo. Nesse sentido, o CMM ajuda a fazer os ajustes necessários para que as cores permaneçam constantes em diferentes lugares.

Não existe um único software capaz de fazer isso, os mais comuns que podemos citar são:

• ColorSync;
• Adobe CMM;
• Little CMS;
• ArgyllCMS.

Gerenciamento de cores no Photoshop

Beleza, apresentamos um pouco da teoria envolvida no gerenciamento de cores. Mas e agora? Como podemos colocar em prática, ou ajustar os softwares que utilizamos para melhor gerenciar as cores do nosso projeto?

Nessa seção vamos mostrar como começar a gerenciar melhor as cores utilizando o Photoshop.

Vale lembrar que esse assunto é complexo, de certa forma, e é necessária certa experiência para conseguir dominar. O treino e a experimentação fazem parte do processo e o que vamos mostrar aqui é o básico para começar.

Configuração de Cor do Photoshop

A janela de Configurações de Cor do Photoshop é o lugar onde você poderá controlar o sistema de gerenciamento de cores da ferramenta.

Para acessar, basta clicar em Editar e selecionar Configuração de Cor. A janela aparecerá com as seguintes informações:

Os principais fatores que vão influenciar o gerenciamento de cores e que você precisa prestar atenção/ entender são:

• Áreas de Trabalho;
• Diretrizes de Gerenciamento de Cores;
• Opções de Conversão;
• Controles Avançados.

Áreas de Trabalho

As áreas de trabalho correspondem aos modelos de cor que vimos no começo desse texto. Eles correspondem a maneira com que serão tratadas as cores nos seus arquivos do Photoshop.

Existem 4 tipos de áreas de trabalho:

1. RGB;
2. CMYK;
3. Cinza;
4. SPOT.

RGB e CMYK são os modelos que já explicamos, lembrando que RGB é utilizado para projetos digitais, enquanto o CMYK para impressos.

Os modelos Cinza e SPOT são também utilizados para projetos impressos e permitem editar o aumento de valor tonal (dot gain) de pontos pretos (Gray) ou coloridos (Spot).

Dica de Leitura: Como Atuam Os Blend Modes do Photoshop?

Diretrizes de Gerenciamento de Cores

Para cada área de trabalho, no menu, aparecerão 3 opções de Diretrizes de Gerenciamento de Cores, as quais estão relacionadas com a maneira de trabalho com Perfis ICC:

• Desativado;
• Preservar Perfis Incorporados;
• Converter em área de trabalho.

A opção Desativado não é recomendada para usuários novos do Photoshop por possibilitar edições aos perfis ICC dos arquivos. Isso significa que se você abrir um arquivo cujo perfil ICC não é compatível com a área de trabalho na qual você está trabalhando, o Photoshop irá ignorar esse perfil ICC.

Da mesma forma, todo novo arquivo que você criar e salvar não vai possuir um perfil ICC incorporado a ele.

Já a opção Preservar Perfis Incorporados procura sempre manter o perfil ICC do arquivo aberto ou em edição. Isso significa que se você abrir um arquivo cujo perfil ICC seja incompatível com a área de trabalho atual, o Photoshop não vai tentar convertê-lo ou apagá-lo. Ele simplesmente deixará o perfil intacto.

Por fim, a opção Converter em Área de Trabalho utiliza sempre a área de trabalho atual para a edição das imagens. Isso significa que ao abrir um arquivo com o perfil ICC incompatível, o Photoshop irá automaticamente atualizar esse ICC para a área de trabalho na qual você está trabalhando.

No entanto, essa atualização só acontecerá enquanto você estiver editando os arquivos e não vai incorporar esse perfil ICC no arquivo ao salvá-lo.

Opções de Conversão

A parte de Opções de Conversão corresponde aos Color Matching Module, os quais vimos antes nesse artigo.

Ou seja, utilize as Opções de Conversão para editar a forma com que você converte arquivos de um módulo de cores para outro.

Para a conversão, você consegue escolher 4 tipos de Objetivo:

• Perceptivo: faz a conversão proporcional entre módulos de cor;
• Saturação: preserva a saturação ou brilho das cores ao fazer a conversão para outro módulo;
• Colorimétrico Relativo: fará a conversão mais precisa das cores, mas a gama de cores será cortada se necessário;
• Colorimétrico Absoluto: simula as características de um papel branco.

Advanced Controls

Há um consenso em que deve-se deixar essa seção na posição padrão, como na imagem:

De maneira geral, os controles avançados permitem que você controle a saturação e as cores RGB. Mas, como dito, manter esses controles em Default é a melhor opção. Caso queira entender melhor, você pode acessar os tutoriais da adobe.

Exportando arquivos

Existem algumas considerações com relação ao gerenciamento de cores quando você exportar ou salvar arquivos no Photoshop.

Caso você não precise que o arquivo seja editado em outros programas que exigem camadas (como Premiere ou After Effects), a melhor opção de exportação e o .TIFF.

Mas se você precisar editar as camadas posteriormente, a melhor opção de exportação é a .PSD

Utilize os formatos .PNG ou .JPG caso precise de arquivos seguros e não editáveis.

Dica de Leitura: Photoshop: 5 Dicas Básicas Para Melhorar Seu Fluxo de Trabalho

Gerenciamento de cores não é tratamento de imagem

Como último ponto, mas não menos relevante, é importante deixar claro que o gerenciamento de cores e o tratamento de imagem são duas coisas diferentes.

O gerenciamento de cores acontece em todo o processo de criação e desenvolvimento, desde a fotografia — no caso de uma imagem — até a exportação do arquivo.

O tratamento de imagem é uma pós-produção e uma etapa dentro do processo de criação. Por isso, o gerenciamento de cores também está presente na etapa de tratamento de imagem, mas ele não se limita somente a esse passo.