team-motion-design
CommunityBuild high-performance motion systems with guardrails
Design & Creative#motion design#prefers-reduced-motion#GPU performance#animation tokens#scroll choreography#will-change budget#compositor-only
Authortcytan
Version1.0.0
Installs0
System Documentation
What problem does it solve?
It helps teams design and implement consistent UI motion by coordinating research, choreography, animation implementation, and performance/accessibility testing to avoid jank and reduced-motion regressions.
Core Features & Use Cases
- Unified motion pipeline via team-worker orchestration: Runs a structured research → choreography → animation → performance verification workflow with optional GC fix loops when FPS or compositor safety fails.
- Motion tokens and reusable choreography outputs: Produces easing/duration/stagger tokens plus scroll/choreography sequence specs suitable for both token-based and component/page motion modes.
- GPU/performance and reduced-motion compliance checks: Enforces compositor-only animation rules (e.g., transform/opacity), validates will-change budgets, detects layout thrashing patterns, and ensures prefers-reduced-motion fallbacks.
Quick Start
Ask the AI: "Run team-motion-design to create a motion-token system and implement scroll reveal animations for my UI, ensuring 60fps performance and reduced-motion fallbacks."
Dependency Matrix
Required Modules
None requiredComponents
references
💻 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: team-motion-design Download link: https://github.com/tcytan/tecton/archive/main.zip#team-motion-design 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.