Ações simples para tornar seus gráficos acessíveis para daltônicos
No final de Agosto, escrevi esse artigo falando da criação de uma visualização de dados sobre a participação feminina na política. Nele, comentei sobre a importância da escolha das cores para destacar as diferenças entre os dados dos países. Tive retornos bem legais, mas um em especial ficou na minha cabeça:
Essa mensagem recebi do meu tio que tem daltonismo, o que me fez pensar e repensar sobre a acessibilidade dos meus gráficos.
Desde criança ouço as histórias dele sobre situações — inusitadas, engraçadas e constrangedoras — que já viveu por conta do daltonismo. Depois de ouví-las, minha reação é quase sempre “minha nossa, não tinha parado pra pensar em como as cores influenciavam nessa situação ou naquela situação”.
(Ou você já tinha parado para pensar sobre como um daltônico vê o pôr do sol?)
De fenômenos naturais à situações cotidianas, temos inúmeros eventos influenciados por cores: dentre eles, as visualizações de dados. As cores são usadas nos gráficos para categorizar, classificar e destacar informações (como falamos nesse post). Saber escolhê-las de forma estratégica é importante, porém, há mais a se considerar além da teoria das cores ou da composição do design quando você otimiza os seus gráficos para acessibilidade.
Por exemplo, pode ser automático colocar num gráfico a cor verde para sinalizar algo positivo e a cor vermelha para algo negativo, sem nem saber que essa combinação pode ser problemática. Observe como o dashboard abaixo é visto por alguém com daltonismo.
E não é suspendendo o uso da combinação verde e vermelho que tornamos um gráfico acessível. Outras combinações que a princípio parecem harmônicas podem ser igualmente problemáticas, como o verde e roxo do próximo dashboard.
Vamos conversar sobre daltonismo e acessibilidade? Com esse artigo, pretendo:
- Contextualizar sobre os diferentes tipos de daltonismo;
- Trazer dicas e exemplos de como tornar as visualizações de dados mais amigáveis.
O Facebook não é azul por acaso
Segundo o Color Blind Awareness, o daltonismo é um distúrbio da visão que interfere na percepção das cores e afeta cerca de 1 a cada 12 homens e 1 a cada 200 mulheres no mundo.
Estima-se que haja 300 milhões de daltônicos no mundo, e isso inclui alguns nomes bem conhecidos como Bill Clinton, Keanu Reeves e Mark Zuckerberg. Inclusive, a cor azul do Facebook foi escolhida por ser a cor mais rica para a visão de Zuckerberg, pois ele não enxerga bem o verde e o vermelho.
Existem três tipos mais frequentes de daltonismo, que também variam na intensidade:
- Protanopia: A pessoa tem dificuldade em enxergar tons de vermelho.
- Deuteranopia: A pessoa tem dificuldade em enxergar tons de verde.
- Tritanopia: A pessoa tem dificuldade em enxergar tons de azul.
E existe também a Monocromia, um tipo mais raro de daltonismo no qual a pessoa não consegue diferenciar as cores e tem uma visão em escala de cinza.
Sabendo que existem condições e intensidades diferentes de daltonismo, escolher cores que são distinguidas por todos não é algo fácil. No entanto, não é preciso banir as cores dos seus gráficos: é possível otimizar a visualização com ações simples — te apresentarei três delas a seguir.
1. Escolha paletas de cores amigáveis
Uma recomendação fácil de adaptar é evitar combinações conhecidas por serem problemáticas, como as mostradas acima.
Mas não se preocupe em decorar todas essas combinações. Existem ferramentas online como ColorBrewer e Coolors que ajudam muito na escolha das cores e sugerem paletas que são amigáveis para daltônicos. Aliás, foi através do ColorBrewer que eu entendi porque o meu tio não teve problemas com as cores do meu artigo: utilizei sem querer uma paleta acessível.
Que ele provavelmente viu assim:
Alguns softwares também dispõem de uma paleta para daltônicos na própria ferramenta, como o Tableau.
Além da paleta que usei no meu artigo e dessa sugerida pelo Tableau, é possível gerar no ColorBrewer outras combinações de cores (com diferentes classes e requisitos) que facilitam da mesma forma a interpretação da informação para quem não enxerga todas as cores.
2. Explore os contrastes
O contraste não é um problema para a maioria das pessoas daltônicas, então torne os contrastes mais evidentes.
A intensidade da cor é mais notável que a cor em si. Muitos projetos priorizam a simplicidade utilizando apenas uma cor junto de preto e branco. Esses dashboards são alguns exemplos:
Além de tornar a visualização mais limpa, seguir uma linha minimalista de eliminar os excessos evita combinações de cores que possam ser complicadas de entender.
3. A cor não precisa ser a única fonte de diferenciação: use símbolos
Junto com a escolha de uma paleta e do uso dos contrastes, utilize elementos como texturas, ícones, gifs e símbolos para diferenciar a série de dados. Quando utilizamos outros elementos, a cor não é mais a única fonte de informação.
Os gráficos abaixo são exemplos que utilizam diferentes padrões de linhas e texturas para diferenciar as categorias:
Nessa tabela, as setas indicam se os valores aumentaram, diminuíram ou permaneceram iguais, então a interpretação dos resultados não depende apenas das cores:
Ou seja, trabalhar com texturas, símbolos, ícones, gifs e textos ajuda no entendimento da mensagem sem depender apenas da diferenciação entre as cores.
Dica bônus: calce os sapatos
Ainda não se convenceu sobre tornar seus gráficos acessíveis, ou não tem um tio daltônico para conversar sobre como ele se sente? A extensão NoCoffee do Google Chrome simula o daltonismo e outros problemas de visão e é muito interessante para termos uma ideia de como é enxergar de formas diferentes.
Ideias colocar em prática hoje
Como forma de agradecimento por você ter chegado até aqui, sintetizei as ideias essenciais para que consulte sempre que quiser e aplique nos seus projetos a partir de agora:
- Cuide das suas cores. Opte por uma paleta amigável para daltônicos, use contrastes diferentes e teste o minimalismo.
- Utilize outros elementos de diferenciação. Use símbolos, ícones, texturas e textos que ajudem na compreensão da sua mensagem, para que as cores não sejam a única fonte daquela informação.
- Em caso de dúvidas, enxergue de outra perspectiva — literalmente. Converse com pessoas que tem dificuldade em enxergar cores, use extensões que simulam problemas de visão e experimente como é enxergar o mundo de outras formas.
Por fim, um agradecimento especial ao meu tio Rodrigo, pelo elogio no meu primeiro artigo e pelo incentivo à escrever sobre esse tema, e aos amigos da faculdade e do trabalho que já pediram pra eu adaptar algum gráfico “porque com essas cores, não consigo ver nada!”.
Sugestões e comentários são muito bem-vindos! Fique a vontade para me chamar nas redes: cá estão meu LinkedIn e meu Instagram.
Fontes e leituras adicionais sobre daltonismo: