motion-design-skill  by LottieFiles

AI agent skill for universal motion design principles

Created 3 months ago
432 stars

Top 68.1% on SourcePulse

GitHubView on GitHub
1 Expert Loves This Project
Project Summary

Universal motion design principles for AI agents are provided by LottieFiles/motion-design-skill, enabling them to create sophisticated UI animations by focusing on timing, easing, choreography, and emotional intent. This philosophy-first, implementation-agnostic skill empowers AI to act as motion directors, improving animation quality and consistency across various platforms and animation systems without requiring specific code knowledge upfront.

How It Works

This skill employs a philosophy-first, implementation-agnostic approach, guiding AI agents through a decision-making pipeline. It adapts Disney's 12 animation principles for modern UI contexts, emphasizing understanding emotional intent, selecting appropriate motion personalities, and applying structured choreography before any animation code is generated. This methodology ensures more intentional and effective motion design outcomes.

Quick Start & Requirements

  • Install: npx skills add LottieFiles/motion-design-skill
  • Prerequisites: Supports 40+ AI agents including Claude Code, Cursor, Codex, and GitHub Copilot. It is implementation-agnostic, compatible with any animation system such as CSS, Framer Motion, GSAP, Lottie, and Spring.
  • Links: No specific quick-start or demo links are provided in the README.

Highlighted Details

  • Core reference includes an 8-step checklist, motion personality archetypes, duration/easing tables, property selection guide, common patterns, and quality rules.
  • Features deep dives into UI-adapted Disney animation principles, emotion-to-motion mapping, choreography, narrative structure, and context adaptation.
  • Provides ready-to-use recipes for entrance/exit animations, state feedback (success, error, loading, hover), ambient motion, and multi-element choreography.
  • Includes lookup tables for timing and easing, property selection guidance, and troubleshooting for common animation problems.

Maintenance & Community

The provided README does not contain specific details regarding notable contributors, sponsorships, partnerships, community channels (like Discord/Slack), or a public roadmap.

Licensing & Compatibility

  • License: MIT
  • Compatibility: Compatible with commercial use due to the permissive MIT license. Works with any animation system.

Limitations & Caveats

The skill primarily functions as a knowledge base and decision-making framework for AI agents, offering guidance and principles rather than direct code generation for specific animation systems. Developers will need to translate the provided advice into their chosen framework.

Health Check
Last Commit

1 month ago

Responsiveness

Inactive

Pull Requests (30d)
0
Issues (30d)
1
Star History
295 stars in the last 30 days

Explore Similar Projects

Feedback? Help us improve.