Posts tagged Dashboard
It’s been a while since I shared some new content with you. The main reason is because I’ve been extremely busy with client projects and expanding the Intelligence team at The Next View.
A couple of months ago, I gave a presentation at SAP Netherlands during the SAP Forum event. The SAP Forum (previously known as SAP World Tour) is a one-day event on which SAP presents their innovations and latest technology. I hosted a presentation on effective dashboard design and data visualization principles. Until now, I wasn’t aware of the fact that the photographers caught me in the middle of the action during the event
Normally session attendees receive the presentation but I wanted to give them something extra. Something that would tickle and excite them even far beyond the moment of the actual presentation.
Together with some of my colleagues, we came up with the idea to create a high quality, A1 sized poster containing 8 tips on effective dashboard design. The idea was born. After many pizza sessions, different prototypes and discussions on content (could we copy Stephen Fews quote “no more pies” ?) the poster came to life. The creative brain for the design of the poster is colleague Frodo Jansen, a very talented UX and BI consultant.
At the SAP Forum venue, every attendee of my presentation received a poster and it was a great success. But we didn’t expect that it would go viral after mentioning it on social media like Facebook and Twitter. The result? We had to print over hundreds of extra copies. Customers even started sending pictures of their BI team putting the poster on their office walls or project war-rooms. A great success we never expected to become so big.
After this, I wanted to be able to spread this data visualization poster with my international followers so Frodo and I decided to translate it. Today, the English version of the Data Visualization poster is born.
Drop me a line to receive the poster digitally in high resolution or printed on hiqh quality A1 sized paper.
If you decide to put it on your office wall, I’d love to add a photo of that to my collection so make sure you’ll share it with me.
I can imagine you don’t all have the privilege of having a large HANA instance in your SAP wonderland. Because of this, you might have to wait a couple of seconds every now and then before your reports and dashboards pop up. Time to throw in some magic.
With this tutorial, I’ll show how you can make the waiting in SAP Dashboards / Xcelsius a little bit more exciting than just having to look at the default SAP Dashboards hourglass load indicator.
What are we going to do?
We’ll build an easy loading screen, which will pop-up whenever the dashboard is busy retrieving data.
Step 1: Setting up the connection properties
Navigate to the data manager and open the ‘Usage’ tab of the connection you want to activate the loading screen for.
In the ‘Load Status’ section of this tab, there are a couple of fields displayed. Normally, you might activate the ‘Enable Load Cursor’ checkbox, which will result in showing the good old hourglass.
If you want to advance things, you might use the ‘Loading Message’ and ‘Idle Message’ texts, which you can bind to a cell through the ‘Insert In’ option. After you binded to a cell, you can have a label component to display the text. This looks better than the hourglass but is still not really what we’re aiming for.
Step 2: Changing the ‘Load Status’ properties
Change the text in ‘Loading Message’ into ’1′ and the ‘Idle Message’ text into ’0′. We’ll use this text as a dynamic visibility parameter, to show and hide our loading screen.
What have we done? Basically, if a connection is retrieving data, the value 1 will be placed into the cell defined under ‘Insert In’. When the data is retrieved and the connection turns idle, the 1 will be replaced by a 0.
It could look something like below.
Step 3: Configure the loading screen
In the demo XLF, I’ve included a very simple but nice loading screen, including a small animation (SWF file). This SWF file is displayed by using the ‘Image component’.
This simple screen, consists of just a small amount of objects which doesn’t affect performance in any way worth mentioning. The most easy trick, is to use a canvas container component to include the separate objects of the loading screen.
Now navigate to the properties of the canvas container and open the dynamic visability properties. Bind the ‘Status’ cell to the cell selected for ‘Insert In’ in step 2 of this tutorial. Set the key to, for example, 0.
This property will ensure that the loading screen will only be displayed if cell A:1 of your worksheet has value 1. The value 1 is inserted on refreshing data.
Step 4: Enjoy the waiting
If you fire up your dashboard and a connection is being refreshed, the load screen will popup. It might look like displayed below.
Click the image for the live SWF demo.
You can download the source xlf file here.
The main goal of adding a better looking loading screen with a more dominant presence, is to improve the overall user experience. The user is being informed in a clear manner, that data is being loaded. If you’d like, you could make specific texts for specific sets of connections. You could also display the average waiting time. The possibilities are almost endless.
I often put a semi transparent topping on the rest of the dashboard when a ‘dialog’ like the load indicator is active. Take a look at the example below (the text is Dutch).
I’ve used a black rectangle with a certain level of transparency. This makes it clear to the user that something is going on. This may prevent mouse clicking frustration without seeing charts being refreshed.
I hope you learned something by reading this post.
Update 12/14/12: My colleague Ralph Knoops came up with a handy site with free load indicator animations. You can also download the sample FLA files from that site and change them according to your own preference.
In this blog post, I want to share a simple feature for SAP Dashboards to visually support the ability to compare multiple KPI’s with each other.
Imagine that you have multiple KPI’s you’d like to analyze. In the example below, I’ve displayed three simple deviation graphs (0 = target; above 0 is ok; below 0 is not ok) that display KPI info. It can be interesting to analyze if there is a relation between the scores of the three KPI’s in a specific month.
In the graph design below, It is quite difficult to compare the values. If you scan from the top graph to the two graphs below, you’ll easily loose track of the right column.
This has multiple reasons:
- The title of the individual KPI graphs is placed above the graph, instead of left of it. While comparing a bar in the top graph with the graphs below, you’ll have to ‘cross’ the title of the graph below. This distracts the reading process.
- Every graph has it’s own X-axis including category labels for the month.
- The distance between the three graphs is quite large.
- The black Y-axis distracts while analyzing (non-data pixels)
Now how can we easily support the process of comparing the KPI values for a specific month? I’ve made a simple demo dashboard to reduce the issue. In the following example, I’ve used five KPI’s.
In this example, you can easily compare the bars of the graphs because the selected month is put into ‘focus’ by marking it with a grey area. I’ve used a simple combination of dynamic visability and drill functionality. From a design perspective, I’ve eliminated some of the graph elements like the Y-axis, the X-axis labels, KPI titles (could be placed on the left) etcetera.
This is just a quick showcase / prototype of the technical functionality.
Let me know what you think of this.
Final note: This dashboard was developed using SAP Dashboards 4.0 SP04 Feature Pack 3
This week one of my colleagues asked me for help, while facing a challenge in Xcelsius / SAP Dashboard Design, at one of our customers.
The customer wanted to be able to drill down a whole bar, from a stacked bar chart, into a separated bar chart in wich the segments of the stacked bar, would be displayed as individual bars.
This doesn’t sound like a problem until you check the properties pane of the stacked bar chart object. If you set the ‘insertion type’ for the series (every single segment of a stacked bar is a single serie) on column or row, you’ll notice that the destination area of the individual series must be different from each other. This makes it hard to drill down a whole bar at the same time by clicking just a random segment of the stacked bar. If you select ‘insertion type’ value, you can only drill one value at a time.
Well how do you fix this?
I cracked this nut by adding some filter boxes and some MS Excel logic (which of course can be made invisible during run-time).
The further explanation of the case and my solution are included in the SWF file which you can open by clicking here.
For downloading the XLF file, click here.
Final remark: Design aspects were irrelevant for this case. The only purpose for now was fixing the issue. If I had to design a set of graphs for this case, the dashboard might have looked completely different.
Since SAP Dashboard Design (Xcelsius) uses the internet browser to show your dashboard model, the limitations of Internet Browsers may cause some challenges. One of these challenges can be the issue of showing a non up-to-date version of the SWF model. This may happen because your Internet browser stores the SWF model in the browser cache memory.
What is cache?
Your browser’s cache holds the contents of all the pages that you have visited during a session or period of time, depending on your settings. It monitors requests for HTML pages and image files and saves copies for itself. Then, if there is another request for the same page or file, it will use the copy that it has, instead of asking the server for it again. Since the request is satisfied locally, it takes less time for your browser to retrieve and display the page.
How to fix this?
There are many suggested ‘manual’ solutions for this issue. Most of them show ways how to manually delete your cache, quickly delete it with the use of a hot-key, let your browser delete it by itself every time a page loads, increase the virtual memory, and so on.
I have found just only one solution that really worked in my case, thanks to Centigon Solutions.
They provide a simple solution, by just randomizing the URL every time the dashboard starts. This way, the dashboard can never be in the cache, since the webpage hasn’t ever been visited before. It works quite simple, if you can dynamically change the target URL where the dashboard is located. In my case, I had a ‘welcome screen’ with a URL button integrated into it, from which the real dashboard was started. In this case, I can easily use the ‘randomized URL parameter’ solution for solving the caching issue. You can also add this URL button in your dashboard and let it open the target URL in the same window. This way, it is sort of a ‘refresh’ button.
All the other ‘internet browser settings related’ solutions did not work in my case.
How to do it?
1. Bind the URL button of your dashboard to a cell in your spreadsheet
2. Use another cell with a function “=RAND()” to generate a random value between ’0′ and ’1′.
3. Set a third cell in your spreadsheet model to concatenate the base URL and the random parameter and add a ‘?’ character in between
I created a simple example XLF in which you can easily test the solution and copy paste your own URL witout having to manually add the ‘?’ character.
You can download the example here.
Again thanks to Centigon Solutions for pointing out the direction of the solution.