WIP - Dummy content
Interaction
Interaction States
Purpose: The Interaction States section explores the different interaction states that exist within the design system. It provides an overview of states such as normal, hover, focus, active, disabled, and more. This section explains the purpose of each state, how they communicate information to users, and how they can be combined with each other.
References:
- Material Design - Interaction States Overview (opens in a new tab)
- Shopify Polaris - Interaction States (opens in a new tab)
State Tokens
Purpose: The State Tokens section focuses on the integration of state information into token names within the design system. It explains how state tokens can be used to define styles and behaviors specific to different interaction states. This section may provide examples of state tokens and their naming conventions.
References:
- No specific references provided.
Aria-labels
Purpose: The Aria-labels section highlights the relevance of Aria-labels in conveying information to assistive technologies for different interaction states. It emphasizes the importance of providing appropriate Aria-labels for accessible interactions and provides guidelines or examples for implementing them effectively.
References:
- Material Design - Aria-labels (opens in a new tab) (referenced from Interaction States)
Input Methods/Interfaces
Purpose: The Input Methods/Interfaces section identifies the different interfaces through which users can interact with the products. It covers touch, keyboard, mouse, voice, motion detection, and more. For each input method, this section explains user expectations and how interactions such as hover, pressing tab, and others should be handled.
References:
- Material Design - Input Methods (opens in a new tab)
- Goldman Sachs Design - Keyboard Accessibility (opens in a new tab)
Gestures
Purpose: The Gestures section focuses on non-standard or alternative interactions supported by the design system. It defines the gestures that the system supports and provides guidance on when to use each gesture. It also discusses when to use gestures instead of more "standard" interactions and may include examples or guidelines for implementing gestures effectively.
References:
- Material Design - Gestures (opens in a new tab)
- Goldman Sachs Design - Mobile Gestures (opens in a new tab)
Motion
Purpose: The Motion section addresses the use of motion within the design system. It provides guidance on when and where to use motion, different types of animations used, and their intended communication purposes. This section may also cover easing and duration considerations, motion token logic and structure, and any accessibility concerns related to motion.
References: