December 22, 2014

Customizing Dashboards

Posted by Ryan Roper

GoldSim dashboards offer a way of putting an ‘interface’ on your GoldSim model that allows you or a colleague or client to change inputs or settings and to view model results. Creating good dashboards may have as much to do with making them nice-looking and easy to use as it has to do with mere functionality (i.e. providing access to appropriate inputs and results). The focus of this post is mainly about appearance and usability of dashboards. I’ll offer some ideas based on experiences I had while working on a project with a group at Sandia National Laboratories.

Some Background

Between Fall 2012 and Spring 2014, I had the opportunity to help develop an input interface for the xLPR 2.0 project at Sandia National Laboratories. This involved the use of dashboards as well as an Excel spreadsheet with multiple sheets from which data were selectively imported based on user-specified dashboard settings (specifically, we used Spreadsheet Element offsets to import certain sections of data based on dashboard drop-list settings). Given the sheer number of different options provided by dashboard controls, we had to be creative to give it a nice look and feel and to make it as user-friendly as possible.

Nice-Looking, User-Friendly Dashboards

I wanted to share two things in particular that I got used to doing and which went a long way to improving the look and usability of the dashboards: (1) I created a template background in PowerPoint and used this to generate background images for the dashboards that had a consistent look and (2) I made extensive use of GoldSim’s dashboard text control (including the hide/disable attribute of the control) to conditionally display text that was helpful to the user.

Here’s a simplified example of a dashboard that I created:


In this blog post, I will briefly describe how I created and inserted the template backgrounds in these dashboards and how I created dynamic or conditionally-displayed text that blends into the background image. I won’t be talking about how to use the text control (you can read about it in the GoldSim help), but rather how to make the text control look nice against a background of any color. I also won’t be talking about the hide/disable attributes of dashboard controls, but I would recommend reading about them in the GoldSim help. They can be very useful in creating dynamic, user-friendly dashboards.

Creating a Background Template in PowerPoint

The first thing I did for this example was create the background template in PowerPoint. The advantage of using PowerPoint (or something similar) is that it has rich graphics capabilities (including gradient effects!) that go a long way to making your dashboard background look really nice. Once you have it the way you like, save the slide as an image file (I used a PNG, but you might want to play around with others).
TIP: When sizing your dashboard and/or your PowerPoint slide, keep in mind that an inch in PowerPoint corresponds to 96 pixels in a GoldSim dashboard. So, for example, an 8x6 inch PowerPoint slide (width to height) corresponds to a 768x576 dashboard in GoldSim.

When you insert your exported image into a dashboard, be sure to right-click on the image (after inserting it) and select the option Order->Send to Back so that it doesn’t cover up any text or graphics already inserted into your dashboard.

Creating Text Controls that Blend into the Background

When you first insert a dashboard text control, by default it has a border and a white fill as shown in the following screenshot.


The first thing you’ll want to do is go into the properties of the text control and remove the border by selecting ‘None’ in the ‘Border’ drop-list. Then set the text color to whatever you like.


Note, that you may not be able to find a built-in fill (i.e. ‘Background’) color for the text control that exactly matches the color of your dashboard background. The screenshot below illustrates this.


I got around this by using a very simple, free program called ColorPic (http://www.iconico.com/colorpic/) to capture the exact RGB composition of the dashboard background color. Once you’ve done this, you can then specify the correct fill color of the text control. In our current example, the RGB composition is 104, 117, 134.


You can specify the text control fill color in terms of its RGB composition by selecting the ‘Other…’ option in the ‘Background’ drop-list of the text control properties dialog, as shown below.


Enter the RGB values and click OK. Exit the properties dialog of the text control to return to your dashboard and then activate the dashboard to see the finished result.


As I mentioned above, if you’re not familiar with the dashboard text control and the hide/disable attributes of dashboard controls, be sure to read up on this in the GoldSim Help. There’s a lot of great stuff you can do to make your dashboards dynamic and user-friendly.

No comments:

Post a Comment