1. Dashboards and Visualization
  2. Dashboards
  3. Design Dashboards
  4. Dashboard Framework

Many dashboard builders use a three-part framework for dashboards. The framework includes a header, body, and a footer.

  • The header section focuses on navigation: global page selectors such as time, geographic location, version, etc. Place the most used dimensions to the top-left of the screen, as users tend to read a screen in much the same way they read a book.
  • The body contains grids and charts, as well as images if you decide to use them. Try not to add too many elements to the body of a dashboard and ensure that the grid style is consistent across all elements for a unified look. Keep column widths consistent and labels brief wherever possible. Simplicity is key to creating an easily understood dashboard — try using a four-quadrant approach to laying out the items in the body of the dashboard.
  • The footer is optional; you may not need it, but this section can provide pointers to the next activity, or buttons to trigger actions.

You can add text boxes to provide contextual information for users and format the text appropriately. Don’t add too many text boxes though, as they could distract the user. To provide instructions or guidelines, add tooltips to buttons and to published grids or line items.

Where you have an action button related to a grid or chart, position the button directly below the relevant element so there’s no confusion about what it refers to, and consider adding a tooltip. The order of dimensions should be the same across dashboards. Don’t confuse your users by placing them in a different location on each dashboard.

To prevent clutter and confusion, don’t put any elements in the body that are already in another section of the dashboard.

Synchronization between grids should be defined from left to right or from top to bottom. When a grid is synchronized with a line or column of another grid, the grid page selector should be displayed to allow direct selection from within the target grid.

Map charts are a popular element for dashboards. They should be used in conjunction with a grid placed either on the right or below the map as the grid needs to be filtered to show appropriate information for the selected country or region.