owl-listener/micro-interaction-spec
interaction-design/skills/micro-interaction-spec/SKILL.md
Specify micro-interactions with trigger, rules, feedback, and loop/mode definitions.
$ install --global
skillsauthnpx skillsauth add owl-listener/designer-skills micro-interaction-specInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: May 15, 2026, 5:31 AM139.7s1 file scanned
SKILL.md
- name:
- micro-interaction-spec
- description:
- Specify micro-interactions with trigger, rules, feedback, and loop/mode definitions.
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-interaction: name, trigger, rules (sequence), feedback (visual/audio/haptic), duration/easing, loop behavior, accessibility considerations.
Best Practices
- Every micro-interaction should have a purpose
- Keep durations short (100-500ms for most)
- Provide immediate feedback for user actions
- Respect reduced-motion preferences
- Test on target devices for performance
Related Skills
owl-listener/business-design
tools
VerifiedTrustedCommunity
A practitioner's toolkit for thinking and communicating as a designer in a business context — reading financials, mapping competitive landscapes, and defending design decisions in the language of value.
1,535SKILL.mdUpdated Jun 12, 2026
owl-listener/interfaces-that-feel
testing
VerifiedTrustedCommunity
Apply an emotional resonance lens to any UI. Use when a design is technically correct but flat — to identify what's missing and prescribe specific changes at the copy, motion, and interaction layer.
1,535SKILL.mdUpdated Jun 12, 2026
owl-listener/test-scenario
testing
VerifiedTrustedCommunity
Generates structured usability test scenarios with realistic tasks, success criteria, and facilitation notes — ready to run with real participants or in a moderated session.
1,535SKILL.mdUpdated May 15, 2026
owl-listener/interview-script
research
VerifiedTrustedCommunity
Create a structured user interview script with warm-up, core exploration, and wrap-up sections. Use when preparing for user research interviews to ensure consistent, insightful conversations.
1,535SKILL.mdUpdated May 15, 2026