Skip to content

Lottieditor guides

Design motion with an AI assistant and an editable timeline

Describe the shapes and movement you want. Your connected assistant edits the open project, and you can adjust the result with the same canvas and timeline controls.

Start with a small, verifiable animation

Loading the example...

This example uses a circle, a shadow, and a one-second loop. Its positions, colors, and scale tracks remain editable. Download the project, inspect the middle keyframe, and adjust the bounce height.

Use AI for the first pass and repeated edits

Ask for a clear starting composition: canvas size, named layers, colors, and timing. Once it exists, ask the assistant to move a keyframe, adjust several selected shapes, or apply a preset. Preview a specific frame before changing more. You can keep the parts you like and edit the rest yourself.

  • Create a loading indicator from a simple shape description.
  • Adjust repeated timing or position changes across editable layers.
  • Try another color or bounce height while preserving the rest of the composition.
  • Inspect layer names and keyframes to understand an unfamiliar project.

The output is a design you can inspect

The assistant changes actual vector layers and keyframes in the editor. You can select a shape, move its points, change its fill, or adjust timing after the assistant finishes. Use Undo to reverse a batch. This workflow does not turn a generated video back into editable vector artwork.

Bring your own assistant

Choose Connect Agent in an open project. Pair a compatible MCP assistant or terminal agent using the generated instructions. Lottieditor supplies the editing tools and browser previews; your chosen provider supplies the model. Provider subscriptions and any model usage are separate.

Follow the setup guide for Claude Code, Codex, or Cursor.

Review the motion before exporting

Check the shape at the beginning, middle, and end. Play several loops and look for clipping or a jump at the boundary. For small interface animations, inspect the actual display size and provide a reduced-motion state. An assistant can help iterate, but its first result still needs your review.

Project backups are available on every plan. Free accounts get five watermarked GIF exports each month. Pro adds unwatermarked Lottie, dotLottie, GIF, and supported video formats. View export plans.

Where the connection has limits

The assistant can import supported assets, edit the open paired project, and export with your normal account permissions. Generic imported Lottie internals remain a composition rather than native editable layers. Close or end the connection when finished. See the MCP setup and tool reference for the exact supported operations.