Os 13 erros comuns ao desenvolver dashboards

Empresas muitas vezes têm que lidar com um vasto conjunto de dados de clientes, produtos e serviços, requisitando cada vez mais de ferramentas computacionais para organização da informação. Dashboards (ou na tradução para o português “painéis de controle”) são ferramentas utilizadas para monitorar um vasto conjunto de informações de forma rápida. Dashboards fornecem um meio eficiente para apresentação de informação.

• 

• 

Segundo Few (2006), painéis de controle são ferramentas visuais formadas pela combinação de textos e gráficos que devem exibir as informações necessárias para atingir objetivos específicos. Eles devem preferencialmente se encaixar em uma única tela de computador e, geralmente, devem ser exibidos em um navegador web.

Um dashboard corporativo deve ser capaz de se conectar universalmente a qualquer fonte de dados, desde robustos sistemas de gerenciamento de bancos de dados a arquivos de texto separados por tabulações, XML ou HTML. Painéis de controle devem exibir tais dados por meio de agentes medidores inteligentes, que operam como uma equipe virtual de analistas trabalhando 24 horas por dia, 7 dias por semana. Cada um desses medidores deve atuar coletando, processando e apresentando alertas que permitirão a tomada de decisão à medida que as condições mudam (Hovis, 2002).

Painéis de controle devem possuir mecanismos de exibição pequenos, concisos, claros e intuitivos. Devem ainda ser personalizados, ou seja, as informações em um painel devem ser adaptadas especificamente aos requisitos de uma determinada pessoa, grupo ou função (Few, 2006). Entretanto, muitas vezes nos deparamos com dashboards esteticamente belos, mas que na prática são bastante confusos.

Ao ter dificuldade em utilizar um sistema, em geral, tendemos a culpar nossa incapacidade em entendê-lo. Entretanto, muitas vezes o problema não está na nossa capacidade analítica, e sim no software que foi mal projetado.

Muitas vezes, dashboards são projetados para atender ao gosto de clientes. Não me entenda mal, clientes são especialistas no que quer que trabalhem, mas não tem um grande conhecimento sobre como projetar um software que os ajuda a fazer o que têm que fazer. Portanto, deve-se projetar um dashboard que seja útil para que o cliente para o cliente e não apenas esteticamente agradável.

Os 13 erros de Few

O principal problema ao planejar um painel de controle é a necessidade de espremer uma vasta quantidade de informações em uma única tela, que seja facilmente compreensível. Stephen Few, em seu livro “Information dashboard design”, destaca 13 principais erros de desenvolvedores web ao projetar dashboards.

Os 13 erros são:

1. Exceder os limites de uma única tela
2. Fornecer contexto inadequado para os dados
3. Exibir detalhes excessivos
4. Escolher uma métrica deficiente
5. Escolher um tipo de visualização inadequada
6. Apresentar variedades de visualizações sem sentido
7. Usar visualizações mal projetadas
8. Exibir dados quantitativos de forma imprecisa
9. Organizar os dados mal
10. Destacar dados importantes de maneira ineficaz
11. Preencher a tela com decoração desnecessária
12. Uso indevido ou excessivo de cores
13. Projetar um display visual pouco atraente

1. Exceder os limites de uma única tela

Essa é um dos pontos mais complicados de se implementar. Em teoria, os dados de um dashboard devem estar visíveis em uma única tela. Caso necessário, pode-se adicionar botões que levem a informações detalhadas, mas a princípio todas as informações mais importantes devem estar ao alcance de seus olhos;

2. Fornecer contexto inadequado para os dados

Ao exibir informações em uma visualização, deve-se fornecer contexto. Por exemplo, uma empresa vendeu 10 mil reais no mês de abril de 2022. Mas isso é bom ou ruim? Quanto era esperado?

3. Exibir detalhes excessivos

Detalhes excessivos podem prejudicar análises rápidas. Não estou dizendo que detalhes sejam prejudiciais; entretanto, em geral, painéis exibem uma grande quantidade de informações e dependendo do contexto, essas informações podem mais atrapalhar do que ajudar. Logo, deve-se escolher com sabedoria o nível de detalhamento que se deseja mostrar.

Por exemplo, digamos que o faturamento de uma empresa foi R$ 1.823.199,12 em 2020 e R$ 1.783.123,37 em 2021. Essa mesma informação poderia ser exibida em uma tabela como 1,82M e 1,78M, respectivamente (veja como facilita a comparação principalmente se tivermos mais valores para comparar).

4. Escolher uma métrica deficiente

Podemos escolher várias formas de exibir uma informação. Tome como exemplo o problema apresentado anteriormente. Vimos que as vendas foram de 1,82M e 1,78M em 2020 e 2021. Entretanto, o usuário teria que calcular a diferença manualmente. Podemos facilitar isso exibindo simplesmente a diferença: -2.2%.

