Sabrin Byaah
Carla Märkl
Besides being nice to look at, a good dashboard should provide relevant information and instructions on how to optimize processes by simplifying the viewer’s day-to-day work. To make this happen, you should follow some design principles when designing your dashboard. The following tricks and tips will help you put your metrics in perspective and design an understandable dashboard.
don’t go off the grid.
Organization is key, and that goes for your dashboard, too! Grids not only put information into a meaningful structure, but also make designing your dashboard easier. Typically, design theory works with a 12-column grid and additional horizontal guides. The various dashboard elements such as graphics, charts or text blocks can now be easily aligned to the grid. This also ensures a consistent look across multiple dashboards. Other well-known grids include the golden ratio and the Fibonacci number.
why white space is important.
A dashboard without white space would probably be like a newspaper article without spaces – cluttered and hard to read. White space helps make the different elements of your dashboard appear separate, related, or important. Of course, white space does not have to be white.
hierarchy? only on the dashboard, please.
Not every element on your dashboard is equally important to the viewer. The actual value of your production, for example, should be more concise in the visual hierarchy than the time or date. You can create this hierarchy not only by varying the size of your dashboard elements, but also through color and color contrasts as well as positioning and direction (as with diagonals). Particularly large or centrally placed elements are the first to catch the eye, but a small element can also be brought into focus through the targeted use of color.
In Europe, we read from left to right. Keep that in mind when arranging your dashboard content.
the characters of fonts.
Different fonts are associated with different characteristics. Fine, delicate fonts are considered elegant, slanted fonts are considered dynamic, and bold fonts are considered loud. Think ahead about where your dashboard will be used. Will it hang high up on a production floor or right next to a machine for interactive operation? Will you need to see the font at a distance or up close?
Obviously, the further away your dashboard will hang, the larger and clearer the font should be. That being said, for digital texts – as you can see here on our blog or also in the Peakboard Designer – we mostly use fonts without serifs. Serifs are the small design elements at the beginning and end of a letter.
While these help the reader connect individual letters in print media and support the flow of reading, the popular Times New Roman font seen in newspapers might pixelate or blur on screens with different resolutions, making it difficult to read. In addition to choosing the right font, the way you design the respective text elements also plays a role. While the main body of information should always be easily readable, headings can be a bit more playful if needed. And while notes should fade into the background and provide only additional information, highlights should catch the viewer’s eye. To be on the safe side, you should occasionally check your results to make sure that the typeface is readable from the desired distance.
To design your dashboard in your company’s corporate design, the Peakboard Designer offers you the possibility to upload your own fonts in TTF format.
stop thinking in black and white.
By choosing the perfect color, you can give your dashboard the final touch. Again, be aware of the lighting conditions your dashboard will be in and choose the colors you use accordingly. For example, in a dark environment, a dashboard with light text on a dark background would be more pleasing to the eye. If your dashboard needs to include a warning, red is perfect as a signal color. Green, on the other hand, usually means that everything is fine.
Keep in mind common color associations. The color black, for example, stands for mourning and loss in Europe and is therefore often worn at funerals, in China, however, this color association is not known.
Also, be careful not to use too many different shades, but to use color primarily for emphasis.
It can be useful to create the dashboard in shades of gray at first, and then in a second step check which elements exactly should be brought to the foreground through color accents.
Note that people with color vision deficiencies may have difficulty recognizing low-contrast content on your dashboard. Especially notes in red or green can be problematic and difficult to recognize. Therefore, check in advance if any of the users of your dashboard have such a disability. If so, the icons from our icon library will help you to create a dashboard that is understandable for all viewers. Now it is your turn! We wish you all the best in creating your dashboard.
checklist – five simple steps to the perfect dashboard.
Well, did you remember everything? Don’t worry, our checklist will help you remember each point and apply it directly to your dashboard design.
- Grids bring the elements on your dashboard into a predefined structure and provide order.
- White space separates or relates dashboard elements.
- Visual hierarchy means that important content is highlighted to be immediately recognizable.
- Fonts differ in their readability. Use preferably clear sans-serif fonts.
- Color & Contrast: Use color discreetly and make sure it has the right meaning.
