Dashboard Design: Visual 'Unity in Variety'

As Business Intelligence consultants at E-mergo, we do a lot of work visualizing data for our clients. As a consultant, you are concerned with properly streamlining the required data and then making that data understandable to the client through visualizations. The importance of applying the right visualization method is increasingly being researched and recognized in science. For example, multiple studies have shown that when a web tool is perceived as beautiful or attractive, its use – the user experience (UX) – is naturally experienced as positive. In this blog we explain the design principle 'Unity in Variety', which contributes to a good visual design.

Growth and diversity of data

Data is growing in complexity and diversity, which makes it even more important to keep all this information clear for users. A well-known problem in data visualization is that when many different data analyses are displayed on a single page, the overview is quickly lost. People naturally tend to visually group elements into one understandable whole. When this is not possible, for example because of too many elements on a page, the user experience deteriorates and use of the application declines.

Data Visualization

To avoid a page containing too many elements, it is useful for a developer to be aware that a 'good' design is half the work. By making the right preparations and applying various design and development principles, you can create a dashboard design that end users are happy to use. It is therefore very important to take the 'looks' of an app into account. When designing such a dashboard, 3 design aspects must be taken into account, which together ensure a beautiful and functional data visualization app:

1. The client's wishes, in terms of layout and analytical content
2. The design and development principles that ensure a user-friendly app
3. The design principles that ensure a high aesthetic preference.

Unity in Variety

One of the many design principles that can ensure a high aesthetic preference is 'unity in variety'. This design principle assumes there is an optimal balance between visual unity and variety. This principle is used in many different design disciplines, such as product design, website design and dashboard design. An example of what is meant by unity and variety is shown below:

A good balance between unity and variety is always (unconsciously) preferred by the user. When visual unity prevails, a page is quickly found to be boring. When visual variety prevails, a page is quickly found to be chaotic and cluttered. The optimal balance between the two is therefore always found to be the most beautiful and is preferred. An important effect of finding a certain design 'beautiful' is that this emotion has a positive effect on the expected ease of use.

The balance between unity and variety

To achieve a perfect balance between visual unity and variety, you need to optimize both. By organizing and adjusting characteristics such as the color and size of the elements on a page, you can create an optimal balance. The best way to create unity on a page is to use symmetry. When elements are arranged symmetrically (relative to each other), they create visual calm. Contrary to what many designers think, users also need variety in visual designs, as long as it comes with plenty of unity. The best way to create variety on a page is to use diverse colors. However, it is important to know that the more colors you use, the more symmetry you need to apply to maintain the balance. Below you will see examples that were used in a large scientific study that tested this design principle. The examples are 3 variants of 1 web page that were adjusted to optimize the balance between unity (symmetry) and variety (in color).

figure 1: web page variant with the highest number of colors and the highest amount of symmetry.
figure 2: web page variant with the lowest number of colors and the highest amount of symmetry.
figure 3: web page variant with an average number of colors and an average amount of symmetry.

The examples also confirmed the theory: participants always preferred the variant in which symmetry and the number of colors used were highest (figure 1). Figure 1 contains the most colors and the most symmetry. In this example, unity and variety are therefore in balance, which is why users perceive this website as the 'most beautiful'.