Self-Selecting Onboarding Flow ("Choose Your Own Adventure")
If you have several actions your users can complete in your application and you would like to give them as much autonomy without getting lost, a self-selecting onboarding flow can be a helpful way to let you users decide how they'll explore your platform.
A self-selecting (or "Choose Your Own Adventure") flow is typically composed of:
- A modal with 2-4 call-to-action options
- One tooltip flow linked to each call-to-action option
- These tooltip flows aren't necessary but will provide further context and guidance to users who are new to your product: if you think the page they will be redirected to by clicking your call-to-action options is self-explanatory, feel free to omit the tooltip flow
And it typically launches:
- At the main page your users fall on after logging in: oftentimes a dashboard
- After a user sees your welcome modal and onboarding tour
- Once automatically, but can be relaunched by embedding a "Show hints" button or installing our in-app widget. Learn more about relaunching flows here
Here's an example of what a finished self-selecting onboarding flow looks like:
Here's how to build a similar flow:
- Create your tooltip flows for each call-to-action.
These flows should be separate from one another, even if they exist at the same URL. In the example above, there is a tooltip flow that shows users how to 'Connect your mailbox,' 'Activate your chat button,' 'Invite your team,' and 'Connect your Facebook page.'
- Create another flow: this time, select the modal or slideout pattern.
We recommend building any onboarding flows at the dashboard or first page your users will land upon login.
- Add text and/or an image to your modal or slideout.
Personalize your flow by including user properties, such as user name or company name to really give a warm welcome.
- Add your calls-to-action.
In the above example, Casengo created four individual images for their users to click on.
You can create these images in an application like Photoshop, with your product designer, or through a free button builder website (such as this one).
- Link your images to each related tooltip flow.
When you add each image, you'll notice the option to make it linkable. In the URL field, put in the permalink of the tooltip flow that was built for the call-to-action the image represents. (Need help finding the permalink? Click here)
- In the above example, the 'Connect your mailboxes' links to a tooltip flow that shows users how and where they can connect their mailboxes in Casengo's application.
-You can also link the image to a flow ID in the editor.
Publish the flow.
Once your images are created and linked to your tooltip flows, you're all done with the design. Click Settings to define your targeting settings and publish your flow live.