5. Escolher um tipo de visualização inadequada

Há diversas formas de visualizar uma informação. Entretanto, há tipos de visualização que são extremamente prejudiciais. Um exemplo claro são os gráficos de pizza. Eles utilizam a área ou a circunferência das fatias para efetuar comparações. Lembre-se que a área de um círculo é dada por πr² (imagine ter que calcular isso mentalmente para saber quais os maiores valores). Veja um exemplo a seguir:

Veja como o mesmo problema poderia ser abordado usando um simples gráfico de barras:

6. Apresentar variedades de visualizações sem sentido

Em geral, gráficos de barras são bastante eficazes para resolver boa parte dos desafios em comparação de dados (ou gráficos de linhas, quando se trata de séries temporais). Entretanto, muitas vezes podemos nos sentir desconfortáveis ao usar um mesmo tipo de gráfico para várias partes do painel.

7. Usar visualizações mal projetadas

Além de escolher o tipo correto de visualização para cada problema apresentado, deve-se ainda tomar cuidado com detalhes que podem parecer superficiais, mas que causam grande prejuízo no entendimento da visualização. Observe a figura a seguir:

Aqui vemos vários problemas graves:

• o gráfico de pizza não é o tipo de visualização ideal para mostrar esse tipo de comparações;
• o esquema de cores utiliza tons de cinza muito parecidos;
• a legenda encontra-se abaixo do gráfico, o que força o leitor a tentar identificar qual rótulo corresponde a qual cor (isso é mais prejudicado ainda pela palheta de cores escolhida);
• valores não são mostrados.

Outro problema grave é o uso do 3D, como no exemplo abaixo:

Esse gráfico pode adicionar um belo efeito (dependendo do gosto do desenvolvedor), mas você consegue identificar qual valor corresponde a coluna 7 da série 3? Esse exemplo extremo mostra uma coisa que nunca deve ser utilizado: gráficos 3D exibidos em ambiente 2D.

8. Exibir dados quantitativos de forma imprecisa

Às vezes não é preciso inventar dados para manipular a percepção das pessoas sobre alguma estatística. Alterar a forma como dados quantitativos são exibidos (por motivos escusos ou apenas por descuido) pode alterar a interpretação de uma visualização, o que pode ser considerado um erro grave.

Veja o gráfico a seguir:

Aparentemente a série 1 supera em muito a série 2. Veja que no campo 3, a barra é aparentemente 4x maior. Mas isso é apenas uma ilusão. A escala do gráfico foi manipulada para começar no valor 1000.

Observe como o gráfico ficaria ao iniciar o eixo Y do valor zero:

Alterar valores exibidos nos eixos pode ser uma estratégia eficaz para manipular a opinião dos leitores.

9. Organizar os dados mal

Um painel deve condensar uma grande gama de informações. Portanto, é vital organizar os itens adicionados de acordo com sua importância para o usuário. Deve-se ainda agrupar itens de acordo com sua função e disponibilizá-los na tela de uma forma que não causem uma sobrecarga de informações ao usuário.

10. Destacar dados importantes de maneira ineficaz

Visualizações mais importantes devem estar no canto superior esquerdo, pois esse é um dos primeiros locais que um usuário tende a olhar.

11. Preencher a tela com decoração desnecessária

Não adicione detalhes estéticos desnecessários a um painel. Eles apenas ocupam espaço e distraem o usuário do que realmente importa: focar nos dados.

12. Uso indevido ou excessivo de cores

Em geral, o uso de cores depende do gosto pessoal ou da identidade estabelecida para o projeto. Entretanto, deve-se ter cuidado ao combinar cores, pois o uso incorreto pode prejudicar a visão de possíveis usuários.

Dicas básicas:

• evite combinar cores que não se contrastam. Um exemplo simples de boa prática é o uso de fundos claros com fontes escuras);
• evite o uso excessivo de cores muito brilhantes. Elas podem ser usadas exclusivamente para dar destaca a algum item; entretanto, lembre-se que se você destacar muitas coisas em uma página, o usuário sentirá que o destaque é o padrão, e portanto, nada estará destacado;
• você pode usar ferramentas para auxiliar na escolha da paleta de cores, como o Adobe Color.
• deve-se ainda selecionar cores que atendam a pessoas daltônicas:

13. Projetar um display visual pouco atraente

E um ponto muito importante: é claro que não se deve adicionar detalhes estéticos desnecessários, mas não podemos nos esquecer que painéis devem ser esteticamente atraentes.

Aqui tem uma lista com 20 templates de painéis de dashboard para você se inspirar. Outro exemplo, pode ser encontrado neste link. Bons estudos!

Referências

Few, Stephen. Information Dashboard Design. N.p., Oreilly & Associates Incorporated, 2006.

Hovis, Gregory L. , “Stop Searching for InformationMonitor it with Dashboard Technology,” DM Direct, February 2002.