Create a Tour
You can start a new Tour from a screen recording, by uploading existing content, or from your library.Open the new demo screen
From your dashboard, click New demo. You are shown four options: Upload a video, Record your screen, Upload images, and Upload from library.
Choose your starting point
- Record your screen
- Upload a video
- Upload images
- Library
Click Record your screen. If the Layerpath Chrome extension is not installed, you are taken to the Chrome Web Store to install it first. Once installed, the extension starts a new recording session. After you finish recording, Layerpath processes your session and creates a Tour automatically — one step per captured click.
Only Admins and Editors can create Tours. Viewers can view published Tours but cannot create or edit them.
Tour editor overview
The Tour editor has three main areas.Steps panel
A vertical strip on the left showing a thumbnail for every step. Click a thumbnail to jump to that step. Drag thumbnails to reorder steps.
Step canvas
The central area that shows the current step. Your screenshot fills the canvas, with the hotspot and tooltip overlaid on top.
Settings panel
A panel on the right with two tabs — General and Callout — for configuring Tour-wide and per-step settings.
Key concepts
Steps
Each screen in the Tour is a step. A step captures one moment in your workflow — typically a screenshot of the page at the point where a click occurred. You can:- Add a step — click the add button in the steps panel.
- Reorder steps — drag a thumbnail up or down in the steps panel.
- Delete a step — select the step and use the delete option in the step menu.
Hotspots
A hotspot is an animated indicator that marks the area on a step where the viewer should click. It appears as a pulsing dot. You can:- Drag the hotspot to reposition it on the canvas.
- Adjust Hotspot transparency using the slider in the General settings tab.
- Set the Hotspot transition timer to control how quickly the hotspot animates (options: 0.3s, 0.5s, 0.7s, 1s).
- Toggle Show drag guides to display crosshair guides and coordinates while positioning.
Tooltips (callouts)
A tooltip — also called a callout — is a label that appears next to the hotspot to explain the action. In the Callout settings tab you can:- Toggle Show callouts to show or hide the callout on a step.
- Toggle Show arrows to display a pointer arrow on the callout.
- Toggle Show numbers to number each callout sequentially.
Overlays
An overlay is a semi-transparent layer placed on top of a step to focus viewer attention. Overlays can be used to highlight specific areas or dim the rest of the screen.Intro and outro
The first and last steps of your Tour serve as the intro and outro. Use these steps to add a welcome message or a call-to-action. You can style the background of the Tour — including solid color, gradient, or mesh gradient — in General settings under Background color.General settings
| Setting | Description |
|---|---|
| Show navigation bar | Displays a bottom bar listing all steps so viewers can jump directly to any step. |
| Show browser frame | Wraps the canvas in a browser-style chrome frame. Choose Light or Dark skin. |
| Enable autoplay | Automatically advances to the next step. Set the duration per step (3–10 seconds). |
| Background color | Sets the background behind the canvas for published Tours. |
Preview before publishing
Click Preview in the top bar to open a full-screen preview of the Tour exactly as viewers will see it. Use the hotspots and navigation controls to walk through the experience. Close the preview to return to the editor.The Tour is not visible to viewers until you publish it. To share the Tour, publish it and copy the share link from the Share panel.