Editing your demo

Demo editing allows you to control where the hotspots and tooltips get rendered on your demo. This is useful because it allows you to control what users see and the order they see it in.

In the example below, the text inside the orange box is the Tooltip text and black outlined box is the Hotspot.

Creating new hotspots

Every time you create a demo, Lancey will create a Hotspot based on where you clicked, typed, or interacted with the application. This makes it a breeze to easily launch new demos.

If you want to create a new hotspot

  • Select a new element (indicated by the red border) on a frame
  • Click on the Set hotspot button
  • A Hotspot settings menu will open with few options. You can update the title, message (the text displayed in the tooltip) and placement of this hotspot.
  • You can also toggle Focus mode on the hotspot to darken the background or add a call to action when the user sees the hotspot (similar to the Contact us button below).

Editing tooltips text

  • To edit an existing hotspot’s tooltip, open up the Hotspot settings menu from the top bar.
  • A Hotspot settings menu will open with few options. You can update the title, message (the text displayed in the tooltip) and placement of this hotspot.

Modifying text/images

Lancey also allows you to modify the text, images, and data on the actual application. This is great when you want to personalize the demo with a prospect’s name, logo, or clean up data that doesn’t fit.

Text edit

  • Editing text is as easy as clicking on an element and clicking on the Edit text button.
  • To make modifications across the entire team, you can also use the Find & Replace button located on the menu bar on far right.

Blur

  • Select an element and click on the Blur icon on floating menu
  • Once you’ve blurred an element, you can unblur it by selecting it again from the menu and clicking on the Unblur button.

Removing elements

  • Similar to blur and text edit, first thing to do is select an element we want to remove.
  • Once you’ve selected it, hit the Remove button from the from the menu.

Undo changes

  • If you modify something you didn’t want to, you can always hit the Undo button on the top.
Remember the Undo button only works for the session you’re actively in the demo editor mode for. If you go to another page and come back to the editor, the undo stack will be gone.