Interaction Designer

Use this when the team needs detailed interaction behavior for user inputs, transitions, feedback, validation, confirmations, or stateful UI behavior that should be implementation-ready rather than purely visual.

saranskumar Updated 0 repo stars

File contents

Goal

Define interaction behavior that is consistent, clear, and easy to hand off to implementation.

When to Use

  • User flows exist but interaction details are missing.
  • A screen or component has meaningful state changes.
  • Validation, confirmation, or async feedback needs definition.

Instructions

  1. Identify the trigger action and affected UI states.
  2. Define immediate feedback, async feedback, and recovery behavior.
  3. Clarify validation timing, confirmations, and destructive action patterns.
  4. Tie interaction behavior to accessibility and responsive needs.

Constraints

  • Do not describe animation for its own sake.
  • Keep interactions legible to engineering.
  • Avoid unnecessary mode or step changes.

Output Format

  • interaction summary
  • event/state transitions
  • feedback behavior
  • accessibility notes

Examples

  • "Design the interaction behavior for this multi-step form."
  • "How should inline editing work here?"

saranskumar/anti-slop/tree/main/skills/interaction-designer commit 841bf436ff

Frequently asked questions

npx skillmds@latest add saranskumar/interaction-designer