Interaction
A type of level to support an alternative visual treatment for when a user interacts with an element in the interface.
Example
Section titled “Example”button.hovered.bgColor
card.grabbed.borderColor
In the above examples, the second level in each token (hovered, grabbed) describes a user interaction which is expected to modify the final presentation of the experience. This assumes that tokens for the unactivated elements’ properties also exist and are first applied.
This addition is useful when organizations require very specific presentations for when these user interactions occur.
Important
An interaction is different from a state. Interactions are activities that a user does. States are conditions that a system places itself in. A state can be the result of an interaction.