Product Demo Use Cases

Common deployment patterns for Spara's Product Demo capability — from website CTAs to outbound campaigns and in-app onboarding.

The https://docs.spara.com/agents/capabilities/product-demo capability delivers interactive, voice-narrated demos to your prospects. This guide covers the most common ways to deploy it — each pattern solves a different go-to-market challenge and takes only a few minutes to set up.

For technical details on the JavaScript methods used below, see https://docs.spara.com/developers/spara-api/javascript-api.

Convert Website Visitors into Pipeline

The problem: Buyers arrive mid-evaluation with strong purchase intent, yet leave without converting. Static forms and generic landing pages fail to surface the product experience needed to drive pipeline.

The solution: Embed a CTA button (e.g., "Start AI Demo") directly on your website. When a visitor clicks it, the Product Demo launches in a fullscreen overlay — no navigation away from your site, no form fill, no scheduling friction.

How to set it up

1

Add a button to your page with a unique ID

Place the button wherever you want the CTA to appear (hero section, pricing page, product page, etc.):

<button id="demo-cta">Start AI Demo</button>

2

Add a click handler after your Spara embed script

Your Spara embed script can be found in Settings > Chat > Configuration. Add the following JavaScript after it:

document.getElementById('demo-cta')?.addEventListener('click', () => {
  SparaActions.openProductDemo();
});

When a visitor clicks the button, SparaActions.openProductDemo() launches the Product Demo in a fullscreen overlay.

Turn Outgoing Sequences into Interactive Experiences

The problem: Outgoing sequences generate opens but not responses. Reps default to generic homepage links that lack relevance, causing prospect engagement to drop off.

The solution: Drop a direct link to the Product Demo in your cold emails, LinkedIn messages, or SMS campaigns. Recipients click and immediately experience an interactive, personalized product demo — no form fill, no scheduling friction. The demo acts as a self-serve first touchpoint that warms the prospect before your reps follow up.

How to set it up

Use SparaActions.openProductDemo() to launch a Product Demo session programmatically. Add a query parameter to your landing page URL (e.g., ?demo) and include JavaScript on your site that checks for the parameter and opens the demo automatically:

if (window.location.search.includes('demo')) {
  SparaActions.openProductDemo();
}

Then link to https://yoursite.com/?demo in your outgoing emails, LinkedIn messages, or SMS campaigns. When a recipient clicks the link, your landing page loads and the Product Demo opens automatically.

See https://docs.spara.com/developers/spara-api/javascript-api for additional setup instructions and code examples.

Convert Chat Conversations into Product Demos

The problem: Conversational interfaces excel at top-of-funnel qualification, but fall short when buyers are ready to evaluate the product. The inability to transition from chat to a live product experience results in drop-off at peak purchase intent.

The solution: Enable the Product Demo as a suggested action inside your Spara Navigator chat widget. Visitors can click "Start product demo" directly from the chat interface to launch the demo — zero code changes required on your end. Buyers who are already engaged get a natural next step to see the product live.

How to set it up

Ask your Spara CSM to enable the Product Demo as a suggested action in the Navigator chat widget. Once enabled, it appears automatically — no changes are required on your end.

Accelerate Sales Cycles with a Pre-Sales Demo Link

The problem: Sales cycles lose momentum between calls when prospects have no way to explore the product independently. Scheduling friction extends deal timelines and creates openings for competitive displacement.

The solution: Host the Product Demo on a private, non-indexed page that only exists for those with the direct link. Reps share this URL in follow-up emails or deal sequences, and prospects can explore the product on their own time before the next call — no public exposure and no sales engineering required.

How to set it up

1

Create a non-indexed page on your website

In your CMS or website builder (Webflow, WordPress, HubSpot, etc.), create a new blank page with a simple, non-descriptive URL (e.g., yourcompany.com/demo-preview).

2

Exclude the page from search engines

Add a noindex meta tag to the page's <head>, or use the built-in "hide from search engines" toggle in your CMS. Do not link to the page from your navigation or anywhere else on your site.

3

Add the Product Demo to the page

Follow the steps in Convert Website Visitors into Pipeline to embed the Spara script and a CTA button on this page. Alternatively, use the ?demo query parameter approach from Turn Outgoing Sequences into Interactive Experiences to open the demo automatically when the page loads.

4

Share the link

Share the page URL (optionally with ?demo appended) in follow-up emails or deal sequences. Only people with the direct link can access it.

Accelerate Customer Onboarding In-App

The problem: New customers often struggle to understand product capabilities during onboarding, resulting in slower time-to-value, more support requests, and increased reliance on CSMs. Traditional onboarding approaches like documentation and live training sessions are difficult to scale.

The solution: Embed the Product Demo directly inside your product or customer portal as an in-app widget. New users can launch it at any time to get an interactive walkthrough of features, ask questions in natural language, and get instant answers — without leaving your platform.

How to set it up

Implementation varies depending on your product's architecture. Work with your Spara CSM to determine the best approach for your use case.

FAQ

Can I use more than one of these patterns at the same time?

Yes. Each pattern is independent. You can embed a CTA on your marketing site, use the ?demo link in outbound emails, enable the chat suggested action, and host a private demo page — all simultaneously, all pointing to the same Product Demo capability.

Do I need to create separate Product Demo capabilities for each use case?

No. A single Product Demo capability works across all deployment patterns. The demo content, features, and visuals are shared regardless of how the prospect reaches it.

How do I track which channel is driving demo sessions?

Use different query parameters for each channel (e.g., ?demo&utm_source=email, ?demo&utm_source=linkedin) so your analytics platform can attribute sessions to the right source.