animation-systems
CommunityShip tasteful, accessible product motion.
Authorguilhermemarketing
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Use when designing or implementing product-grade web motion like Stripe, Linear, Apple, and Vercel. Covers motion principles, easing/duration defaults, choreography patterns, scroll/hover interactions, performance, accessibility (reduced motion), and implementation guidance.
Core Features & Use Cases
- Motion primitives (fade, slide, scale) to create clear hierarchies and polished UX.
- Defaults and choreography patterns for consistent, accessible motion across products.
- Implementation guidance for design-to-code handoff and performance considerations.
Quick Start
Use a Stripe-like motion system to define a minimal token set (durations, easing, offsets) and a simple hero-to-content sequence for a new UI.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: animation-systems Download link: https://github.com/guilhermemarketing/esc-skills/archive/main.zip#animation-systems Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.