# Make your first animation
Connect your MCP client, create a looping animation, refine a preview, and export your first file.

Make a simple pulsing indicator, refine its motion, and download a Lottie file. You need a [LottieFiles account](https://lottiefiles.com/) and an MCP client that supports remote connections with OAuth.

<Steps>
  <Step title="Connect your MCP client">
    Add this server using your client's MCP settings:

    ```text
    https://creator.mcp.lottiefiles.com/mcp
    ```

    For Claude Code, run:

    ```bash
    claude mcp add --transport http --scope user creator-mcp https://creator.mcp.lottiefiles.com/mcp
    ```

    Then run `/mcp` inside Claude Code and select **creator-mcp** to sign in. Complete the LottieFiles sign-in and consent screen in your browser.

    Using Claude or ChatGPT in your browser or desktop app? Follow the [no-terminal setup](/en/developers/creator-mcp/connect#claude-and-chatgpt-no-terminal). For other clients, see [Connect your MCP client](/en/developers/creator-mcp/connect#developer-tools). Then return here.
  </Step>

  <Step title="Create a loop">
    Send this prompt:

    > Use Creator MCP to create a new animation called first-loop. On a 256 × 256 canvas, make a teal circle gently pulse in size over two seconds at 30 fps. Keep it centered and make the loop seamless. Name the circle pulse. Show me an eight-frame filmstrip before exporting.

    **What to expect:** one image showing eight moments, read left to right, top to bottom. The circle grows and returns to its starting size. A filmstrip shows sampled frames; it is not a playing video.
  </Step>

  <Step title="Refine the same scene">
    > In first-loop, make pulse grow a little less and ease more gently into its largest size. Keep the duration and color. Show me another filmstrip.

    The agent edits the existing animation. You can keep refining without describing the whole animation again.

    **See it play (Claude and ChatGPT):** ask "Show me first-loop playing." The animation plays in the chat.

    To point at what to change, select **Comment** in the playing animation, click the circle, type your note, and select **Add comment**. Then select **Send 1 to chat**. See [Preview & refine in chat](/en/developers/creator-mcp/preview).
  </Step>

  <Step title="Download your animation">
    > Export first-loop as Lottie JSON named first-loop.json and give me the download link.

    Open the link to download your animation. To watch a rendered version, ask for an MP4 too. Video encoding runs in the background; the agent checks until it is ready.
  </Step>
</Steps>

## Keep going

<Grid columns={2} gap="lg">
  <Card title="Try your own brief" href="/en/developers/creator-mcp/workflows" variant="interactive">
    Start from artwork, a product image, or one of the example prompts.
  </Card>

  <Card title="Choose your output" href="/en/developers/creator-mcp/exports" variant="interactive">
    Export transparent video, a full-size still, or save to your workspace.
  </Card>
</Grid>

No preview or unable to sign in? See [Troubleshooting](/en/developers/creator-mcp/troubleshooting).
