When creating a dashboard in digital analytics, there's nearly unlimited sources of information, best practices, and advice from experts. Hundreds of books and whitepapers are written and released every year to guide analysts and business users in creating the perfect dashboard and craft the perfect story. Depending on your chosen tool of choice, there's even more guidance on how to utilize the tools in the best way possible. But what are all these sources and experts and books really trying to accomplish?
They are all trying to help you craft an intuitive, easily navigable experience, and convey the story effectively. Consumers typically want an easy at-a-glance display, or a diagnostic monitor to keep an eye on what’s important to them. Dashboards must be able to perform those tasks, consistently, and with ease of use so the consumer can effectively make decisions or recommendations. We’re going to take you through the process of doing just that, but within Microsoft’s Power BI tool – crafting an intuitive interface that mirrors a web-like interface.
First, know your audience.
Seems like common sense, but it is more often overlooked when scoping a deliverable. Does your audience expect high-level 30,000ft view-type reporting, or are they data nerds like us? Alternatively, will it be used by multiple groups? Tailor your data and reporting to who will be consuming it. Executives or C-suite consumers typically will not bother with granular data, for example.
Visualize your journey, and assess the scope.
Knowing your audience at the beginning allows you to plan and scope the design ahead of time. If you know your dashboard will be more of an at-a-glance monitor, then design it with eye-catching titles and bold sections. If your audience will be using it more as a diagnostic tool, you’ll want to be able to have filters, slicers, and other items in the forefront of the design phase so you’ll be able to account for that when mapping the data.
Case Study: Client “X” wants a diagnostic dashboard on performance for multiple products, multiple categories, filtered by multiple locations, and for multiple date ranges. Yes, it was a LOT of data. It was something that would allow for diagnostic testing and trending over time, and would reduce the number of requests for ad-hoc reporting significantly. Planning for that level of granularity meant understanding the data they wanted would need to be multi-dimensional, and would need to have the filters and groupings when the data needs to be retrieved. It also allowed us to plan the scope of the dashboard, and what items needed to exist throughout to give the client the flexibility to drill down into the data if they needed to.
Mock-up the report.
Mock-ups are crucial to getting a feel for how things will eventually look in the dashboard. Pen and paper, PowerPoint, wireframes; however you’d like to sketch a skeleton for the dashboard provides a significant value in the future. This step may not be as important to experienced analysts, but is a very important step in guiding you to what can work and what will cause problems. The mock up can also be used to validate whether a certain data element or filter can/should be used. Among other benefits, the most important value-add for completing a mock-up is to set expectations and standardize what will be the delivered report.
Intuitive design – Navigation, Direction, and Usability.
In working on the mock-up process, it gives you the blank slate you need to craft the visual appearance of the dashboard. This step is the most important phase of the process. In designing the mock up, keep in mind how you want navigation to look. Below is a mock-up of a dashboard that has some of the main elements needed to make a dashboard in Power BI more intuitive and feel like a web-like interface.
In Power BI Desktop, create a tab with the look and feel you want to persist through the report.
Numbers 1 & 2: Navigation
Find some icons or grab some off the web that can represent the main metrics and breakdowns of your dashboard. Here, you’ll see two designs as examples.
Example 1: Left Nav. What was used here was an image of images, an inserted button, and a simple text box.
To do this: In Excel or PowerPoint, find the images you like and line them up. Insert a shape, here a circle was used, and make the fill color semi-transparent. Place it over the option of navigation – here it was placed over the “Home” icon. Capture and save that as an image, then move the shape to the next Icon, and repeat until you have all variations, four in this case. Ensure they are all the same size.
Overlaid on the images you saved are a series of blank Buttons you insert from the Home tab. These buttons are key to your intuitive navigation.
If you change the visualization settings of the border, set the default outline transparent, Color 1 on Hover (meaning it will change to that color when you mouse over it), and Color 2 on Selected (meaning when the button is clicked.
Next, move the button to be on top of the icon and outline what you have set as your “Home” navigation.
COPY the button, along with its formats to the other icons on your picture. This step is key to the functionality of the navigation.
What you should have now is a row of icons, with boxes that appear on mouseover around them. We’ll come back to how that is important after we speak to the other elements in the dashboard above.
Number 3: Outlining the Reporting Space
Outlining the space where reporting will be present allows for the consumer to have a feel of consistency and understand the space where data is shown. It also looks great to have it look like an interface, like many tools employ.
Numbers 4 & 5: Date Selection and Help Icon
Dates are needed to run the Power BI, and it’s up to you to have it displayed appropriately. The Help Icon will be used to navigate to the glossary, appendix, FAQs, or any other additional navigation needed.
Number 6: The Data.
Simply, your reports. This is where there’s infinite amounts of advice and more best practices, but I’ll leave you with my with two main tips: Simplicity & Consistency. The simpler you can tell the story, the better. Maintaining the same style, font family, size, and color scheme keep your user from being distracted and allows them to feel like the report is nicely tied together.
Building the Navigation
Now that you have the framework to complete the rest of the dashboard, you’ll have to switch gears a bit to conceptualize the next step. What we’ve done is essentially created a “template” for the rest of your dashboard. This first tab, it’s structure, and the visual aspects of navigation are going to allow you to build in the web-like interface that your audience will see.
The next steps can provide several different opportunities to change the way your audience will consume the data, but for simplicity’s sake, let’s just keep it to a 3-page idea. This method can be used to create any number of tabs, long as the data powering it doesn’t become too massive.
Once you are satisfied with the look and feel, you’ll want to right click on the tab and click “Duplicate Page.” What you’ll be doing is creating exact copies of your slide template and the navigation for the report. We’ll come back to why this is important soon.
It’s your own preference if you want to create a “Title Slide” of some kind. Whether it’s a report cover, image, or anything in between, it can act as the starting point of your navigation through the rest of your report. Of course, you can always just have the main report as the first page as well. For the sake of clarity, a “Title Slide” has been created to show how it would work as a home screen.
Next, right click and hide all but the title tab:
The tabs will be greyed out after you hide them, and once the report is published, the only tab visible will be the Title Slide. This keeps the Dashboard from looking super tab-intensive and looking like a “Report” in Power BI – even though we’ll be publishing it to the Reports.
Next, open the Bookmarks Pane from the View menu at the top of the screen.
Bookmarking – The crux of the navigation.
The Bookmark function is the most crucial part of making the Power BI Report function as a web-like interface Dashboard instead. While on the Title Slide (or your “Home Page” of your report), click to “Add” the Bookmark, and rename it to the same name as the tab. This creates a snapshot of what you see on the page.
As you can see, there are many ways this bookmark can function. See the Power BI Wiki for more details on how these functions can allow you to change the data with the help of things like slicers and filter interactions.
To Begin creating the actions of the interface, click on one of the buttons you’ve inserted, activate and open up the “Action” menu within the Visualizations Pane. Select the bookmark that correlates with the button – in this case page 1 of your report:
This allows you to essentially create bookmarks for any tab you have, hidden or not. Whether you create a title slide, or only have reporting tabs, the navigation runs from the buttons you set the bookmarks to.
Showing you how to create and set bookmarks from a title page gives you a clear picture of how they work. Remember the Navigation menu we created earlier? Let’s come back to those. If you have overlaid a button on the images you created for the navigation, you would use them exactly the same way. Open the Action menu and set the bookmarks to the corresponding pages.
I’ve set the hover color to green. The goal here is to set the bookmark to the page you want it to navigate to, then change the navigation image to the appropriate one that matches the tab you’ve navigated to. Clicking from the “Home” may take you back to the first page or the title sheet. Clicking on “Traffic” in this case will take you to a “Traffic” report tab, and since you’ve changed the image and updated the bookmark, it would look like this:
Hovering over “Traffic,” then after clicking through.
Putting it all together.
So what have we done to this point, and why? Let’s recap:
To Begin, we’ve created a tab as a template. It standardized the look and feel of our dashboard, and allowed us to scope the data needed.
We created a navigation menu from a series of images, icons, or buttons. These allow us to show the consumer a navigation menu to move around the report.
We created duplicates of the same tab and labeled them as different reports. This has set up the dashboard to have a web-like feel when the navigation is enabled by maintaining consistency in the look and feel.
We set our bookmarks to the navigation menu items and replaced icons, buttons of images to reflect where you are in the dashboard.
And the result?
Consistent, templatized pages of a dashboard, with navigation on click. Intuitive and easy to manipulate, the bookmarks in Power BI allow you to have control over how users consume your data. Using bookmarks and hidden tabs allows you to create a dashboard in Power BI, and publish it as a report – and showing is one single title tab, and a host of navigation to help the audience along the way.
Finally, a couple of farewell notes –
Take full advantage of Microsoft’s community learning and forums on Power BI. They will allow you to take control of how your bookmarks affect the data, and teach you best practices for data visualization and reporting.
Keep scope in mind at all times, and if planning for delivery, always include extra time in the data wrangling process. Bookmarks can be finicky when it comes to slicers and certain visuals, so practice before committing.
Bring in data as cleanly and completely as possible. Typically, this goes without saying, but even more so with reporting using these functions. The more cardinality, the more difficult it will be to create the dynamic views you’re looking for.