Interaction Design

Interactions are promises. Every button says "click me and something will happen." Every loading spinner says "wait, it is coming." This skill ensures those promises are kept for everyone, regardless of how they interact with the interface.

When to Use

• Designing component states (default, hover, active, focus, disabled, error)
• Creating transitions or animations
• Handling errors, empty states, or edge cases
• Designing loading and progress patterns
• Defining feedback mechanisms (success, warning, error confirmations)
• Designing gesture or touch interactions

Process

Step 1: Map All States

For every interactive element, define: