Page History
...
Hierachy of Action Buttons
The buttons inside Inspire follow a hierarchical order. It is important to create a visual hierarchy between the buttons in the user interface to guide the user’s attention towards the desired user flow.
...
Foundations
In the western world, users tend to engage with a dashboard content from left to right, top to bottom. Keep this in mind while arranging actions. For example, a finishing action like “Save” should be placed towards the right and bottom of the page if possible. This ensures that the user completes the process of the dashboard bevor naturally ending up at the final action.
[IMAGE PLACEHOLDER]
This reading flow can intentionally change with the help of visual emphasis. One of the most effective ways to do that is color. Attention tends to gravitate towards bright colors and high contrast. In Inspire, this could be the bright yellow of a primary action or the contrast-heavy black of a secondary action. This effect diminishes exponentially the more color is used within a dashboard. It therefore should be used in regulation.
[IMAGE PLACEHOLDER]
Implementation in Practice
...
| Type | Definition | Examples | Styling |
|---|---|---|---|
 | |||
 | |||
 |
Primary Action
A dashboard can only ever have one primary action but also might have no primary action at all. The primary action should guide the user forward in the primary user flow. This flow is the main task the user is trying to achieve within a combination of dashboards. This could be among others:
- Creating a new element within the system.
- Completing a multi-step process across multiple dashboards.
- Navigating to the main workplace a user might use.
Secondary Action
A dashboard can have multiple secondary actions. These actions highlight secondary user flows within the dashboard. These flows are optional additions to the primary user flow or entire user flows of their own. This could be among others:
- Changing data inside a table.
- Adding a new element in a selection list.
- Canceling a process.
Secondary actions should be used in moderation as to not overload the user with choices. Limit the amount of secondary action to a maximum of three per dashboard if possible.
Ghost Action
Layout
Depending on the context, a group of buttons can have two layouts: horizontal and vertical. Avoid conbining the two within one dashboard. The order for buttons is as follows:
...
