Whitespace in Dashboard Design

Applying basic design principles, Part 2: Using clear formatting to support information display

Erica Gunn
Nightingale

--

This is the second in a series of articles that illustrate how basic design principles can improve information display. In the previous article, we looked at how whitespace can improve the overall clarity and readability of a restaurant menu. In the next installment, we will look at the details of chart design. Here, we’ll use small changes to whitespace and text hierarchy to improve the overall design of a data dashboard.

This example is an actual dashboard that I found online, redrawn and edited to anonymize the information:

This image shows a performance dashboard for an imaginary school district, with several charts and tables.

This article focuses on the page layout and text hierarchy, to show how we can use whitespace and text headings to clarify the content of the page. It does not get into visualization choices and recommendations. The goal here is not to re-design or completely change the dashboard, but to work with its existing contents to improve the visual display with a few minimally-invasive changes. At the moment, it’s hard to tell how the page is organized, or what sequence the information should have. A few small tweaks will clarify the page layout and make the dashboard much clearer:

  • Text and headers need to be more visually separated. Right…

--

--