Getting Started

Quickstart

Create and publish your first interactive demo in under 5 minutes.

This guide walks you through creating your first demo from scratch -- capturing screens, adding guidance, and sharing it with your audience.

Prerequisites

  • A Demoship account (sign up here)
  • The Demoship Chrome extension

Step-by-step

  1. Install the browser extension. Open Chrome, go to Settings > Extensions, and install the Demoship extension from the Chrome Web Store. Pin it to your toolbar.

  2. Navigate to your product. Open the page you want to demo. Set up any sample data you want visible in the screenshots.

  3. Start capturing. Click the Demoship extension icon and select New Interactive Demo. Click through your product flow -- each click captures a screenshot as a new step.

  4. Stop and open the editor. When your flow is complete, click Finish Capture. Demoship opens the visual editor with all your captured steps.

  5. Add hotspots. Click any element in a step to add a hotspot. Write a short instruction (e.g., "Click here to create a new project"). The hotspot guides viewers through the flow.

  6. Edit with AI. Use the AI editor to blur sensitive data, swap placeholder text, or replace dates -- all without re-capturing.

  7. Publish. Click Publish in the top-right corner. Your demo gets a shareable link immediately.

Embed on your site

Paste this snippet wherever you want the demo to appear:

<iframe
  src="https://app.demoship.com/demo/YOUR_DEMO_ID"
  width="100%"
  height="600"
  frameborder="0"
  allow="clipboard-write"
></iframe>

Replace YOUR_DEMO_ID with the ID from your demo's share settings.

Note: You can also embed using the JavaScript SDK for more control over sizing and event callbacks. See Sharing for details.

Next steps

On this page