Interactive Walkthroughs that Span Across Different URLs
Use case
Userpilot makes it seamless to create extremely interactive walkthroughs that can also span across different URLs.
You should use this strategy when you think it's necessary to take the users by hand and show them how to do a certain task one step at a time.
Building interactive walkthroughs
To create an interactive experience, start by adding a driven action.
Driven actions are the heart and soul of interactive walkthroughs as they intend to drive users to take certain actions such as a mouse click or hover, and would only continue the flow of the experience when such action is done.
After you select the element you'd like to highlight, you can choose the type of action you'd like to drive.
In this example, we'll drive users to click on a certain option on the screen.
Now, you have two ways on how to continue this flow. Either by creating a different flow on the URL you are sending the users to, or by continuing this same flow.
The advantage of the first approach is that even if users escape the walkthrough on this page, they will still see the next flow on the other URL (when they navigate there on their own) since they are two different flows. This is generally a better strategy.
Yet, sometimes you'll need to connect both URLs in the same flow.
To do this, just simply navigate to the URL you just called the action on, and add a page change step.
The Userpilot builder will automatically detect that there was a page change and will ask you to add it.
You'll have two options here, either to force redirect the user to a URL. Or, simply use silent redirect which will allow your app to determine where to take the user based on their action (recommended).
You can then continue the flow as usual in the next URL.
To create a text input step, just simply select the driven action type to be 'Text input' type as shown below.
You'll have a variety of options on how to continue the flow after the user inputs a text such as showing a 'next' button or using the 'Enter' or 'Tab' keyboard buttons.
