Essential Tips for Creating Better Dashboard Design
User Xperience

Essential Tips for Creating Better Dashboard Design

8 minutes read

Habil Emmanuail Nov 08 2019

Dashboards are one of the primary elements of user experience. They are becoming popular by the day because they provide precise summarised insights to detailed information and data sets of a product. Users can get straight to work using these insights instead of dwelling in and trying to decode confusing data. Everything from the intended user, the data being provided, the way the data is presented and the overall design needs to be well thought out. If you do not spend time on this initial research, then your final dashboard will be useless and a waste of time for the users. However, a dashboard that has been read into can help the users and help the business prosper.

Your dashboard can make or break your business

It is something that is constructed fairly early on for a business/ product and acts like an entire control system.

Getting the Facts Assembled

The building blocks for a dashboard are as limitless as the people who will be making use of them. Getting your initial info right will go a long way for the success of a company.

There is a plethora of information that we need to break down, summarize and decode. We need to pick and choose valuable data from within lengthy passages which detail the entire structure of an operation. For instance, for a retail outlet, the information ranges from all the items it sells, the most popular items, the annual turnover, and etcetera. The information could also be a review of a business performance or the standings of its employees.

Next, we need to understand the user that our dashboard serves. For such a retail outlet, there will probably be more than one dashboard for the employees, customers, CMOs and shareholders.

We pick out different key performance indicators (KPIs) for each user. The data presented in a dashboard for a sales manager will be completely different from a dashboard for the shareholders.

Displaying Facts

Each variable to be displayed should take up minimum space keeping in mind that there is limited area to work with. Only the required variables need to be mentioned. Going overboard with data will not only take up more space but distract the user from what is necessary.

On the other hand, leaving out important data to keep it on a single page is also not advisable. Though viewers seldom go beyond the fold of a page, go to the next page or open a new tab for added information, all the required variables should be presented. Modern technology offers data mining tools that make the job easier to extract the most accurate
data for a specific dashboard and user.

Careful selection of data is crucial for an efficient dashboard

These variables are presented in scatter plots, bar charts, line graphs, pie charts, cards and various other forms. Cards, graphs and scatter plots are easier for the human brain to decipher and work with. Pie charts are considered one of the worst forms of displaying data because they do not fully illustrate the depth of the data set.

Combined, these charts and graphics form a dashboard. Strategic, analytical, tactical and operational dashboards are a few examples of an array dashboard types serving various purposes.

KPIs of a strategic dashboard are set as a reporting tool and are updated frequently (though not as frequently as an operational dashboard). These dashboards are mostly reserved for executives of a firm who require updates from time to time.

Managers who require details on how corporate decisions affect the business, are presented with trends and comparisons in regards to a company's goals and initiatives in a tactical dashboard.

Operational dashboards work with time sensitive data that needs to be updated in real time. Maps and directions are the perfect example for such a dashboard. Data deviations and variations are displayed to the user quickly and clearly.

The crime data map of police.uk is an excellent example of an efficient operational dashboard. It is easy to analyze and interact with. Analysts can enter their desired postal code and get a two panel visualization- the general crime of the region and crimes displayed on an interactive map according to their exact location. Analysts can delve deeper into the data for detailed crime statistics of the area. The map takes the user
from an overall display of statistics at first glance and gives the user
options to choose the specific data they need.

In contrast, data that is not time sensitive and doesn't require immediate action is compiled in an analytical dashboard. The variables are not constantly changing. A prime example is a monthly or annual review of a company's financial performance or turnover rate. CMOs and shareholders are the target audience for such a dashboard.

Details of a Dashboard

What graphics and variables do we prioritize and how? The most important data is prioritized on a page according to how human cognition is trained to view objects. Most commonly, our eyes move from the top left of a page to the right and downwards. Depending on region and the reading direction this could be from right to left.

This eye movement, also known as saccades is crucial in tracking 'the scent of information'. The term was coined in 2003 by Pirolli, Chen, Pitkow, Chi. It is part of the human instinct to focus on relevant information and filter out everything else.

However, when too much information is displayed, this filter is weakened and makes it harder for the user to find the desired data. He needs to scan and attend to all the information before finding what he is looking for.

The McAfee dashboard is an example of a poorly designed display. The panels on the top are indistinguishable, and most of the data below has a monotonous look. Pie charts are sliced up with irrelevant detail. Users have to go through the entire dashboard in detail just to figure out what they are looking at. This disrupts the unconscious scanning process of the brain.

