Imagine que você desenvolveu um dashboard de BI com várias telas. Você definiu a arquitetura de informação com base no método DAR; isso significa que você criou telas de Relatório, telas de Análise e uma tela inicial — o Dashboard — que contém os indicadores mais importantes de todo o painel.
Até aqui tudo bem. Em teoria, você fez o trabalho mais difícil, mas então percebe que COMO você organiza a informação em cada tela vai fazer toda a diferença para o usuário final.
Dashboards são a primeira página do seu painel e devem trazer para a tela apenas as informações mais relevantes e resumidas.
É incrível ver que o conceito mais tradicional de Dashboard, composto principalmente por trazer vários KPIs em uma única tela (simplicidade em sua essência), ainda é atual e útil depois de tantos anos de evolução do Business Intelligence. Mas projetar essa tela ainda não parece uma tarefa fácil para a maioria das pessoas encarregadas de construir dashboards de business intelligence.
Como projetar dashboards eficientes de forma eficaz é um tema muito extenso, que poderia encher um livro inteiro (recomendamos a leitura de Information Dashboard Design, de Stephen Few).
Para manter o escopo deste post curto, vamos nos limitar a dicas de como estruturar uma tela de Dashboard com muitos KPIs, de forma a guiar intuitivamente o padrão de leitura dos usuários ao interagir com esse tipo de tela.
Confie no que seus usuários fazem, não no que eles dizem
É importante reforçar esse velho ditado, pois é comum que os próprios usuários digam, durante o processo de planejamento, que todas as informações necessárias em um Dashboard têm a mesma importância ou relevância.
Mas cuidado: isso é uma falácia! Se seguirmos essa lógica, geralmente chegamos a esse tipo de “solução” visual indesejada mostrada abaixo, em que todos os KPIs são tratados visualmente da mesma forma (sem hierarquia, sem estrutura em lugar nenhum). O resultado: uma tela muito poluída e difícil de ler.
Se tudo é importante, então nada é importante
Você tem um conjunto de KPIs (na verdade, essa é uma mistura de Métricas e KPIs, mas para fins didáticos vamos tratar todos os números como KPIs) para colocar na tela do seu Dashboard.
Para começar a enfrentar o desafio de visualização, provavelmente você vai pensar assim primeiro: “Vou distribuí-los de forma organizada e alinhada, ocupando toda a tela, para não deixar espaços vazios”.
Embora isso provavelmente esteja correto em termos de layout, esse resultado vai inevitavelmente levar o usuário a se perguntar por onde começar a leitura — Receitas? Lucros? Destaques em vermelho ou verde?
Pior ainda, eles terão que descobrir sozinhos onde estão os KPIs mais importantes dentro daquele oceano de colunas e linhas, e adivinhe só: antes que você perceba, seus usuários estarão pedindo um comprimido para dor de cabeça. Lembre-se: nossos padrões de leitura precisam ser guiados.
♦– Distribuir todos os KPIs igualmente na tela, com o mesmo tamanho e peso, é a pior decisão que você pode tomar ao projetar a tela de um dashboard. –♦
Busque agrupar as informações de forma mais eficiente e elimine redundâncias
No exemplo acima, encontramos 4 grandes blocos de informação: Receitas, Receita de Assinaturas, Despesas e Lucro. O método de organização horizontal escolhido para esses blocos é um ponto positivo, pois segue a direção de leitura da esquerda para a direita, mas há muitos rótulos repetidos.
Use a hierarquia visual a seu favor
Dê uma olhada na imagem abaixo. Além de ser fácil de ler, seus olhos serão guiados por tamanhos de texto, posições, cores, espaçamentos e agrupamentos claramente definidos.
É exatamente essa abordagem de exibição que devemos adotar para o nosso Dashboard.
Dito isso, pode ser difícil decidir sozinho quais KPIs devem receber prioridade e destaque na tela. No fim das contas, essa é uma decisão relacionada ao negócio que idealmente deveria ser tomada em estreita consulta com os usuários, atendendo às suas necessidades de análise.
Para fins do nosso exercício, vamos assumir que RECEITA é a informação mais relevante (e geralmente é). Temos Receitas e Receita de Assinaturas, que vamos posicionar bem na faixa superior do nosso Dashboard, enquanto Despesas e Lucro ficarão no bloco inferior, com menos destaque:
Isso pode parecer um detalhe menor, mas escolher qual fonte usar é uma das primeiras coisas que precisamos definir. Isso vai ajudar a definir o estilo visual e evitará retrabalho no final.
Aqui na Cluster, recentemente usamos as seguintes combinações de fontes para um Dashboard: “IBM Plex Sans” para textos/rótulos e “Poppins” para números. Ambas são gratuitas e estão disponíveis no Google Fonts, então experimente-as no seu próximo projeto!
Não tente resolver tudo de uma vez
Vamos chamar cada grupo de KPIs de “Bloco”. Agora, tudo o que você precisa fazer é “resolver” um desses Blocos usando princípios de Hierarquia Visual para destacar a informação principal versus a informação secundária/complementar.
No nosso exemplo, vamos assumir e considerar que “YTD” será sempre a informação a ser destacada, pois traz os dados consolidados desde o início do ano até o dia atual. Lembre-se: sempre valide essas suposições de hierarquia com seus usuários antes de considerá-las definitivas! Essas definições devem ser guiadas pelas necessidades do negócio, e o usuário do seu painel saberá disso em primeira mão. Os demais KPIs serão secundários e, portanto, devem ter menos destaque visual.
Note a importância de trabalhar com diferentes contrastes de informação. Isso vai deixar a tela menos “monótona”.
Agora, vamos adicionar as comparações percentuais, sempre destacando quando algo negativo acontece (ou seja, destacando mais as porcentagens negativas e não positivas).
Por quê? porque decisões e ações provavelmente serão orientadas pelos dados a fim de corrigir resultados negativos do negócio, em vez de apenas corroborar os positivos:
Alinhar essas porcentagens lado a lado nos permitiu ganhar espaço suficiente na tela para trazer uma informação que não tínhamos antes, que é a evolução da Receita nas últimas 12 semanas com um gráfico de linha.
Para ter certeza de que a solução usada no Bloco “Receita Total” realmente funcionará na tela, precisamos duplicá-la, usando as informações do segundo bloco, que é “Receita de Assinaturas”.
Até aqui tudo parece certo. É hora de pensar no segundo conjunto de blocos, que deve ter menos destaque. Não há necessidade de reinventar a roda. Tente reaproveitar o modelo inicial, mudando apenas um detalhe bem sutil: tamanho e peso da fonte (sem Negrito) para o KPI principal. O resultado já nos traz a versão final e aprimorada do nosso Dashboard com apenas um ajuste sutil, porém poderoso, como você pode ver abaixo.
Dicas finais
- Cuidado com as cores no seu Dashboard. Use-as com cautela, com o objetivo principal de destacar as informações mais relevantes para a tomada de decisão. Portanto, dê preferência (maior contraste) para performances negativas, que exigem mais atenção dos usuários;
- O “espaço em branco” na tela é seu amigo. Ele ajuda o usuário a ler as informações, dando à tela algum espaço para “respirar”, tornando toda a experiência mais agradável (e fácil) para os olhos;
- Escolha as fontes com cuidado, assim como suas variações (normal, negrito, light, etc.);
- Preste atenção aos Rótulos. Faça com que seu usuário leia e pense o mínimo possível.
