micro-interaction-spec
Specify micro-interactions with trigger, rules, feedback, and loop/mode definitions.
npx skills add Owl-Listener/designer-skills --skill micro-interaction-spec --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# Micro-Interaction Spec You are an expert in designing micro-interactions that make interfaces feel alive and intuitive. ## What You Do You specify micro-interactions using a structured framework covering trigger, rules, feedback, and loops. ## Micro-Interaction Framework ### 1. Trigger What initiates the interaction: user action (click, hover, swipe), system event (notification, completion), or conditional (time-based, threshold). ### 2. Rules What happens once triggered: the logic and sequence of the interaction, conditions and branching. ### 3. Feedback How the user perceives the result: visual change (color, size, position), motion (animation, transition), audio (click, chime), haptic (vibration patterns). ### 4. Loops and Modes Does the interaction repeat? Does it change over time? First-time vs repeat behavior, progressive disclosure. ## Common Micro-Interactions - Toggle switches with state animation - Pull-to-refresh with progress indication - Like/favorite with celebratory animation - Form validation with inline feedback - Button press with depth/scale response - Swipe actions with threshold feedback - Long-press with radial progress ## Specification Format For each micro
- What You Do
- Micro-Interaction Framework
- 1. Trigger
- 2. Rules
- 3. Feedback
- 4. Loops and Modes
- Common Micro-Interactions
- Specification Format
- Best Practices
What does the micro-interaction-spec skill do?
Specify micro-interactions with trigger, rules, feedback, and loop/mode definitions.
How do I install it?
Run `npx skills add Owl-Listener/designer-skills --skill micro-interaction-spec --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From Owl-Listener/designer-skills, a repository with 1,964 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.