A demo sandbox environment or interactive product demo is a controlled and isolated environment for prospects and customers. It allows prospects to get an understanding of what your product is like to use by offering a low friction, guided experience of your SaaS product.
The different types of product demo sandboxes
There are three broad categories of tools available:
- Screen recorders / slideshow creators - Arcade, Supademo, Storylane (starter)
- Front end replicators - HowdyGo, Storylane (growth), Navattic
- Cloned applications - DemoStack
In almost every case (apart from DemoStack), you install a Chrome extension which lets you capture your SaaS product. The chrome extensions either require you to manually capture each page, or will automatically capture your product as you click-through a user flow.
Let's compare each category
Each category differs by price point, advantages and disadvantages - let's explore the differences between each.
The screen recorders / slideshow creators
Typical pricing: Around $40 per user, per month
The simplest form of interactive demo is essentially a screenshot or video recording of your application. These tools make it easier to connect and annotate screenshots, effectively creating a slideshow of your application.
There are many examples of these tools on the market, a few you might have heard of include:
These options are affordable, but as the old adage goes, you get what you pay for.
While they are easy and cheap to use, the end result feels like you're clicking through a series of screenshots. It's not unlike creating a PowerPoint/Google Slide presentation with screenshots and linking the slides together with speech bubbles.
They don't give a true representation of your product, but they make slideshows easy to create.
An example - Arcade Demo
Let's take a deep-dive on this Arcade demo.
There are a few limitations to point out, and these are common limitations for Arcade, Storylane and Supademo:
- Not actually interactive - When you move your mouse over elements they are not actually interactive, you are seeing a screenshot or short video
- Low Resolution Videos - The dynamic sections of the demonstration are clearly video replays and as a result, the quality reduces as interactions are replayed
- Limited View - You cannot scroll around the page, so the viewer is limited to what was captured during recording
- Accessibility - Images and videos are inherently problematic for screenreaders, so if you or your prospects will be particularly concerned with accessibility, you may want to skip this category
- Limited modifications after recording - Because you're capturing screenshots or videos, these tools are limited in what you can modify after you've finished your recording.
Although these tools don't create particularly realistic replicas of your product, they are very quick to get started. You also don't have to worry so much about ensuring every aspect of your product is perfect because they are only creating a small capture of your entire product.
The front end replicators
Typical pricing: From $39 per month for your entire company (HowdyGo), with alternatives starting at around $500 per month minimum
If you're looking for a more realistic alternative to Storylane, Arcade or Supademo a front-end replicator might be the answer.
The process of recording is similar to the screen recorders, but rather than creating a series of screenshots connected together by annotations, you are capturing the original HTML and CSS. This creates a very accurate representation of your SaaS app, while still offering a guided demonstration of the features.
To ensure the recording works as expected and is isolated from the original environment, all webpage content like fonts and images are stored by the service.
There are a number of advantages to these tools over Arcade or Storylane:
- Actually Interactive - You get a much higher level of interactivity, if you look at the HowdyGo demo below it is possible to hover over elements and get an immersive feeling of what the application is like to use. This is really effective in tools that rely on hover animations to display additional information, like in analytics dashboards that have "tooltip" data
- Perfect representation of animations - Because the website is effectively being "replayed", things like drag-and-drop animations and typing into input fields look perfect. Rather than relying on a video recording of these animations
- Full capture of page - The viewer can scroll down the page and see the entirety of the page, below the fold
- Accessibility friendly - Screenreaders are able to read the demo because it perfectly replicates the existing accessibility implementations
- Easy to modify and personalize - Since the underlying web content is available, it is relatively simple to switch images or replace text, creating a dynamic demonstration that can even be personalized for individuals and companies.
Despite not requiring much additional time to produce a more immersive experience (depending on the tool), some of these tools can be quite affordable - for example HowdyGo is offered at a comparable level to screen recording products despite offering a much higher level of interactivity.
On the other hand some other tools in this category like Storylane (with their HTML recording growth plan) or Navattic are quite expensive, both starting at $500/month to use (as of publication).
The cloned applications
Typical pricing: Prices not listed, but anonymous sources estimate in the $tens-of-thousands per year with per-user variable costs
At the highest end of reproduction quality are tools that fully replicate an app front-end and intercept all network requests to the original web back end.
This allows an even greater level of control compared to front end replication tools. By default, you will get a similar output to the front-end replicators like HowdyGo or Navattic. These tools really shine when you start modifying the data sent to your application by your server to modify things like graphs.
However, making these modifications can be complicated and it takes a lot of time to create a demo sandbox and become comfortable using the tool's full capabilities.
The higher levels of complexity have an additional financial cost, for example DemoStack offers a cloned app, but only at their highest price point, which is not disclosed.
That said compared to the cost of using engineering time to create modified versions of graphs on demand, it could be quite a time saving and thus may financially make sense if this use case is required often.
What is the best sandbox option for you?
Every company has a different use case and thus requirements vary but, you should ask yourself the following questions:
If you are just getting started and/or are not using any solution currently?
Test with something on the cheaper end of the spectrum like a screen recording tool, particularly if you're not too concerned with interactivity.
Or use HowdyGo as a starting point and you'll end up with something that's future-proofed and will give you freedom to modify down the line. Most of the products offer a free tier to get you started including HowdyGo, so this is probably a good option.
If you want to personalize demos by modifying images or replacing text in your app?
In this situation, you want to use a front-end replication tool like HowdyGo or the others mentioned above.
If you are spending a lot of time manipulating network requests for demos and want to find a better solution?
Use a tool that clones your front end and lets you manipulate the network requests, this will probably require some calls to some potential providers to try and understand what the cost might be and if a business case can be made.