MCP Server

Give AI models and agents a secure, standardized way to edit, personalize, and analyze your Supademo demos, showcases, and Demo Hubs using natural language.

What is an MCP? How does it work with Supademo?

The Supademo Model Context Protocol (MCP) server gives compatible AI models and agents a secure, standardized way to access and work with demos, showcases, and Demo Hubs on your Supademo workspace.

That means tools like Claude, ChatGPT, or Gemini can help with real demo workflows like listing demos, updating hotspot or voiceover text, replacing outdated screenshots, generating trackable links in bulk, organizing folders, translating a demo into Spanish with voiceovers, publishing a new version, or curating a Demo Hub - using natural language instead of manual step-by-step editing.

Overview

Supademo MCP makes it easier to turn natural-language requests into real demo work. Any editing or personalization that is available within the Supademo editor is now available through Claude, ChatGPT, Gemini, and more.

Here's an example LLM prompt that would update a Supademo via MCP: Update this Supademo (cmewzomb200ci0m0jgnfi4xgm) by ensuring each step has a zoom applied to it, in variations of 70-100%, centered around the hotspot. Next, update the all of the hotspots to be black (#000) and change the hotspots to have a dark backdrop, and set the labels to be "Previous" and "Next" with a yellow (#FFC000) background color.

This is especially useful for teams managing many demos across multiple personas, use cases, regions, or stages of the funnel.

Getting started

1. Configure

Claude Web/Desktop

Supademo MCP is now available directly in Claude's connectors list — no custom setup required!

Open Claude.ai in your browser and log into your account.
Click your Profile icon in the bottom-left corner.
Select Settings > Connectors.
Find/Search Supademo in the connectors list and click Connect.
Authenticate using your Supademo account.
Use it in the chat interface by prompting via text or voice!

Claude Code

Open a terminal and run:
```
claude mcp add --transport http supademo https://mcp.supademo.com/mcp
```
(Add --scope user if you want it available across all your Claude Code projects. Default scope is local, i.e. this project only.)
Start (or restart) Claude Code in your project, then run the /mcp slash command.
In the /mcp panel, select Supademo, then choose Authenticate — your browser will open to Supademo's login and redirect back after OAuth completes.
Back in /mcp, confirm the status shows connected. Type / and you should see Supademo tools appear in autocomplete.
Use it by prompting in the chat — e.g. "list my Supademo workspaces" or "upload this image to my demo."

ChatGPT

Supademo is now available directly in ChatGPT's plugin list — no Developer mode or custom app setup required!

In ChatGPT, click your profile (bottom-left of the sidebar) to open account settings.
Select Settings.
Open the Plugins tab.
Click Browse plugins.
Type Supademo into the search bar.
Click the + button next to Supademo to install it.
Click Authorize (or log in with your Supademo credentials when prompted) to connect ChatGPT to your Supademo account.
Supademo is now installed and ready to use.
Start a New chat or Use it in any chat by mentioning Supademo in your prompt, or by clicking the + / Tools picker in the composer and selecting Supademo.

Cursor

Open Cursor and press Cmd + Shift + J (macOS) or Ctrl + Shift + J (Windows/Linux) to open Cursor Settings.
In the sidebar, select Tools & Integrations (older builds: Features → MCP).
Click + Add Custom MCP (or New MCP Server) — this opens ~/.cursor/mcp.json for editing.

Add the Supademo entry inside mcpServers, save, and close:

{
  "mcpServers": {
    "Supademo MCP": {
      "url": "https://mcp.supademo.com/mcp"
    }
  }
}

Back on the Tools & Integrations page, click the Needs Login / Authenticate button that appears next to "Supademo MCP".
A browser window opens on Supademo — sign in and approve access. Cursor will redirect back automatically.
Confirm the entry shows a green dot and the Supademo tools appear under Available Tools.
Open the chat panel (Cmd + L), switch the mode selector to Agent, and prompt normally. Cursor will invoke Supademo tools as needed (asking for approval on each tool the first time).

Copilot

