Design de dashboard

Conceitos de Design de Dashboards

Olga Scrivner, PhD

President, Scrivner Solutions Inc

Por que o design é importante?

 

  • Empresa: NASDAQ
  • Necessidade: comunicar o mercado do dia ao investidor médio
  • Solução: um painel de valor único em tempo real na Times Square

 

Por que linhas de tendência não são a melhor solução?

 

bolsa de valores

1 Brath, Richard & Michael Peters. (2004). Dashboard design: why design is important.
Conceitos de Design de Dashboards

Por que o design é importante?

 

  • Empresa: NASDAQ
  • Necessidade: comunicar o mercado do dia ao investidor médio
  • Solução: um painel de valor único em tempo real na Times Square

 

Por que linhas de tendência não são a melhor solução?

 

bolsa de valores

 

Insights históricos versus indicadores em tempo real

1 Brath, Richard & Michael Peters. (2004). Dashboard design: why design is important.
Conceitos de Design de Dashboards

Componentes de design

                Público

  • Quem vai usar este dashboard?
  • Quais são as necessidades?
  • Qual formato é adequado para o público?
  • Com que frequência será acessado?

  público

                        Componentes

  • Propósito: exploratório versus explicativo
  • Formato: horizontal versus vertical
  • Layout: grid versus flex
  • Visuais: valores, dimensões, formas

 

componentes

Conceitos de Design de Dashboards

Propósito do dashboard

              Dashboard exploratório

dashboard exploratório

Um dashboard exploratório permite explorar os dados.

                    Dashboard explicativo

dashboard explicativo

Um dashboard explicativo oferece insights predefinidos.

Conceitos de Design de Dashboards

Dashboard exploratório

 

dashboard exploratório

 

 

  • Filtros para segmentação personalizada
1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceitos de Design de Dashboards

Dashboard exploratório

 

dashboard exploratório

 

 

  • Filtros para segmentação personalizada
  • Painéis de navegação personalizáveis
1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceitos de Design de Dashboards

Dashboard exploratório

 

dashboard exploratório

 

 

  • Filtros para segmentação personalizada
  • Painéis de navegação personalizáveis
  • Drill-down para visão mais granular
1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceitos de Design de Dashboards

Dashboard exploratório

 

dashboard exploratório

 

 

  • Filtros para segmentação personalizada
  • Painéis de navegação personalizáveis
  • Drill-down para visão mais granular
  • Visuais interativos (hover, tooltips)
1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceitos de Design de Dashboards

Dashboard explicativo

 

dashboard explicativo

 

 

  • Dados geralmente já filtrados
  • Narrativa predefinida
  • Apresentação para executivos
  • Um chamado à ação
1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceitos de Design de Dashboards

Tamanho do dashboard

                      Espaço físico

  • Tamanho do monitor - distância diagonal da tela

      Desktop, notebook, tablet, dispositivos móveis

tamanho do monitor

Conceitos de Design de Dashboards

Tamanho do dashboard

                      Espaço físico

  • Tamanho do monitor - distância diagonal da tela
  • Resolução - número de pixels e densidade (largura x altura)

                          Formato

  • Formato padrão - dashboard retangular

    • Proporção - 16:9
    • Todos os componentes visíveis em uma tela
    • Sem rolagem
  • Formato longo - horizontal ou vertical

      Desktop, notebook, tablet, dispositivos móveis

tamanho do monitor

                Horizontal (estilo linha do tempo) formato longo

Conceitos de Design de Dashboards

Tamanho do dashboard

                      Espaço físico

  • Tamanho do monitor - distância diagonal da tela
  • Resolução - número de pixels e densidade (largura x altura)

                          Formato

  • Formato padrão - dashboard retangular

    • Proporção - 16:9
    • Todos os componentes visíveis em uma tela
    • Sem rolagem
  • Formato longo - horizontal ou vertical

      Desktop, notebook, tablet, dispositivos móveis

tamanho do monitor

                Vertical (estilo coluna de jornal) formato vertical

Conceitos de Design de Dashboards

Layout do dashboard

                  Sistema de grid sistema de grid

  • Matriz bidimensional
  • Balanceado e simétrico
  • Navegação simples
  • Big Aggregate Numbers (BAN) - linha superior

                                Foco

F focus

F focus

1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceitos de Design de Dashboards

Vamos praticar!

Conceitos de Design de Dashboards

Preparing Video For Download...