interaction-patterns

What problem does it solve?

This Skill addresses common challenges in UI development by providing codified patterns for user interaction, ensuring a smooth, accessible, and efficient user experience across various components.

Core Features & Use Cases

• Loading States: Implements skeleton loading, spinners, and progress bars for effective perceived performance.
• Content Interaction: Offers patterns for infinite scroll, progressive disclosure, and tab overflow handling.
• Overlay Components: Guides the use of modals, drawers, and inline selections for clear user flows.
• Accessibility: Ensures keyboard alternatives for drag-and-drop and proper ARIA usage for all interactive elements.
• Use Case: When building a product listing page, use the infinite scroll pattern to load more items seamlessly as the user scrolls, and implement skeleton loaders to maintain a fluid experience while data is fetched.

Quick Start

Implement skeleton loading for a list of user profile cards that are fetched from an API.