Driving Dashboard Adoption with Analytics Portals
How can designing a custom analytics portal drive dashboard adoption within your organization?
Intro
Soon after an organization implements a new data visualization tool and builds out a couple of dashboards, the next line of questioning is “How do I drive adoption, getting tools for decision makers to the widest possible audience?”. The investment in these new visual analytics tools is only worthwhile if employees use them to find insights to drive growth at the top of the income statement or save costs towards the bottom. For this to happen, modern analytics tools need to become a regular part of everyday business life.
In the age of user research being applied to nearly every tool we interface with, we have come to expect an intuitive and easily comprehensible experience when interacting with applications. This means if we want employees to use our new dashboards, we must make it easy for them. Ease of use is where embedded visualizations and custom portals provide value as they streamline the user experience. In this post, we are going to explore how we utilize analytics portals to embed Tableau in order to make accessing and viewing data easier for our clients.
Embedding with the Cloud
The first step in this process is making your Tableau dashboards available via the web. There are two tools to achieve this:
Either will work for the purposes of this post and Tableau has written extensively on the differences so I encourage further investigation of the links posted above to learn which fits with a given situation.
The second step will be setting up a web-server which can also be achieved with a public cloud provider. By using cloud-based solutions we are taking on low initial risk while also leaving room to grow as our new portal catches on. All three of the primary cloud providers have services that make it easy to start with a simple POC portal hosted on file storage and then scale to a more enterprise-ready solution.
· Amazon
Note: Tableau Server can be hosted with a public cloud provider, therefore, making both options “Cloud Enabled”
Designing a User Flow
When we’re thinking through a portal design for a client we find it helpful to think about two dimensions:
· Horizontal: Moving across the various roles and functions
· Vertical: Diving deeper into a specific function or question
The horizontal toolbar allows you to lay out various roles that an analyst may play. Each would have its own set of dashboards organized vertically that would enable insights and allow the user to dive deeper.
Let’s take the following example of SuperStore (a Tableau favorite):
They have three areas of focus for their new Analytics initiative: Customer Marketing, Operations, and Finance. Those three areas will each have a grouping of dashboards to support the analysts. We would create the top toolbar with the 3 separate functions allowing each user to click into the one that makes sense to them or (utilizing the REST API for user management) only show each user the tabs relevant to them.
We would then use the vertical icons to show the user the different dashboards available for that particular function.
Clicking into the different “horizontal” functions exposes different “vertical” dashboards.
As our analytics offering expands, we can add options to each role with drop-down menus. I could click into Customer and see “Marketing” or “Retention” each bringing me to a different set of dashboards.
Using the JavaScript API
Now that we have designed the layout of the portal, we need to embed the Tableau dashboards. This is achieved with the JavaScript API and a few lines of code.
We start by sourcing the JS API from our Tableau Server, then we create an initViz() function which stores the DIV we’d like to embed that dashboard in, the URL of the dashboard we’d like to use, and any additional options. We then use the Viz function from the API, pass it the variables from above and create the viz in our page. We run this function once our page has completed loading and our dashboard will render.
Putting together the Experience
In the above example we’re only allowing for one dashboard to be loaded as the pages loads, however, in our portal, we want a new viz to load when the relevant icon is selected. A simple way to demonstrate this is to use two buttons which each call a different initViz() function and load a different dashboard.
Reading through the code posted above, you’ll notice the new viz.dispose() function we’re using. The API will only allow one dashboard to be loaded into a container at a time. In order to avoid an error, we need to check if a viz object already exists and if so, clear it.
We can also clean this code up so we are not writing a new function for each dashboard we want to load. Knowing the only difference between the two initViz() calls is the dashboard link we could instead pull all the links into an array and select the correct link based on the button clicked. This would allow us to only have one initViz() function written, we’ll be happy we did this when we have 20 dashboards.
Where do we go from here
With the code above and some HTML/CSS, we can start building out our first portal. Much of what we covered in this post will allow you to begin embedding Tableau and start to add some interactivity around dashboard selection. This, however, is not the limit of designing an analytics portal. At Slalom we like to put ourselves in the shoes of the end user and find additional functionality that enables them to work more efficiently. This might mean linking from your portal to other tools such as SalesForce or Adobe Marketing Cloud. It also could mean organizing the dashboards in a unique way.
One example of outside the box thinking is adding pop up dashboards to allow the user to quickly take a deep dive without completely leaving their train of thought. This acts in a similar way as a viz in tool-tip, however the dashboard in the pop up is fully functional thus enabling filtering and interactivity
We also have the ability to expand beyond Tableau’s native functionality using other features of the JS API. That could be custom filtering and parameter options, getting underlying data, or using the JavaScript libraries such as D3.js for new chart types. The idea is to make the dashboards easy to access and drive adoption.
Conclusion
In this article, we covered the steps to creating a custom portal with embedded Tableau dashboards:
1. Create your Viz
2. Stand-up a web server
3. Create a web page to embed the Viz
4. Customize for experience and flow
At Slalom our focus is on increasing the ROI seen from an analytics solution. One way we achieve this is by organizing dashboards in an intuitive manner allowing the end users to work through a natural flow. By making the tools easily accessible and eliminating the need for searching around folders (or even worse trying to find old emails with attachments) we are increasing their effectiveness. We also increase the likelihood that they’ll return to the same dashboard again, ultimately driving a culture of analytical usage.
