Demos on mobile

Navattic provides multiple options for viewing demos on devices smaller than 800px wide - this includes most smart phones and smaller tablets. To configure your mobile setting, open the Manage tab on the product demo page, then select Mobile.

Mobile options

There are a few different options for viewing interactive demos on mobile devices:

Mobile zoom
Mobile swipe demo
Mobile alert
Mobile scaled view
Show desktop demo

The Mobile zoom option allows you to serve your standard desktop demo directly to users on mobile devices. When enabled, viewers can use familiar pinch-to-zoom gestures to enlarge, navigate, and interact with the product on their smaller screens. This provides a simple way to maintain your original layout while ensuring mobile visitors can comfortably explore your demo.

The Mobile swipe demo is used to engage your mobile visitors with a short and visual experience they can swipe through.+ Copy from Flow allows you to reuse Captures and copy from your existing demo.All Mobile swipe demos start with a Welcome and Farewell step. Click +Add to add steps in between. Each step contains an image, title, and description.Best Practices

Include no more than 8 steps.
Upload an Image or existing Capture to the Welcome step.
If you are uploading your own image, use dimensions similar to height: 16rem or 256px and width: 24rem or 384px, allowing the image to cover a larger portion of the screen. Accepted file types include .PNG, .GIF, and .JPEG.
Keep the text minimal and clear and focus on short, impactful sentences. The Description should complement the Title, but keep it to a minimum since it’s often skimmed.
Edit the Theme of your Mobile swipe demo to match your brand. To do this, visit the Theme tab in your demo > Edit Theme > Mobile Swipe.

Additional Mobile Swipe settings

Auto Progress: Enabling Auto Progress for your Mobile Swipe Demo will automatically guide visitors through the demo by advancing to the next step after 4 seconds.
Confetti: Toggle on Completion confetti to allow visitors to celebrate once they complete their final step!
Crop the Captures: Crop the Captures or upload a new Image to ensure the images are colorful and eye-catching.
CTA Button: Toggle on the CTA button and use Open in new tab to ensure Visitors can easily access it throughout the mobile swipe demo.

Customer examples of mobile demos

View these examples in a window below 800px wide, or use a mobile simulator like this Chrome extension. You can also view them on a phone.

Meez: Take a Tour

Mobile swipe demo

Doppler: Take a self-guided tour

Mobile swipe demo

SnapLogic: Take a tour

Mobile swipe demo

Navattic: Single step view

Mobile zoom

Build

For Sellers

Share

Analyze

Navattic Agents

Copilot

Tracking & Integrations

Workspace

Help

Mobile options

Customer examples of mobile demos

Meez: Take a Tour

Doppler: Take a self-guided tour

SnapLogic: Take a tour

Navattic: Single step view

​Mobile options

​Customer examples of mobile demos

Meez: Take a Tour

Doppler: Take a self-guided tour

SnapLogic: Take a tour

Navattic: Single step view

Mobile options

Customer examples of mobile demos