Um painel de informações é uma exibição de página única que apresenta os principais indicadores de desempenho em tempo real. Para facilitar a leitura de seu conteúdo, um painel moderno geralmente utiliza gráficos de informações, como gráficos e tabelas. Quando bem projetado, um painel deve ajudá-lo a ver rapidamente informações críticas e descobrir padrões de dados.
Abaixo estão algumas dicas e técnicas para projetar painéis amigáveis.
Exibir as informações logicamente
Sabemos por estudos de usabilidade que, quando nos é mostrada uma página da web, nossos olhos geralmente começam na região superior esquerda da página. À medida que lemos o conteúdo da tela, nossos olhos se movem da esquerda para a direita. Um bom design de painel aproveita esse padrão de leitura natural.
Como uma estratégia de design sólida, coloque as informações mais importantes e urgentes na região superior esquerda do painel . As informações de menor prioridade e que mudam com pouca frequência devem ser colocadas na região inferior do painel.
As informações nos dois gráficos superiores, “Top 10 Customers by YTD Revenue” e “Number of Users by Age Group”, não mudam freqüentemente.
Por outro lado, as informações que mudam com mais frequência, “Inscrições por mês” e “Métricas diárias”, são colocadas na parte inferior do painel, um local que não é o ideal para os gráficos. Na situação acima, a cada dia que o usuário acessar o painel, ele precisará percorrer os dois primeiros gráficos que não mudam com frequência antes de obter informações que mudam regularmente.
Destacar informações importantes
Você deve ser capaz de olhar para um painel e ter seus olhos imediatamente atraídos para as informações mais importantes da página. Técnicas visuais podem ser usadas para conseguir isso.
A cor é poderosa para destacar informações importantes. Por exemplo, se usarmos cores claras e neutras para a maioria das partes do painel, poderíamos destacar seções específicas usando cores escuras ou saturadas.
Talvez seus olhos tenham sido atraídos para o gráfico de linhas na região superior esquerda do painel ou para o gráfico de pizza na região inferior direita porque eram coloridos .
Agrupar informações relacionadas
Agrupar informações relacionadas ajuda os usuários a entender e descobrir conexões dentro deles.
Da mesma forma, posicionar informações conectadas distantes pode causar confusão e dificultar a avaliação holística delas.
No painel mostrado acima, você pode ver um agrupamento implícito de gráficos com base no esquema de cores e no posicionamento:
- A primeira linha mostra as métricas gerais de vendas
- A segunda linha mostra as métricas de vendas do produto
- A terceira linha mostra as métricas de vendas regionais
Como você pode ver, o uso inteligente de cores e posicionamento ajuda os usuários a entender e comparar facilmente as informações relacionadas. Quando os componentes de um painel são semelhantes, as pessoas tendem a vê-los como relacionados.
Devemos estar cientes de que isso pode ser uma faca de dois gumes, pois componentes de painel de aparência semelhante podem sugerir involuntariamente relacionamentos que não existem realmente nos dados. A uniformidade das cores sugere que há um significado compartilhado entre os componentes do painel. As duas cores (azul e vermelho) de fato compartilham o mesmo significado em três dos gráficos mas esse significado não se sustenta no quarto gráfico, onde azul representa “Crescimento Trimestral” e vermelho representa “Crescimento Anual”.