How to add CTAs to an interactive demo

Once your interactive demo is recorded, you can add and customize a CTA from the Edit panel.

1. Click the Call to Action element in the Edit panel.

2. Enable the Hide other elements toggle for a distraction-free editing experience.

3. Time
   Use the video timeline slider to position when the CTA should appear.
   Alternatively, manually enter the exact time in the Time field for precise placement.

4. Title
   Enter a Title to your CTA.

5. Description  
   Enter a description to provide context for your CTA.

Configure CTA Buttons

In the Branches section, you can define multiple buttons and assign actions to each.

6. Enter the label in the Button name field.

7. Choose the button action based on your use case:

• Existing Flo to link another demo and showcase additional flows.  

• External URL to redirect users to a webpage for actions like booking a call, downloading resources, or signing up.  

• Next Step to continue playing the demo from the next part of the video, creating a smooth, guided experience.  

8. Click Add New to add more buttons and give users multiple options to choose from.

Customize CTA Placement and Voiceover

9. Use the Position section to define where the CTA appears on the screen.

10. Enable the AI voiceover toggle if you want to add narration.

11. Choose your preferred AI voice and enter the script in the text box.

12. Click the Play button to preview the voiceover.

Save or Delete a CTA

13. Click Apply to save your changes.

14. To delete a CTA, hover over it and open the three-dot menu. Click Delete, then confirm the action in the pop-up.

Result

Your demo will now include interactive CTAs that allow users to choose their next step, explore additional content, or take meaningful actions—all within a seamless experience.

‍