Go to the Tools page for your agent in Copilot Studio.
Select Add a tool.
Select New tool.
Select Model Context Protocol. The MCP onboarding wizard appears.
Fill in the required fields: Server name - Supademo MCP Server description - Edit Supademos using MCP Server URL - https://mcp.supademo.com/mcp
Select the authentication type as OAuth 2.0 (Dynamic Discovery).
Create and connect it to the agent.

2. Create or choose a Supademo

If you haven't already done so, create a Supademo by using the Chrome Extension or Desktop App. After installing, you'll be able to create your first interactive demo in under five minutes.

3. Prompt AI

Once you have configured your MCP, you can:

Authenticate your IDE or LLM with Supademo
Prompt the agent and specify that which demo you'd like to make changes to by pasting in your Supademo's ID or link.
Approve any of the requests the agent makes or provide additional context as requested

Prompt tips

Be as specific as you can be for the best results
Start with a small prompt (i.e. changing a hotspot text in a single page, changing the description of a demo, generating voiceovers). After that, you can move on to chained prompts that contain multiple requests in one query.

Example prompt

"For the demo cmnq9hezs0059kwxa0b09myai, update all of the hotspots to have black (#000) background, and make all the hotspot label backgrounds #FFEA00. Next, generate short voiceovers for each of the steps using 'Richard Yu' as the voice, but using shorter, direct variations of the existing hotspot for the voice."

4. Review and tweak changes

Visually review the changes made by the MCP server in real time by refreshing your Supademo editor. From here, you can make additional edits by prompting your AI, or by augmenting your requests with the visual Supademo editor.

Important Note

Once you've applied changes via the MCP, be sure to do a hard refresh (Command + Shift + R) on your Supademo page.

5. Give us feedback!

Got an idea that would make Supademo MCP more useful for you? Drop it in the form below:

Available features in Supademo MCP

Workspaces & Demos

Tool

What it does

Key capabilities

list_workspaces

List workspaces you have access to

Returns id, name, role, plan

list_demos

List demos in a workspace

Search by title, filter by folder, paginate, scope: me or workspace

get_demo

Fetch full demo tree

Include: steps, hotspots, chapters, buttons, formFields, links

duplicate_demo

Clone a demo with all content

Auto-titles "<original>(Copy)" — rename via update_demo_settings

merge_demos

Combine 2–50 demos into a new one

Array order = step order; optional title & shared flag

move_demos

Move demos between locations

Personal, Shared, or Folder

(up to 100 at once)

Edit Demo Settings

Field group

What you can change

Example fields

Title & state

Rename, archive, restore

title, archived

Appearance

Brand, watermark, layout

color, font, darkmode, border, fullWidth, topBar, brandLogo, watermarkText, watermarkLink, showWatermark, mobileHotspotView

Background

Demo-level background

background: { type, value } — Color, CustomColor, Gradient, Pattern, Url

CTA

Global call-to-action button

text, color, textColor, link

Behavior / Autoplay

Playback controls

autoplay, autoplayDuration, autoPlayDelay, loop, showPlayPause, progressBar, showPlayBar, nextButton, showSteps, customizePerStep

Sharing

Visibility & access

shared, allowDuplicate, allowExternalComments, indexable, displayAuthor, displayDescription, domainURL, showSupademoLink, sendNotification

Hotspot defaults

Defaults for new hotspots

textVisible, animationVisible, opacity

Metadata / SEO

Embed & preview metadata

metaDescription, customMetadataImage, detectBrowserLanguage, showCCButton

Audio

Background music

recordOwnVoice, backgroundMusicUrl, backgroundMusicVolume

Steps

Tool

What it does

Key capabilities

create_steps

Add regular or chapter steps

Regular: image + text; Chapter: chapterType (Password, Link, Form) + chapter block with buttons/formFields; position to insert

update_steps

Edit step content & display

text, customDescription, image, mediaFitMode (Cover/Contain), mediaAlignMode (Center/Top/Bottom/Left/Right), backdrop (None/Light/Dark), playbackRate, duration, transition, zoom (zoomPositionX/Y, zoomWidth — height auto-calculated; set all to null to remove)

delete_steps

Remove steps (1–100 at once)

Auto-renumbers remaining steps

copy_steps

Duplicate steps

Same-demo: specify stepIds; cross-demo: copies all

reorder_steps

