← Back to Blog

How to Connect MockClip to Claude and ChatGPT via MCP

·Updated ·14 min read

Claude, ChatGPT and any other MCP client can drive MockClip directly: describe a conversation in plain English, and the assistant hands back a link that opens the animation editor with the whole clip already built. Preview, adjust, export.

This guide covers the setup for both clients, the 22 tools the server exposes, the frame and export fields every tool accepts, what the reply actually contains, the limits that apply, and how to pull the finished MP4 down from a script.

A ChatGPT template clip of the kind create_chatgpt_conversation returns a link to — streaming text, thinking indicator, dark interface.

What MCP does here, and what it does not

The Model Context Protocol is a standard way for an AI assistant to call external tools. Once MockClip is connected, you can say "make a fake Tinder clip with three profiles, swipe right on the last one and make it a match" and the assistant calls create_tinder_animation with a configuration it wrote, then returns a link.

It is worth being precise about the division of labour, because it decides what you can expect:

  • The model writes the clip's data. Messages, sender names, delays, typing flags, read receipts, reactions, screen flows, themes — the arguments of a tool call.
  • MockClip renders the video. Deterministically, in your browser, from that data. The renderer is not a model; nothing is generated at render time. Open the same link twice and you get the same frames twice.
  • Nothing is rendered on a server. The export happens in the tab you open the link in, which is why the file lands in your downloads folder and never in an inbox.

That split is the useful part. A scripted clip is repeatable, so you can iterate on pacing and wording without a model handing you different output on every take.

The MockClip editor open on a ChatGPT-style conversation, ready to preview and export

Step 1 — Get an API key

  1. Sign in at mockclip.com with Google or GitHub.
  2. Open mockclip.com/account.
  3. Click Generate. The raw key appears once and starts with sk_mc_. Copy it immediately — the server only stores a hash of it, so it cannot be shown again. If you lose it, revoke and generate another.
  4. The same panel then shows two ready-made things: a Claude Desktop URL with the key already embedded, and a config-file snippet for clients that take a header.

You can hold three active keys at once. Label them per client ("Claude Desktop", "laptop", "CI") so a revoke only breaks the one you meant.

Step 2 — Connect Claude Desktop

Option A — the connector dialog (about a minute).

Claude Desktop's "Add custom connector" dialog has a URL field but no separate token field, so the key rides in the URL.

  1. Settings → Connectors → Add custom connector.
  2. Paste the Claude Desktop URL from your account page. It looks like https://mockclip.com/api/mcp?key=sk_mc_....
  3. Leave the OAuth fields empty — see the authentication section below.
  4. Save, then restart Claude Desktop once.

Treat that URL exactly like a password: anyone holding it can call the server as you. Revoke it on /account if it leaks.

Option B — the config file (key in a header).

If you would rather keep the key out of a URL, put it in claude_desktop_config.json (macOS: ~/Library/Application Support/Claude/, Windows: %APPDATA%\Claude\):

{
  "mcpServers": {
    "mockclip": {
      "url": "https://mockclip.com/api/mcp",
      "headers": { "Authorization": "Bearer sk_mc_YOUR_KEY_HERE" }
    }
  }
}

Restart Claude Desktop and ask "what MCP tools do you have?" — the MockClip tools should be listed.

Step 3 — Connect ChatGPT or any other MCP client

The endpoint is a plain streamable-HTTP MCP server, so the setup is the same shape everywhere:

  • URL: https://mockclip.com/api/mcp
  • Auth header: Authorization: Bearer sk_mc_YOUR_KEY_HERE
  • Fallback: append ?key=sk_mc_... to the URL when a client cannot send a header

In ChatGPT that lives under Settings → Connectors. Whether the option appears depends on your account's plan and OpenAI's current rollout — if you cannot find it, use Claude Desktop, Claude Code or another MCP client against the same endpoint; the key does not care which client holds it.

Server-sent-events transport is disabled, so point clients at the streamable-HTTP transport rather than the legacy SSE one.

The tools

Twenty-two tools are registered — one per template. They appear in this order, which is the order tools/list returns:

ToolTemplate
create_chatgpt_conversationChatGPT chat
create_imessage_conversationiMessage chat
create_telegram_conversationTelegram chat
create_facebook_messenger_conversationMessenger chat
create_discord_conversationDiscord DM
create_x_feedX timeline
create_slack_conversationSlack channel
create_gemini_conversationGemini chat
create_shopify_notificationShopify store banners
create_stripe_notificationStripe payment banners
create_gmail_inboxGmail inbox
create_whatsapp_conversationWhatsApp chat
create_instagram_dm_conversationInstagram DM
create_tinder_animationTinder swipes and match
create_reddit_threadReddit post and comments
create_phone_callIncoming call
create_phone_call_notificationCall banner
create_imessage_notificationiMessage banners
create_brand_free_notificationsLock-screen banners, no brand
create_brand_free_text_chatChat, no brand
create_brand_free_ai_assistant_chatAssistant chat, no brand
create_brand_free_dating_swipeSwipe cards, no brand

