It is very important when designing a dashboard to make it as easy to read as possible. In addition, we want to make a dashboard conform to how humans analyze a picture. A common concept is to move from the top left-hand side to the top right-hand side and then to the bottom. This is a flow that the majority of users are comfortable with.
Now we bring in the concept of quadrants. Quadrants allow us to create groupings so that a user is not overwhelmed when looking at a dashboard.
- Set up your charts so that the dashboard is divided into four quadrants.
- Selectors should be on the top left-hand side if they control the whole chart.
- Use backgrounds to separate your quadrants.
- Parent charts should be on the left-hand side or on top of the drilldown chart.
- Charts that we want users to look at first should be at the top.
- If possible, size all the quadrants equally.
- Align the components neatly so that it is easier on the eyes when looking for different items.
As you can see, when we group things into four quadrants, it is very easy to read the dashboard. In addition, we are comfortable with navigation as we start at the top left-hand side. The drilldown is easy to understand and navigate through as we have the parent chart on the left-hand side of the drilldown chart. Secondary information should be at the bottom of the chart and not at the top, as users are interested in the highest-level data first when viewing the dashboard. Finally, it is important to align everything neatly and size everything as equally as possible. This makes the dashboard much easier to read.
Now let's take an example of a dashboard that is not set in quadrants but is aligned neatly, as shown in the following screenshot:
This dashboard is harder to read and navigate now, as things are not in quadrants. The drop-down selectors are on the bottom right-hand side, so we have to shift our focus to the main parent chart diagonally whenever we want to make a change, which is not very user friendly.