Do I need After Effects to use these animations?

No, this skill generates standalone Lottie JSON files that can be rendered natively on web, iOS, and Android using standard Lottie player libraries.

Can I use this to animate existing website logos?

Yes, by providing an SVG file, the skill analyzes the path structure to create professional animations such as 'draw-on' effects, staggered entrances, or elastic bounces.

Can it handle morphing between two different icons?

Yes, it includes logic to match vertex counts between shapes, enabling smooth path-morphing transitions for UI elements like hamburger menus turning into 'X' icons.

Does it support complex character rigging?

Yes, the skill utilizes layer parenting to create bone-like hierarchies, allowing for complex movements where limbs follow the body naturally.

How do I preview the generated Lottie JSON?

After the skill generates the JSON file, you can validate its structure via the terminal and preview it instantly by uploading it to tools like LottieFiles or your local development environment.

Lottie Animator

Name: Lottie Animator
Author: obeskay

byobeskay

•

Design Tools

Generates professional Lottie animations from static SVGs directly in your terminal, eliminating the need for After Effects.

Lottie Animator is a specialized Claude Code skill designed to transform static SVG graphics into high-quality, production-ready Lottie JSON animations. By leveraging professional motion design principles such as easing, squash and stretch, and follow-through, it allows developers to create complex logo reveals, UI transitions, and character walk cycles through AI-driven code generation. It handles the intricate math of Bezier curves and path morphing while providing advanced features like layer parenting and frame-by-frame animation, making it an essential tool for frontend developers looking to enhance web and mobile apps with lightweight vector motion.

Key Features

01Applies professional easing curves for organic, high-end motion graphics

02Automates complex character animations using hierarchical layer parenting

03Converts static SVG paths into animated Lottie JSON structures automatically

04Implements frame-by-frame animation for professional-grade walk and run cycles

05Supports advanced techniques including path morphing and trim path drawing

063 GitHub stars

Use Cases

01Creating lightweight, high-performance loading spinners and UI feedback icons

02Building character-driven animations and complex vector transitions without design software

03Generating interactive logo animations and branding assets for web and mobile

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add obeskay/lottie-animator-skill lottie-animator

For use in Claude.ai and ChatGPT

Download Skill