EaseKitDocs
Tutorials · Using EaseKit from Claude via MCP
Documentation

Using EaseKit from Claude via MCP

Connect EaseKit to Claude Desktop or Claude Code, then create, refine, check and export animations from a Claude conversation.

EaseKit includes an MCP server, so Claude Desktop, Claude Code and other MCP clients can work on the same sessions as the app. You ask in plain words; Claude calls EaseKit's tools; the result appears in the EaseKit sidebar within a moment, with its quality score. In this walkthrough you connect Claude Desktop, create an animation, refine it, check it and export it. About ten minutes.

1. Connect Claude Desktop

  1. In EaseKit, open Settings → Claude & MCP.
  2. Click Add to Claude Desktop. EaseKit adds itself to Claude Desktop's config, keeps your other servers and backs up the old file.
  3. Quit and reopen Claude Desktop. MCP servers load at launch.
  4. In Claude Desktop, open the tools menu and check that easekit is listed.

Using Claude Code instead? Run this once:

claude mcp add easekit -- "/Applications/EaseKit.app/Contents/MacOS/easekit-mcp"
Settings → Claude & MCP with Add to Claude Desktop

2. Create an animation

In Claude, write:

Create a success check animation in EaseKit for a payment form: a green badge pops in, the check draws on, a soft ring pulses once. Calm, under a second.
  1. Claude usually reads motion_guide first, then calls create_animation with a complete spec.
  2. EaseKit validates it and runs the quality check. Claude gets the score and findings and fixes blockers with edit_animation.
  3. Switch to EaseKit: the new session is selected in the sidebar, and a banner says what arrived.
Claude Desktop creating an animation, and the result in EaseKit

3. Refine it

Ask for changes the way you would in EaseKit's own chat:

  • “Make my latest EaseKit animation snappier.”
  • “In the ‘Success Check’ session, delay the ring by 100 ms and give the badge a bit more bounce.”
  • “Undo that and try a calmer curve instead.” Claude builds on an earlier version with the version parameter.

Every edit is a new version with a note “Edited from Claude (MCP)”, and Claude gets one line per operation, the score before and after, and what changed.

4. Check it

Ask “Check the quality of my latest EaseKit animation.” Claude calls check_quality and reports the score, the six dimensions and the smoothness audit, with a suggestion per finding.

5. Export it

  • “Export it as a React component to ~/Desktop.” → export with format: react writes a .tsx file.
  • “Export Lottie.” → a .json in your Downloads folder by default.
  • “Copy the key frames as SVG for Figma.” → export_svg with frames: "keyframes".
  • “Render an MP4.” → EaseKit opens its Render sheet on the session; you pick the settings and press Render Video.

6. Import from Claude

  • “Import ~/Downloads/loader.json into EaseKit and slow the intro by 20 %.” → import_lottie, then edit_animation.
  • “Turn this SVG into an EaseKit session and draw the strokes on.” → import_svg, then a stroke_preset op.
  • “Start from the Loader template.” → list_templates and start_from_template.

What stays on your Mac

QuestionAnswer
Does the server use the network?No. It opens no ports and makes no requests
Which files can it touch?EaseKit's data folder, export paths you ask for (Downloads by default) and files you point it at
Can it delete sessions?No. Every edit adds a version
Which AI model runs?Claude's own model in the client. EaseKit's provider settings don't apply
Does EaseKit need to be open?No, for most tools. Opening a session and rendering video launch it