Visual hierarchy
In this section we will see some examples of visual hierarchy used in Shimoku.
To begin with, we will separate the visual hierarchy into two blocks. General visual hierarchy and Data hierarchy.
The general visual hierarchy will be the sum total of reports when creating a dashboard.
For this block we can take into account the following considerations:
- Dashboard Objective | To have a simple reference we can say that we will have three main objectives. General visualization, detailed visualization and mixed. From this first distinction we will be able to generate our dashboards with a clearer idea.
Objective | Primary charts | Secondary charts |
|---|---|---|
Show general data | Indicators, Pie chart, bar chart, table | Line chart, Bar chart, gauge, sankey, heatmap, mindmap |
Show detailed data | Table, bar chart, line chart, gauge, sankey | Indicators, heatmap, mindmap |
Show mixed data
If we have a mixed objective in which general data and detailed data are displayed, it is recommended to sort and display the general data first and then detailed data.
Show general data
Show detailed data
Show mixed data
This hierarchy aims to offer a quick, simple and effective way to visualize specific data. Making use of the different possibilities that Shimoku offers. The use of colors in the data, backgrounds, iconography and other graphic resources will help us achieve this goal.
Examples:
Table with chips | As we see the color and the background in the data, they will allow the user to quickly and easily recognize which leads have a "low" probability since we associate this word with the color red. In this way, if the person viewing the table sees that they all start to be red, he will quickly and easily see that there is some type of incident.
Indicators | In this case we can use them in different ways, but the simplest and most effective is to associate the color following the same data hierarchy mentioned above.
Consistency in data visualization will make it easier to understand and provide a positive dashboard experience.
Consistency:
Low conversion = Red color
0% to 30%(data for low conversion classification) = Red color
Low revenue = Red color
Last modified 1mo ago