Dashboards

This article is part of the GoldSim Style Guide. For an introduction, please start here.

We do not provide very many specific style recommendations for Dashboards because these are highly customizable and depend on the requirements of the model and your audience. The most important qualities of your dashboard are that you portray just what your audience needs to evaluate the system and understand the results. It might require multiple dashboards to accomplish this.

Colors

It is recommended that you develop a color scheme for all dashboards in your model and stick with it. Typically, this will involve a very light color for backgrounds and more color saturation for accents like borders and dividers.

Sizing and Alignment of Dashboard Controls

It is very important that the controls on your dashboard allow for different screen resolutions and Windows scaling factors. To accomplish this, we recommend that you allow for 25% growth of the text within controls.

Use the alignment tools in the graphical toolbar to align controls.

When you move controls, you can see that GoldSim provides alignment functionality with guidelines and snapping ability that will guide you in alignment as well.

For more refined control, you can view the x,y position and size of controls displayed in the left side of the status bar:

Tooltips

Add tooltips to all dashboard controls to give the user added instruction about the control. It might seem redundant and unnecessary to those building the model but typically the end-user of a Dashboard will need more context about the controls.

Dashboard Hierarchy and Navigation

Some models require more than one Dashboard. In cases like this, you may need to provide some structure to the navigation between Dashboards. The simplest way to do this is using a series of buttons that open other Dashboards. The same series of buttons should be copied to all Dashboards of the model. The button that opens the currently viewed Dashboard will not do anything and you should color this button differently from the others. You can align these navigation buttons at exactly the same point on each Dashboard so they appear stationary to the end-user while they navigate.

Below is a screen capture from a Dashboard called “Main Home”.

Another option that is more complex to build is buttons that provide the appearance of navigation tabs as shown in the example below.

If you want to add navigation tabs to a Dashboard, you will need to create multiple Dashboards with graphical components that align in order to give the impression that you are switching tabs instead of switching entire Dashboard pages. Luckily, with a few simple steps, this is quite easy to do. Follow these basic steps to quickly create your navigation tabs for your Dashboard.

Embedded Charts

There is a lot of flexibility in how you show embedded charts on Dashboards but you should use a consistent style and stick with it. Our recommendation is that you use the default user interface font so that it matches the font of other controls in the Dashboard. You should enforce consistency in the appearance overrides of the embedded chart:

We also recommend that you do not show more than is needed to portray chart information. For example, you might have multiple charts showing on the Dashboard and if they are aligned vertically, then only the bottom chart needs to show the x-axis. In the example shown below, two of the three charts are not showing the x-axis.

NEXT -->