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
-
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.
-
Navigate to your product. Open the page you want to demo. Set up any sample data you want visible in the screenshots.
-
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.
-
Stop and open the editor. When your flow is complete, click Finish Capture. Demoship opens the visual editor with all your captured steps.
-
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.
-
Edit with AI. Use the AI editor to blur sensitive data, swap placeholder text, or replace dates -- all without re-capturing.
-
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
- Learn the key concepts behind demo types and flows
- Configure your workspace with branding and team settings