Rearrange step order

Provide all step IDs in desired order

Hotspots

Tool

What it does

Key capabilities

create_hotspots

Add hotspots to steps

style (Circle/Tooltip/Area/Anchor/Pointer/Modal), animation (Ripple/Spinner/Pulse/Ping), position (x/y %), size, colors (bg/text), hotspotWidth (Small/Medium/Large), borderRadius, textAlign, text

update_hotspots

Edit hotspot styling & navigation

All of the above, plus isVisible, textVisible, tooltipPosition, htmlValue, nextButton & backButton (enabled, text, action Slide/ExternalUrl, url, bgColor, textColor)

delete_hotspots

Remove hotspots by ID

Batch by {stepId, hotspotId} pairs

Chapters

Tool

What it does

Key capabilities

update_chapters

Edit chapter layout, buttons & forms

type, heading, description, theme, layout, enabled, skip, password, emailValidationMode, emailDomainList, coverImageType/Source, logoEnabled/Source. Buttons (inline CRUD): content, btnColor, color, linkTxt, isLinkExternal, openInNewTab, animation, order. Form fields (inline CRUD): fieldType (SingleLineText/Dropdown/Textarea), label, placeholder, required, options, businessFieldType

delete_chapters

Remove chapter blocks from steps

Deletes chapter, buttons, and form fields

Folders

Tool

What it does

Key capabilities

list_folders

List folders with hierarchy

Filter by type (Demo/Showcase), nest via parentId

create_folder

Create a folder

personal (true/false), parentId for nesting, type

rename_folder

Rename a folder

1–255 chars

delete_folder

Delete folder

