10 boas práticas em visualização de dados

Giuliana de Jong
gb.tech
Published in
5 min readAug 24, 2022

Dicas para desenvolver visualizações claras, impactantes e acessíveis.

Um binóculo bastante aproximado da tela
Um binóculo bastante aproximado da tela | Foto de mostafa meraji na Unsplash

Que dados são o novo combustível não há dúvidas, o que traz uma relevância muito grande para a forma como podemos converter esses dados em visualizações. Temos uma série de boas práticas que podemos adotar para melhorar a interface e aumentar o impacto com o usuário. Independente da ferramenta utilizada para criar suas visualizações, são práticas universais que podem agregar muito no seu dia a dia. Bora lá?

1. Diversifique os seus gráficos.

Imagem que mostra 4 diferentes formas de representar seus dados: gráfico de massa, gráfico de linha e gráfico de barra (em pé e deitado).

Muito comum nos apegarmos ao que já conhecemos e isso pode ser facilmente aplicado em uma visualização. Evite usar apenas um tipo de gráfico, busque outras formas de representar as informações. A diversificação desperta o interesse e a curiosidade do usuário, facilitando que a mensagem seja passada.

Está sem criatividade? Não importa a sua senioridade, todos já passamos por momentos onde nos questionamos sobre a melhor representação gráfica para exibir nossos dados. Existe um site perfeito para isso, o site datavizproject sugere opções gráficas baseado no tipo de dado que você tem disponível.

2. Insira legendas e rótulos de dados.

Imagem com exemplo de gráfico contendo rótulos de dados. Gráfico de barra representando o volume de vendas por clientes, com quebra entre Cliente 1, Cliente 2 e Cliente 3.

Muito importante ter legendas e rótulos que facilitem a compreensão da sua visualização, lembre-se que nem sempre o usuário terá o mesmo conhecimento dos dados que você então é importante evitar abreviações para o nome dos campos e sempre deixa-los à mostra.

Como desenvolvedor da visualização, você se torna responsável por ser o elo entre os dados e o usuário então é muito importante que a construção ocorra com clareza para fácil entendimento.

3. Abrevie números grandes.

Imagem contendo um exemplo de abreviação numeral, no lugar de 52.394.370.083 utilizar 52.394M.

Busque sempre apresentar números grandes de forma abreviada, o ganho com o usuário é tremenda e ajuda também a deixar o seu dashboard mais clean.

4. Cuidado com a pizza!

Imagem contendo um gráfico de pizza e um gráfico de rosca.

Use com muita cautela o gráfico de pizza e o gráfico de rosca, talvez você já tenha escutado falarem que “se o gráfico tem nome de comida, evite!”. Devemos tomar muito cuidado com esta representação gráfica por alguns motivos:

  • Geram confusão quando existem mais de 4 categorias.
  • Dependem do uso de cores, e estas devem ser muito bem aplicadas.
  • Dificultam a comparação direta entre duas categorias próximas. Se temos uma com representatividade de 35% e outra com 33%, sem ler o rótulo de dados, é praticamente impossível distinguir qual a maior.
  • É péssimo com valores pequenos.

Você pode ler mais sobre aqui.

5. Explore paletas de cores.

Imagem contendo 2 variações de paletas de cores (uma em tons de azul escuro e outra em tons de cinza azulado).

Visualização de dados flerta muito com design, por isso é um bom caminho estudar sobre cores e formatação de fontes para ser um bom desenvolvedor de data viz. Se a visualização for para uma empresa, busque usar as cores do branding da marca. Caso contrário, busque cores que conversem entre si de forma harmoniosa.

Os sites a seguir são ótimas referências para buscar paletas: Color Hunt, Color Lisa e Blend.

6. Cheque o contraste entre a fonte e o fundo aplicado.

Imagem mostrando um exemplo onde o contraste entre a fonte e a cor de fundo dificultam a leitura e dois exemplos onde a aplicação foi feita de forma correta.

Tão importante quanto trabalhar na paleta de cores é assegurar que o contraste entre a cor da fonte e a cor de fundo tenham o contraste necessário para não comprometer a leitura da informação. Em casos de dúvida, existe esse site realiza uma checagem do contraste para você.

7. Use símbolos e ícones.

Imagem contendo 5 exemplos de ícones.

Os ícones são como os emojis para um designer de dashboards. Atuam como grandes facilitadores na assimilação visual e a utilização deles em seus relatórios pode ser a cereja do bolo. Use sempre a iconografia oficial da sua empresa ou em caso de desenvolvimento para portfólio, recomendo o flaticon que contém uma grande variedade de ícones disponíveis para download.

8. Crie Big Numbers.

Imagem com 3 exemplos de Big Numbers (Quantidade Vendas, Receita Vendas e Novos Clientes).

Big Numbers, ou Números de Impacto, são uma ótima prática para trazer um resumo das informações disponibilizadas no dashboard. É muito comum usarmos este formato para visualizar KPI’s, por exemplo, pois facilita a assimilação e acompanhamento.

9. Entenda o seu público e crie uma história.

Assimile o que foi pedido, se aprofunde nos dados e alinhe muito bem as expectativas com a área cliente. Visualizações não são apenas sobre estética, porém muitas pessoas acabam se perdendo aí, de nada adianta uma visualização linda se não conseguimos antes de tudo impactar pessoas.

Peça a opinião dos seus colegas: convide-os para interagir com seu projeto, testar os filtros e te dar opiniões sobre a experiência. Caso esteja desenvolvendo seu portfolio, procure pessoas com experiência na área para trocar conhecimento.

Recomendo também aprender sobre Experiência do Usuário (UX) e técnicas de storytelling.

10. Acessibilidade

Importante sempre realizar a descrição das imagens em suas apresentações e visualizações, alguns dos itens anteriores apoiam na criação da acessibilidade mas é importante pontuar também separadamente a sua importância.

O Tableau — ferramenta oficial do GB para Business Intelligence — desenvolveu um conteúdo completo (link) sobre como criar um dashboard seguindo as diretrizes de acessibilidade. Muitos itens e objetos do software são compatíveis com a navegação por teclado e com tecnologias assistivas então vale a pena a leitura e aplicação das sugestões na sua visualização.

--

--