Dashboard design

Concetti di progettazione di dashboard

Olga Scrivner, PhD

President, Scrivner Solutions Inc

Why design is important?

 

  • Company: NASDAQ
  • Needs: communicate every day's market to the average investor
  • Solution: a real-time single value display at Times Square

 

Why trend lines are not the best solution?

 

stock exchange

1 Brath, Richard & Michael Peters. (2004). Dashboard design: why design is important.
Concetti di progettazione di dashboard

Why design is important?

 

  • Company: NASDAQ
  • Needs: communicate every day's market to the average investor
  • Solution: a real-time single value display at Times Square

 

Why trend lines are not the best solution?

 

stock exchange

 

Historical insights versus real-time indicators

1 Brath, Richard & Michael Peters. (2004). Dashboard design: why design is important.
Concetti di progettazione di dashboard

Design components

                Audience

  • Who will be using this dashboard?
  • What are their needs?
  • What format is suitable for the audience?
  • How often will it be accessed?

  audience

                        Components

  • Purpose: exploratory versus explanatory
  • Format: horizontal versus vertical
  • Layout: grid versus flex
  • Visuals: values, dimensions, shapes

 

components

Concetti di progettazione di dashboard

Dashboard purpose

              Exploratory dashboard

exploratory dashboard

An exploratory dashboard allows users to explore data.

                    Explanatory dashboard

explanatory dashboard

An explanatory dashboard provides users with predefined insights.

Concetti di progettazione di dashboard

Exploratory dashboard

 

exploratory dashboard

 

 

  • Filters for custom data segmentation
1 Baucke, Spencer. (2022). Dashboard design essentials.
Concetti di progettazione di dashboard

Exploratory dashboard

 

exploratory dashboard

 

 

  • Filters for custom data segmentation
  • Customizable navigation panels
1 Baucke, Spencer. (2022). Dashboard design essentials.
Concetti di progettazione di dashboard

Exploratory dashboard

 

exploratory dashboard

 

 

  • Filters for custom data segmentation
  • Customizable navigation panels
  • Drill-down for more granular view
1 Baucke, Spencer. (2022). Dashboard design essentials.
Concetti di progettazione di dashboard

Exploratory dashboard

 

exploratory dashboard

 

 

  • Filters for custom data segmentation
  • Customizable navigation panels
  • Drill-down for more granular view
  • Interactive visuals (hover-over, tooltips)
1 Baucke, Spencer. (2022). Dashboard design essentials.
Concetti di progettazione di dashboard

Explanatory dashboard

 

explanatory dashboard

 

 

  • Data is often already filtered
  • Predefined storyline
  • Presentation to executives
  • A call for action
1 Baucke, Spencer. (2022). Dashboard design essentials.
Concetti di progettazione di dashboard

Dashboard size

                      Physical space

  • Monitor size - a diagonal screen distance

      Desktop, laptop, tablet, mobile devices

monitor size

Concetti di progettazione di dashboard

Dashboard size

                      Physical space

  • Monitor size - a diagonal screen distance
  • Screen resolution - the number of pixels and their density (width x height)

                          Format

  • Standard format - a rectangular dashboard

    • Ratio - 16:9 ratio
    • All components visible on a screen
    • No scrolling

  • Long format - horizontal or vertical

      Desktop, laptop, tablet, mobile devices

monitor size

                Horizontal (timeline style) long format

Concetti di progettazione di dashboard

Dashboard size

                      Physical space

  • Monitor size - a diagonal screen distance
  • Screen resolution - the number of pixels and their density (width x height)

                          Format

  • Standard format - a rectangular dashboard

    • Ratio - 16:9 ratio
    • All components visible on a screen
    • No scrolling

  • Long format - horizontal or vertical

      Desktop, laptop, tablet, mobile devices

monitor size

                Vertical (newspaper column style) vertical format

Concetti di progettazione di dashboard

Dashboard layout

                  Grid system grid system

  • Two-dimensional matrix
  • Balanced and symmetrical
  • Simple navigation
  • Big Aggregate Numbers (BAN) - top row

                                Focus

F focus

F focus

1 Baucke, Spencer. (2022). Dashboard design essentials.
Concetti di progettazione di dashboard

Let's practice!

Concetti di progettazione di dashboard

Preparing Video For Download...