Motion Graphics Skills for Claude Code, Codex & AI Agents

These skills help an agent plan and animate graphic elements for short films and product stories. Members cover Lottie, showreels, product motion, image animation, hand-drawn motion, and kinetic effects.

24 skills

Explore Motion Graphics skills

8 skills

Build or audit interface motion using context-sensitive design guidance and an HTML or terminal report.

  • motion design
  • animation
1.6KStars121Forks
Repository last pushed

Building Animations

Emil Kowalski

Build an animation from scratch, making the decisions in the order that determines whether it feels right — should it animate at all, what purpose, which tool, which properties, which curve and duration, how it interrupts, how it exits. Writes the implementation. Use when asked to animate something, add motion, make a component feel alive, or build a transition. For critiquing existing motion use review-animations; for auditing a whole codebase use improve-animations.

  • web animation
  • motion design
57KStars3.3KForks
Repository last pushed
Lemomo’s animated Lemo-Wake README cover, showing example image-to-animation transformations around the orange title panel.
Free
Video & Motion

Lemo-Wake Image Animation

Turn one picture into an approximately five-second seamless loop in MP4 or GIF, with WebP, sticker GIF and macOS Live Photo exports on request.

339Stars44Forks
Repository last pushed
Animated dialog specification drawing with dimension lines, camera pullbacks, and an exploded layer view.
Free
Video & Motion

Dimensional Drawing Motion

Animate a finished dimensional drawing into an 8–15 second film with progressive strokes, camera moves, and lifted layers, using Claude Motion or a headless renderer.

2.1KStars149Forks
Repository last pushed

Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop in; "the iOS rubber-band scroll" → Rubber-banding). Use when the user asks "what's it called when…", or describes a motion effect without knowing its name and wants the right word to prompt an AI or designer with. For naming an effect, not designing or building one.

  • animation
  • motion design
57KStars3.3KForks
Repository last pushed
Cinetic Motion Design — cinetic
Free
Video & Motion

Cinetic Motion Design

Direct and render cinematic product films, feature loops, logo stings, and UI motion pieces using a code-based production workflow.

1.2KStars68Forks
Repository last pushed
LottieFiles Motion Design — dotLottie Animation
Free
Web & UI

LottieFiles Motion Design

Apply timing, easing, choreography, and animation principles to purposeful UI motion and transitions.

3KStars205Forks
Repository last pushed

Create graphic, text and interface motion videos as MP4 with editable source.

  • animation
  • motion-design
15KStars1.7KForks
Repository last pushed

Related topics

Related guides

How to choose Motion Graphics skills

Choose a motion-design entry for typography and transitions, Lottie for reusable vector animation, and showreel or product-video skills when the sequence needs a polished story.

  • Create a kinetic title sequence
  • Animate a still image into a short scene
  • Build a Lottie motion graphic