Interaction Design

Covers the fundamentals of feedback patterns and state handling with practical React examples for loading skeletons, error messages, and empty states. Includes a helpful timing reference table showing microinteractions should stay under 200ms while entrance animations can stretch to 500ms. The accessibility reminders about prefers-reduced-motion and screen reader announcements are solid. Most useful when you're implementing those in-between moments that make interfaces feel responsive rather than just functional. The CSS shimmer loader is ready to copy-paste, and the guidelines around immediate feedback and keyboard navigation hit the important points without overcomplicated patterns.

Install to Claude Code

npx -y skills add secondsky/claude-skills --skill interaction-design --agent claude-code