The last four are the brand-free templates. They draw the same formats without any real company's design, which is what the terms point you at for client work and paid ads — see brand-free app mockups for ads. The full list, with the supported image hosts, also lives on the integrations page.

Each tool's input schema mirrors its editor. create_chatgpt_conversation, for instance, takes up to twenty messages with per-message delayBefore, streamingSpeed, showTyping, an error string, an action indicator and an image, plus clip-level model (the header title), incognito, theme, the welcome-screen toggles, a headerBanner and keyboard. If a field exists in the editor, the tool almost certainly has it.

The frame and export fields every tool accepts

On top of its own arguments, every tool takes the same eight framing fields. These are the ones worth knowing, because they are what turn "a clip" into "a clip in the right shape for the platform":

FieldWhat it does
videoFormat9:16, 9:19.5 (iPhone), 3:2 or 1:1. Applies with showBezel false; chat templates lay the conversation out to fit a square
showBezelDraw the iPhone bezel around the screen (default true)
sceneIdComposite the clip onto real footage of a hand holding a phone: outdoors, bookshelf, two-hands, on-desk, dim-room, plus the landscape city-wide, desk-wide, neon-wide and studio-wide
exportFormatmp4 (default), gif, webm (VP9) or mov (ProRes 4444). The last two keep an alpha channel
exportQuality720p or 1080p at 15, 24, 30 or 60 fps, e.g. 1080p-30. Default 720p-30
showStatusBarThe iOS status bar. Always drawn inside the bezel, so turn the bezel off too
showHomeIndicatorThe home bar at the bottom
textScaleZoom the whole phone UI from 1 to 1.5 in steps of 0.1, for when one short exchange should fill the frame

Ask for "a square clip with no phone frame" or "Full HD, no status bar" and the link opens in that framing. Three of these degrade gracefully rather than failing: a transparent background, 60 fps and hand-held scenes need a paid plan, so on a plan without them the clip is built at the nearest supported setting and the reply tells you which substitution happened. The export settings guide covers what each combination is good for, and the square export guide covers 1:1 specifically.

What comes back

A successful tool call returns one block of text with four parts:

  1. A plan note — whether the export will carry a watermark on your account, and what removes it.
  2. A one-line summary of what was built, including the framing.
  3. The link — a https://mockclip.com/e/<id> shortlink.
  4. An export note, plus a footer listing any image URLs that were dropped.

Opening the shortlink redirects to the template page with the configuration attached and autoExport=1, which means the export starts as soon as the canvas is ready. You do not have to press anything; the file downloads when the render finishes. If you want to change something first, hit cancel and the clip is sitting there in the editor.

Shortlinks are written once and never deleted, so a link from last month still opens the same clip.

Image URLs

Avatars, message images, backgrounds and media slots take ...Url fields, and those URLs must be https and served from an allowlisted host:

images.unsplash.com, plus.unsplash.com, i.imgur.com, imgur.com, res.cloudinary.com, upload.wikimedia.org, commons.wikimedia.org, images.pexels.com, media.giphy.com, i.giphy.com, picsum.photos, fastly.picsum.photos, cdn.openai.com, oaidalleapiprodscus.blob.core.windows.net and replicate.delivery.

Anything else is dropped — not an error, but not silent either: the reply ends with a note naming each dropped field and pointing at /integrations. If an avatar came back empty, that footer is the first place to look. Uploading an image by hand in the editor always works, whatever the host.

Limits

Two separate limits apply, and they fail in different ways.

Renders. Every tool call that builds a clip counts as one MCP render against your plan's allowance. The allowance is per plan and per period, and the pricing page lists the current numbers for each; the free plan's allowance is a small lifetime one, the paid plans are monthly or daily. Going over returns a readable message rather than an error code, and the message names what the paid plans include. The manual editor stays unlimited — the meter is only on clips an assistant builds.

Burst. Tool calls are also capped per minute: five a minute on the free plan, sixty on the paid plans, returning a 429 with retry-after: 60. Handshake and list requests (initialize, tools/list and friends) go in a separate bucket of sixty a minute, so a client reconnecting never eats your tool-call budget. A batched request with three tool calls in it costs three.

Pulling the MP4 down from a script

Because export is client-side, automation needs a browser engine. A plain curl of a shortlink gets you the editor page's HTML, not a video. Playwright does the job in about fifteen lines, and because shortlinks auto-run the export, the script only has to open the link and catch the download:

npm install playwright
npx playwright install chromium
// fetch-mockclip.js
const { chromium } = require("playwright");

(async () => {
  const [url, out = "out.mp4"] = process.argv.slice(2);
  const browser = await chromium.launch();
  const ctx = await browser.newContext({ acceptDownloads: true });
  const page = await ctx.newPage();
  await page.goto(url, { waitUntil: "domcontentloaded", timeout: 60_000 });
  const download = await page.waitForEvent("download", { timeout: 600_000 });
  await download.saveAs(out);
  await browser.close();
  console.log("Saved", out);
})();
node fetch-mockclip.js "https://mockclip.com/e/abc123" my-video.mp4

