interaction-design

Microinteractions, motion design, and state transitions that enhance UI polish and user feedback.

wshobson ↓ 11k

Claude Code

View source ↗

What it does

Adding microinteractions to enhance user feedback
Implementing smooth page and component transitions
Designing loading states and skeleton screens
Creating gesture-based interactions
Building notification and toast systems
Implementing drag-and-drop interfaces
Adding scroll-triggered animations

Derived from the skill's own SKILL.md documentation · extracted 2026-07-23

Microinteractions, motion design, and state transitions that enhance UI polish and user feedback.

Source

Repository: https://github.com/wshobson/agents

interaction-design FAQ

What does the interaction-design skill do?

Design and implement microinteractions, motion design, transitions, and user feedback patterns. Use when adding polish to UI interactions, implementing loading states, or creating delightful user experiences. Adding microinteractions to enhance user feedback Implementing smooth page and component transitions

How do I install interaction-design?

Run: npx -y skills add https://github.com/wshobson/agents --skill interaction-design --agent claude-code — the source lives at github.com/wshobson/agents.

Maintain interaction-design?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

[![interaction-design on getagentictools](https://getagentictools.com/badge/skills/wshobson-agents-interaction-design.svg)](https://getagentictools.com/skills/wshobson-agents-interaction-design?ref=badge)

npx agentictools info skills/wshobson-agents-interaction-design

The second line is the CLI lookup for this page — handy in READMEs and docs.