Product Tour can enhance user experience for first-time users by guiding them through your platform's core feature step-by-step. This guide will walk you through the initial setup in Usetiful, from logging in to configuring basic tour settings.
After logging into your Usetiful account, navigate to the Tours section and click on the 'Add Tour' button to create a new tour.
1. Add Steps to Your Tour
Now that you've created the framework of your tour, it's time to add the interactive steps that will guide your users. Click on the 'Add Step' button in the left panel to start defining each step in your tour.
Here's what each step type means:
Manual Steps:
- Modal: Window that overlaps the entire page.
- Pointer: A tooltip that points to the selected page element.
- Slideout: Similar to the modal dialog, it doesn't overlap the entire page but displays in the bottom left/right corner.
Automatic Steps:
- Redirect: Moves users to another page where the flow continues.
- Delay: The tour is delayed for a defined amount of time.
- Trigger Event: Trigger a Javascript event or utilize it to send data to a webhook.
- Page Action: Act on a selected element, such as clicking or filling in a value.
- Condition: Specify a condition for the tour to progress. If the condition is met, the tour continues; otherwise, an alternative option is presented.
To learn more about Manual Steps, click here.
To learn more about Automatic Steps, click here.
2. Configure Your Tour Settings
To ensure your tour shows to the relevant audience at the right moment, click on the 'Settings' option in the top bar.
To learn more about configuring Tour Settings, click here.
Did you know? You can customize the look & feel of your tour using Themes. Find out more here.
New tours are saved in Draft mode by default, making them invisible to users. Once you've completed your settings and added steps, save and publish your changes by clicking the 'Save' button.
3. Preview Your Tour
Once your draft is ready, preview it live on your site with our browser extension,
To learn more about Previewing your Tour, click here.