InfoSol We're passionate about inspired business intelligence
Related Articles
The focus of our first blog post in the UI / UX series is something called “Empty States”. This is considered very important in website and application development, but is not something you see a lot of in dashboard and BI content development. We are usually more focused on how to display and structure large amounts of data, and neglect to consider how to display no data.
According to Google’s design specification:
Empty states occur when the regular content of a view can’t be shown. It might be a list which has no items, or a search which returned no results. Although these states aren’t typical, they are important opportunities for good design to avoid user disappointment or confusion
So what does that mean? Well let’s look at a generic twitter based iPhone application. The app has opened but there are no tweets found. Rather than showing a blank screen, a holding message is shown:
This is an example of a basic empty state screen. It is a way to show the user that the app is working, but there is just nothing to display.
This in itself it isn’t very helpful.
It doesn’t help the user understand how to find data, or what they can do to see the data. This is where empty states and “Calls to Action” merge to create really strong User Experiences.
Let’s look at an example of a strong empty state screen. This is from an app that allows you to build new websites, and then track visitor counts etc on a dashboard:
Again there is no data to see in the dashboard, however rather than a blank screen, or even just a basic empty state. They have introduced a call to action. The design is leading the user and helping them. There is little doubt on what you need to do to create a new website.
Now let’s consider this from a BI perspective. How can you leverage empty states in dashboards and reports?
Here is a very simple dashboard that allows you to select a region and a year to display the years revenue.
North for 2015 has revenue to show, and the chart is populated. However if I now select 2016
There is no data to display. It’s not clear whether I need to wait for data to load, or if there is nothing to display or whether the dashboard has broken.
Now if I add an empty state to educate the user on what’s going on:
By designing the dashboard in this way the user is advised that there is no data for North in 2016 and to search again. If the dashboard was waiting for data to load then I could use the empty state message to advise this too.
Dashboards, just as with websites and applications, will function and work without empty states. However a well thought out and designed empty state gives a more rounded and complete user experience.
In our next blog we will explore “context” and “enclosure” when visualising your data.
