Sandbox Demos
Build pixel-perfect sandbox demonstrations with HTML and CSS cloning. No staging environments, dev tickets, or maintenance required.
What are Sandbox Demos?
Sandbox demos are interactive, HTML-based replicas of your product that behave like a live environment — but without the risks of using production or staging data. Viewers can click, type, scroll, and explore freely, just like in the real product.
Before diving into creating a sandbox, we recommend watching this 4-minute overview to get familiar with this feature:
Otherwise, here's an example Sandbox Supademo:
How to Create a Sandbox Demo
You can create sandbox demos in two ways:
1. Record Sandbox Demos with Auto-Linking
Open the Supademo Chrome Extension and select Sandbox Demo, then hit Record Supademo.
Click through every page, dropdown, or feature you want to make accessible.
Stop recording to generate your sandbox demo.
In the editor, open Sandbox Mode and verify/edit the step links.
2. Transform an Existing HTML Demo into a Sandbox
Open any HTML Supademo.
Switch to the </> Edit HTML editor, then select Sandbox Mode.
Add invisible hotspots to elements you want to make interactive.
Repeat across steps until viewers can freely navigate.
Considerations
Sandbox demos only work for web-based applications.
Heavy webpages with lots of images or video may cause capture issues (allow for 1-2 seconds between clicks to ensure successful capture)
Key Differences: Guided HTML vs Sandbox Demos
Navigation
Preset steps via tooltips
Users click freely through multiple paths
Hotspots
Visible, instructional
Invisible or subtle
Ideal for
New users, onboarding flows
Prospects, qualified leads, live demos
Interactivity
Moderate
High — behaves like a real product
Benefits of Sandbox Demos
Safe: no risk of breaking production or exposing sensitive data
Flexible: customize logos, data, and names without engineering help
Scalable: Sales Engineers and AEs can run personalized demos independently
Insightful: track engagement analytics for each sandbox session
Buyer-friendly: deliver a “try before you buy” experience with no signup required
Best Use Cases
Live product demos
Problem: Live demos often rely on staging environments, which can be unstable, outdated, or require engineering support. Preparing data and spinning up demo instances is time-consuming.
Solution: Sandbox demos in Supademo let AEs and Solutions Engineers run live, interactive demos without relying on engineering. These are fully functional HTML clones that behave like the real product — with clickable elements, hover states, and editable data.
Why it matters:
Avoid bugs or surprises in staging/production
Save time by not setting up new instances
Personalize demo data quickly without touching the backend
Run consistent, high-quality demos from anywhere
Proof of concept via Sandboxes
Problem: Creating custom POCs for prospects usually requires engineering effort and setup time. Prospects also want to explore the product at their own pace.
Solution: Use Supademo sandbox demos to deliver self-guided, interactive POCs tailored to the prospect’s use case. These demos replicate the actual product and can be personalized without writing code.
Why it matters:
Deliver tailored POCs without engineering help
Let prospects explore key workflows freely
Share demos that don’t require logins or sandbox environments
Iterate quickly based on feedbac
Demo leave-behinds
Problem: After a live demo, it’s hard for prospects to revisit what they saw or share it internally. Videos and PDFs are passive and often ignored.
Solution: Supademo sandbox demos let you share interactive, clickable versions of the product after a call — no downloads, no accounts, and no static content.
Why it matters:
Make it easy for buyers to re-engage and share internally
Keep the experience interactive instead of static
Track usage and interest after the call
Help champions sell your product internally
What’s Coming Next?
To make sandbox demo creation even easier and more scalable, we’re working on:
Bulk edit content (e.g., titles, descriptions, images)
Bulk replace content (e.g., change a product name or image across multiple steps at once)
One-click personalization of data like names, logos, industry via AI
Flexible toggles to switch between sandbox and guided modes
Smarter analytics that reflect sandbox usage patterns
Last updated
Was this helpful?