The human brain performs 'recognition based scanning' when going through a dashboard. Landsdale and Edmond referred to this as a key memory process in 1992. This is the ability to grasp familiar elements from an array of visual data. The user can remember subtle cues and refer to them every time he comes back to the dashboard. It is an unconscious process that saves up on time. Like knowing where the panels are and what it's content are.

This human ability to recognise better is also termed as 'the Von Restorff effect'. It refers to our ability to pick out key information that stands out and distinguish it from the rest of the visual elements. Hedwig Von Restorff (1906-1992), a postdoctoral student and psychologist Wolfgang Kohler, focused on this phenomenon in their work. Similar to recognition based scanning, the user knows where the key elements are and can distinguish them at a glance without wasting time and effort delving through the entire visual representation. This is also known as visual foraging.

In the example above, the number 2 is highlighted and grabs our attention from the start.

Similarly the number 30 is highlighted to show its importance according to the Von Restorff effect.

The graphs in this instance are highlighted in bold bright colors for immediate attention.

With the precise data selected for the intended audience earlier on in the design process, we know exactly how we need to place everything. From the graphics to the typography to spacing. Each element plays an important role.

A major convenience of a dashboard displaying multiple data sets is that it gives the user immediate access to making comparisons. However too much information can also lead away from the process of quick understanding. Designers often have to divide the vast information of data sets on different screens and tabs. The user's analysis process is disrupted when he has to go back and forth between tabs and screens for similar information.

In most cases, such fragmentation should be avoided. However, when necessary, the dashboard should be interactive and the divisions into categories and tabs should be concise and accurately labelled. The placement of the label is also crucial to help the user identify what he needs to find. Users can select the data they wish to view and all the required information should be presented in a single tab or screen. Misleading labels and data scattered between tabs can be frustrating and a waste of time.

The tab labels should not be abbreviated and the terminology should be consistent throughout. This helps the user identify labels better and human ability to recognize works more efficiently.

Typography done right goes a long way in a dashboard design. What elements need to be bold? What need to be small? Which font is the most legible and suits the company profile? Getting the font size and spacing right is critical because it can help save a lot of space.

Even and symmetrical spacing is equally important. There should be enough negative space in the dashboard for breathing. This helps the user visualize and analyze the data better.

Highlighting should be used to draw attention. But too much of anything is not advisable. Too many highlights throughout the dashboard make it hard for the user to focus on what is important and they tend to ignore the information presented. The poorly designed McAfee dashboard can be discussed yet again. Choosing to highlight important computer protection information in white text on a red background on top of the screen nullifies the properties of the colors as a sign of alertness or danger. The fact that users are accustomed to filler content and ads in the top is known as 'banner blindness', a term by Jakob Neilson.

"...a visual display of the most important information needed to
achieve one or more objectives; consolidated and arranged on a single screen so the information can be monitored at a glance
".- Stephen Few's (business intelligence expert) definition of a dashboard.

Minimalism is key when designing a dashboard with limited space

In comparison to earlier dashboards, newer and digitized versions are far more interactive and provide an array of information to various users. Users can use menus and filters to get the exact information they need from a single dashboard.

Previously PowerPoint presentations would use static charts and graphics to get information across. Excel documents would display numerical data. These were not as effective in getting the point across, were not interactive and hence, got extremely boring. The same numbers of an excel document can now be found in a dashboard with other variables and the user can relate and make instant comparisons.

The Right Direction for a Dashboard

Dashboard displays should have the right data for the right audience and this needs to be researched before hand.

All the elements and variables should essentially come together on a single page with the right cards, charts, graphics, typography and space.

There should be instant access for users to core data within the dashboard with the above mentioned elements and everything should be easy to understand.

Refrain from burdening the user with too much unnecessary or unprocessed information. Cluttering the dashboard can affect your dashboard negatively and will render it useless.

A dashboard that stimulates the user and makes their decision making and tasks expeditious is an effective one and will escalate the business to its full potential.

Habil Emmanuail

Habil Emmanuail

Habil is an IBM certified Design Thinking practitioner and a member of the Interaction Design Foundation. He has been working as a UX consultant and User Centered designer across web and mobile applications for almost four years. His area of expertise include UI/UX Design, UX Research, Visual UI Design, Prototyping, Information Architecture, Agile Scrum, Branding as well as HTML/CSS, UX Writing, Research and Analytics and Strategy and Planning.