Give the download event a generous timeout. The render is real encoding work in a real browser: on a small machine a multi-screen clip can take a couple of minutes, and Full HD or 60 fps multiplies that. Chromium is also substantially faster at it than Firefox. Pair this with the MCP server in an agent and you have a prompt-to-MP4-on-disk pipeline with no manual step in it.

Authentication, honestly

The server authenticates with a bearer API key and nothing else today. There is no OAuth flow: the 401 challenge deliberately advertises ApiKey rather than Bearer, because clients and directory crawlers read a Bearer challenge as an offer of OAuth that this server does not make.

What follows from that:

  • The key is the credential. Treat the ?key= URL form as a password in a URL, which is what it is.
  • Keys are stored as hashes, so a leak of the database does not leak usable keys — but it also means a lost key can only be replaced, not recovered.
  • Revoking is instant from /account, and each key's creation date, last use and the IP it was last used from are listed there, so an unfamiliar entry is visible.
  • Three keys per account means you can rotate one client without logging the others out.

Example prompts

  • "Make a fake ChatGPT conversation where someone asks for career advice and gets a careful reply — show the searching indicator first."
  • "Create an iMessage between 'Mom' and me where she asks when I'm coming home for dinner, with a typing bubble before her reply."
  • "Build a Tinder animation with three profiles, swipe right on the last one, make it a match and continue into the chat."
  • "Fake a Reddit thread in r/AskReddit with a funny top comment chain."
  • "Make a WhatsApp chat where my landlord agrees to the dog — 1:1 square, no phone frame."
  • "Three iMessage notification banners arriving one after another on a lock screen, then export as a transparent WebM."

The more specific the pacing language, the less you will have to fix in the editor. "Short pause, then she types for two seconds" lands better than "make it realistic".

Troubleshooting

  • 401 Unauthorized. The key is mistyped, missing the Bearer prefix, or revoked. Check it at /account.
  • 429 after one call. You hit the per-minute cap (five a minute on the free plan). Wait sixty seconds.
  • A message about renders rather than an error. That is the render allowance, not the burst cap. The pricing page has the per-plan numbers; the manual editor is unlimited in the meantime.
  • No tools listed. Restart the client fully after adding the connector — most clients only read the server list at startup.
  • An avatar or image is missing. Read the dropped-URL footer at the end of the reply; the host was not on the allowlist.
  • The MP4 is not transparent. MP4 and GIF have no alpha channel. Ask for exportFormat: "webm" or "mov", on a plan that includes professional export — see transparent notification video export.
  • The clip came back without the scene or at 30 fps. Those are the plan fallbacks described above; the reply says which one applied.
  • A shortlink 404s. Only a malformed or truncated id does that — check the link survived copy-paste intact.

If you would rather not configure a client

Every template page has the same capability built in. Describe it is the default panel on each /app/<slug> page: type what should happen, and the clip is written for you, with a "what happens when" list of seconds you can point at to refine ("at 0:04 make her reply angrier"). It needs a Google or GitHub sign-in, and the result opens in the manual editor. See the Describe it guide for how that compares with driving the tools from an assistant.

The practical difference: Describe it is faster for one clip, MCP is better when the clip is a step in something larger — a batch of ad variants, a documentation screenshot set, an agent that posts on a schedule.

Related templates and guides

Frequently Asked Questions

Is MockClip's MCP server free to use?

Connecting is free and the API key costs nothing. Making clips through MCP is metered: each tool call that builds a clip counts as one MCP render, and the free plan includes a small lifetime allowance. The manual editor at mockclip.com is unlimited, so the meter only applies to clips an assistant builds for you. The pricing page lists the per-plan render allowance.

Does it work with ChatGPT as well as Claude?

Yes — the server is a plain streamable-HTTP MCP endpoint with a Bearer token, so any client that can add a custom MCP server works. Whether your ChatGPT account exposes the Connectors UI depends on your plan and OpenAI's rollout; if you cannot see it, Claude Desktop or any other MCP client reaches the same endpoint with the same key.

Does the AI generate the video itself?

No. The assistant writes the clip's configuration — messages, names, delays, typing, statuses — and MockClip returns a link. The video itself is rendered deterministically by the canvas renderer in your own browser when you open that link, so the same link always produces the same frames.

What happens if my API key stops working?

A 401 response means the key was mistyped, sent without the Bearer prefix, or revoked. Open mockclip.com/account, revoke the old key, generate a new one and paste it into your client again. You can hold three active keys at a time, so you can rotate one client at a time.

Can I download the MP4 from a script instead of a browser?

Yes, but you need a real browser engine. Export runs client-side, so a plain curl against a shortlink returns the editor page HTML rather than a file. Drive a headless Chromium with Playwright, open the link and catch the download event — MockClip shortlinks start the export on load, so no clicking is needed.

Do the links the assistant returns expire?

No. Each tool call stores its configuration behind a /e/ shortlink that is written once and never deleted, so you can reopen the same clip later or share the link with someone else. The manual editor has no save or share feature of its own — an unsaved draft there only survives a reload in the same tab.

Related Articles