Archives (doesn't permanently delete) contained demos & subfolders

Voiceovers & Audio

Tool

What it does

Key capabilities

list_voices

List TTS voices

70+ built-in ElevenLabs voices across accents; cloned voices (Growth/Enterprise only)

generate_voiceovers

Set text + generate AI audio

Per-step text, voice ID, speed (0.7–1.2), stability (0.3–1.0); up to 75 steps/call

delete_voiceover

Remove voiceover audio

Target specific stepIds or all steps

list_background_music

List BG music tracks

Preset library + workspace-uploaded custom tracks

Trackable Links

Tool

What it does

Key capabilities

manage_links

Batch create/update/delete trackable demo links

create with variables (name, email, company, role, etc.) + expiresAt; update to change expiry or avatar colors; delete by linkId

Media Library & Uploads

Upload local images, videos, and PDFs through a browser upload portal, reuse existing workspace media, and build or update demos from it.

Tool

What it does

Key capabilities

create_upload_job

Start a browser-based upload

Returns an uploadUrl the user opens to upload images, videos, or PDFs into the workspace; job expires after 60 minutes

get_upload_job

Fetch upload results

Status (pending/in_progress/ready) + uploaded identifiers: image URL with dimensions, videoId with duration, PDF URL

create_demo_from_uploaded_media

Create a new demo from uploads

Each image/video becomes one step, in order (up to 200 items); optional folder placement

replace_step_media

Replace a step's image or video

Preserves regular hotspots and step audio; handles video-project duplication and timeline hotspots

list_media_library_items

List reusable workspace media

Existing image screenshots + completed video projects

create_step_from_media_library_item

Add a demo step from a library item

Images become image steps with a default hotspot; videos are duplicated so the library item stays reusable

Demo Hubs

Create and manage Demo Hubs — embeddable help widgets that surface demos and showcases on your website. Hubs are workspace-level (no personal/shared split).

Tool

What it does

Key capabilities

list_demo_hubs

List Demo Hubs in a workspace

Text search, pagination (20/page); returns category & content counts

get_demo_hub

Fetch full hub configuration

All settings (appearance, header, launcher, footer, allowed domains) + ordered category tree with demo/showcase items

create_demo_hub

Create an empty Demo Hub

Same defaults as the app: three starter categories, "Help" footer links, workspace or white-label branding

create_demo_hub_from_showcase

Convert a showcase into a Demo Hub

Showcase sections become hub categories; demo-backed items are carried over

duplicate_demo_hub

Clone a Demo Hub

Copies settings, categories, and content references; named "<original> (copy)"

update_demo_hub_settings

Edit hub settings

name, appearance (title, Light/Dark theme, search placeholder), header (logo/title, background, alignment), launcher (show, position, icon), footer (label + up to 6 links), allowed embed domains; changes go live immediately

manage_demo_hub_categories

Batch create/rename/reorder/delete categories

Max 5 categories per hub; deleting a category removes its content links only

manage_demo_hub_content

Manage demos & showcases inside a category

Add/update/remove/reorder; per-hub displayName and displayThumbnail overrides

delete_demo_hub

Permanently delete a hub

Underlying demos/showcases are not touched; embedding sites stop showing it

get_demo_hub_embed_code

Get website install snippets

SDK script tag, launcher init snippet, custom-trigger snippet; white-label workspaces get their custom script URL

Showcases

Build and manage showcases — curated collections of demos, videos, and resources.

Tool

What it does

Key capabilities

list_showcases

List showcases in a workspace

Scope me or workspace, text search, Showcase-folder filter, pagination

get_showcase

Fetch full showcase

Settings, sections, resource-center content, tags, personalized links, personalization variables

create_showcase

Create a showcase

App defaults: published, one starter section, workspace CTA/branding; optional folder placement

duplicate_showcase

Clone a showcase

Copies sections, content references, and tags

import_showcase

Import one showcase into another

Appends copied sections & content to the target (non-destructive)

move_showcases

Move showcases between locations

Personal, Shared, or Folder (1–100 at once)

delete_showcase

Permanently delete a showcase

No archived state

update_showcase_settings

Edit showcase-level settings

name, description, appearance (displayFormat: section/checklist/gallery, brandLogo, section visibility), autoplay (enabled, duration, loop, bar color), CTA, sharing (published, visibility public/private, personal vs. shared), metadata image

manage_showcase_sections

Create/update/delete/reorder sections

Batch operations in one call

manage_showcase_content

Manage mixed content in a section

Content types: demo, video, link, pdf, document, text, embed; add/update/remove/reorder

manage_showcase_links

Personalized/trackable showcase links

Create/update/delete with variables (name, email, company + custom) and expiresAt; same Scale+ gate as demo trackable links

set_showcase_tags

Attach/detach tags on a showcase

Modes: replace, add, remove

get_showcase_share_info

Get share & embed URLs

Public, iframe embed, inline embed, popup embed, and OpenGraph image URLs

Translations

Localize demos end-to-end — AI-translate all demo text and optionally generate translated voiceovers.

Tool

What it does

Key capabilities

generate_demo_translation

AI-translate an entire demo

Translates title/meta description, chapter text & buttons, hotspot text/buttons, and step audio text; pass a voiceId to also generate translated voiceover audio (takes 1–3 min); requires the AI enhancement feature

list_demo_translations

List stored translations for a demo

Translated text + media entries per language

set_demo_translation_text

Set a single translated text entry

10 entity types (DemoTitle, HotspotText, StepAudioText, …); empty text deletes the entry; optional voiceover regeneration for step audio

delete_demo_translation

Remove a language's translation

Deletes that language's translated text and media

Versioning & Publishing

Publish immutable demo versions, label them, roll back, or branch a new demo from any published version. (Requires demo versioning to be enabled for the workspace.)

Tool

What it does

Key capabilities

publish_demo

Publish the draft as a new immutable version

Auto-increments the version number and makes it live; doesn't change public/private visibility

list_demo_versions

List published versions

Newest first; number, name, creator, and which version is currently live

get_demo_version

Summary of one published version

Version metadata + per-step outline (text, chapter flag, hotspot count)

rename_demo_version

Name/label a version

e.g. "Black Friday launch"; empty name clears the label

revert_demo_to_version

Restore the draft to a previous version

Rewrites the editable draft only; optional publishAfterRevert; overwrites unsaved draft changes

duplicate_demo_from_version

New demo from a specific version

Fully independent copy; stays private until visibility is changed

Workspace & Embeds

Read workspace-level settings and generate embed code for a demo.

Tool

What it does

Key capabilities

get_workspace_settings

Read workspace Global Settings

Default appearance/CTA/behavior/sharing/hotspot/audio values (mirrors update_demo_settings groups so they can be forwarded to a demo) + workspace-only fields (custom domain, favicon, custom font, watermark logo); read-only

get_demo_embed_code

Get iframe embed code for a demo

embed_v=2 URL (workspace custom domain aware) wrapped in a responsive container; matches the share dialog snippet

Analytics

Query demo performance data, viewer sessions, and engagement metrics directly through your AI assistant. These tools are optimized to generate rich visualizations and graphs — not just tables.

Tool

What it does

Example prompt

get_top_performing_demos

Rank demos by views, engagement, or completion

"Which demos got the most views in the last 30 days? Show me the top 5 with engagement and completion rates, and how they compare to the previous period."

get_demo_analytics

Full analytics breakdown for a specific demo

"Give me a full analytics breakdown for [demo name] over the last 30 days — total views, unique views, engagement, completion, and how each step performed."

get_demo_sessions

Individual viewer sessions with details

"Who has been viewing [demo name] in the last 30 days? Show me the individual viewer sessions with their email, location, how many times they viewed it, and whether they completed it."

get_device_analytics

Device, browser, and location breakdown

"What devices, browsers, and countries are my demo viewers coming from over the last 30 days?"

get_demo_hotspot_performance

Hotspot click performance and drop-offs

"Show me the hotspot click performance for [demo name] — which steps are people clicking through and where are they dropping off?"

Showcase Analytics

Tool

What it does

Example prompt

get_top_performing_showcases

Rank showcases by views, unique viewers, or leads

"Which showcases got the most leads this month vs. last month?"

get_showcase_analytics

Overall analytics for one showcase

"How is [showcase] performing? Views, leads, completion, and average session duration for the last 30 days."

get_showcase_demo_performance

Per-demo views inside a showcase

"Which demos inside [showcase] are actually getting viewed?"

get_showcase_sessions

Viewer sessions & leads for a showcase

"Show me leads from [showcase] — email, company, and completion rate."

get_showcase_session_details

Deep-dive on one showcase viewer

"Show me everything this viewer did across their sessions in [showcase]."

list_showcase_analytics_sources

List UTM/source values for a showcase

"What traffic sources does [showcase] have?" (use before filtering by source)

Benefits

Natural language editing — Update demos by describing what you want instead of clicking through menus.
Bulk operations — Make changes across multiple demos, steps, or hotspots in a single prompt.
Platform flexibility — Works with Claude, ChatGPT, Gemini, Cursor, Copilot, and more.
Full feature access — Everything in the Supademo editor is available via MCP.
Analytics on demand — Query demo performance and viewer data conversationally.
Secure authentication — OAuth-based access keeps your workspace data protected.

Use Cases

Bulk Hotspot and Styling Updates

Need to update hotspot colors, button labels, or styling across an entire demo? Describe the changes in one prompt and let AI apply them to every step — no manual editing required.

Generating Voiceovers at Scale

Generate AI voiceovers for all steps in a demo with a single prompt. Specify the voice, tone, and style, and MCP handles the rest — perfect for localizing or refreshing demo audio.

Creating Personalized Trackable Links

Generate dozens of trackable links with personalized variables (name, company, role) in one request. Ideal for sales teams sending tailored demos to multiple prospects.

Querying Demo Analytics

Ask your AI assistant for performance insights — top demos by engagement, viewer session details, or drop-off analysis — and get visualizations without opening the analytics dashboard.

✨ The Result: Edit, personalize, and analyze your Supademos using natural language — faster than ever before.

PreviousConsolidated Playback Bar NextPersonalize

Last updated 7 minutes ago

Was this helpful?

What is an MCP? How does it work with Supademo?

Overview

Getting started

1. Configure

2. Create or choose a Supademo

3. Prompt AI

4. Review and tweak changes

5. Give us feedback!

Available features in Supademo MCP

Workspaces & Demos

Edit Demo Settings

Steps

Hotspots

Chapters

Folders

Tags

Voiceovers & Audio

Trackable Links

Media Library & Uploads

Demo Hubs

Showcases

Translations

Versioning & Publishing

Workspace & Embeds

Analytics

Showcase Analytics

Benefits

Use Cases