A importância das cores em produtos digitais

Atualmente, muito do que se fala sobre o estudo das cores está relacionado a estratégias de marketing ou vendas. No entanto, também é interessante lembrarmos como as cores impactam a usabilidade e acessibilidade de um produto digital, uma vez que cada perfil de usuário precisa de cuidados diferentes.
Fabiano Favretto | 2 de março de 2021

As cores em produtos digitais são essenciais na efetividade da solução, tanto do ponto de vista do mercado quanto da usabilidade e acessibilidade. Sempre devemos levar em conta qual o público a que esse produto é destinado, qual o tom de voz e a mensagem que o mesmo deverá transmitir, e também seu guia de marca para que as cores empregadas nele sejam realmente coerentes.

Na psicologia encontramos algumas respostas de como podemos utilizar as cores, pois esta área de estudo traz para o design contribuições muito significativas sobre o comportamento humano.

Com a psicologia das cores compreendemos seus efeitos nas emoções e sentimentos nas pessoas, sejam eles positivos ou negativos. Com isso, a escolha de cada tom utilizado em um produto não será aleatória, mas cuidadosamente definida para despertar desejo, interesse, curiosidade e instigar uma ação. Em outras palavras, aplicando as cores certas iremos gerar o impacto desejado na percepção dos usuários.

A autora Eva Heller, em seu livro A psicologia das cores: Como as cores afetam a emoção e a razão, revela a importância das cores: “A cor é mais do que um fenômeno óptico, mais do que um instrumento técnico”. Portanto, devemos ter cautela na aplicação de cores na construção de um produto. Abaixo, um pequeno resumo do que as cores em sua essência representam:

Blog Post _ 09.03.2021_A importância das cores em produtos digitais_1.png

Para que as cores realmente tenham sentido em sua utilização é necessário que sejam apresentadas em um contexto adequado, levando em conta convenções já existentes. Um bom exemplo disso é não definir um tom de vermelho para uma ação que foi realizada com sucesso, ou mesmo tons verdes ou que não chamam atenção para apresentar mensagens de erro.

Talvez você esteja se perguntando: “Como faço então para definir quais cores meu produto deve ter?”

Existem diversas técnicas que ajudam na definição das cores, entre elas o círculo cromático, que é uma das mais utilizadas.

Blog Post _ 09.03.2021_A importância das cores em produtos digitais_2.png

O círculo cromático possui um total de doze cores divididas em:

3 primárias - Azul, vermelho e amarelo 3 secundárias - laranja, verde e roxo 6 terciárias - vermelho-arroxeado, vermelho-alaranjado, amarelo-alaranjado, amarelo-esverdeado, azul-esverdeado e azul-arroxeado

Para encontrarmos harmonia entre essas cores, podemos utilizar as seguintes combinações:

Blog Post _ 09.03.2021_A importância das cores em produtos digitais_3.png

Outros fatores como contraste, brilho, sombras e tons também podem influenciar nas cores resultantes destas combinações.

Cores em produtos digitais e acessibilidade

Definir cores agradáveis não é o suficiente para definir a eficiência do seu produto. As cores devem ser acessíveis para todos os usuários, independente de sua condição ou meio. Segundo censo do IBGE de 2010, a deficiência que mais ocorre no Brasil é a visual, com cerca de 18,6%.

Algumas destas deficiências, como o daltonismo, dificultam a distinção das cores, o que impacta diretamente na maneira como devemos trabalhá-las para estes usuários.

A W3C disponibiliza diretrizes internacionais de acessibilidade (Web Content Accessibility Guidelines ou WCAG) que ajudam nessa definição.

Segundo a WCAG:

“As cores devem ter contraste suficiente entre a cor do texto e seu fundo (tecnicamente chamado de taxa de contraste de luminosidade ). Isso inclui texto em imagens, ícones e botões. Além disso, as cores usadas para transmitir informações em diagramas, mapas e outros tipos de imagens devem ser distinguíveis.”

O contraste das cores na apresentação de conteúdos é definitivamente importante, pois além de favorecer o acesso ao público com daltonismo, permite que pessoas com baixa sensibilidade ao contraste, como as pessoas mais velhas, possam acessar o produto sem maiores dificuldades.

Aqui está um vídeo que ilustra a questão do contraste nas cores.

Existem algumas ferramentas que permitem testar as cores de seu produto digital, ajudando, assim, na assertividade com relação a esses usuários. Dentre as ferramentas temos a Toptal, que simula diversos tipos de deficiências cromáticas e o Coolors, que permite verificar o contraste entre as cores baseado nas diretrizes da W3C.

A definição das cores em produtos digitais de uma maneira consciente e inteligente aumentará a efetividade, aumentando as chances de consolidá-los no mercado.

Referência:

  • A psicologia das cores : como as cores afetam a emoção e a razão / Eva Heller ; [tradução Maria Lúcia Lopes da Silva]. - 1. ed. - São Paulo : Gustavo Gili, 2013.
Fabiano Favretto
UX/UI Designer | Café sem açúcar, música, usabilidade e um bom livro. A arte me move e o Design me puxa.