The Experiences you build with Chameleon can be simple notifications (e.g., a new feature Tooltip) or complex flows that follow a progressive course (e.g., an onboarding Walkthrough). The latter will consist of several Steps that your users can engage with.
The Step of an Experience is the individual prompt, notification, or message that you build as part of a Tour or a Microsurvey.
đĄ Tooltips are essentially 1-Step Tours that you create to engage your users in a subtle, non-intrusive way. The Embeddable Cards in a set will also behave similarly to Steps in a Tour.
How Steps work in Chameleon
Each Experience Step will be triggered in the order that it is listed in the Dashboard. You can add and manage Steps from the Dashboard or Builder. In the case of Tours (and Cards), by default, any new Steps will be added after your existing ones, and you can drag and drop to rearrange them in your Dashboard.
âš In the case of Microsurveys, the Steps follow a natural progression ("Question", "Follow up", "Thank you") and will always appear in the same order
The latter Steps in an Experience do not trigger without the previous Step being completed, and users can not jump between Steps unless you configure it to behave this way (using the "Jump to specific Step" option or by using Element Rules to skip specific Steps in a Tour)
For Microsurveys, you can use "Response Logic" to control which Follow up question should appear (i.e., for different respondents)
Building and editing Experience Steps
After selecting the type, you can add Steps to a Tour or a Microsurvey from the Dashboard in the Build Steps and Build Microsurvey panels.
With Tours, youâll be prompted to pick a Template or start with a blank one when you add a new Step. After you select one, you can open your Tour in the Builder to style and configure each Step onto your interface đ
With Microsurveys, you'll first pick a Template (or leverage your Default Styling), the Question Step will be added by default, and youâll just have to add the Follow Up and Thank You ones. Then, you can click on any Step to open your Microsurvey in the Builder and configure it onto your interface.
To edit any Step, go to the Build panel in your Dashboard and click on any Step thumbnail to open it in the Builder and make changes to it.
đĄ Don't forget to apply your changes in the last configuration panel, Review and Publish.
Configuring Tour Steps
The Tours you create with Chameleon can consist of single Steps or multi-Step Tours.
đ¤ We recommend keeping your Tours to a maximum of 3-4 Steps to avoid fatiguing and overwhelming your users.
In the Dashboard
The Dashboard you can add and manage your Tour Steps. Once you're done configuring your Tour in the Builder, get back to the Dashboard. Here, you will see all the changes you made in the preview.
Rearrange Steps in a Tour or access the Step options to copy, create a template, or delete any Step. You can also toggle on the interactions map to review all interactions between Steps.
â
The interactions map also shows any conditions needed for each Step to display, such as URL Rules or On Page Triggers.
In the Builder
In the Builder Navbar, you have some more useful options that allow you to switch between different modes (Navigate, Edit, Preview), move between Steps, add new ones, or bring up the HelpBar.
When adding subsequent Steps from the Builder, youâll see a list of the same template options.
Once your Step is open in the Builder, you can further customize how it looks and behaves for your users. Here, you can configure a few key aspects:
Set the Stepâs position and bring attention to it by adding a shroud.
Whether any user actions are required for it to show
Change the Stepâs size and style and tweak it with CSS.
Set how the user should interact with the Step, including how the user should progress to the next Step, dismiss it, or configure powerful button Actions.
Add visuals or other components, such as progress bars or celebratory animations.
âšFind more useful options in the Builder panel to preview any Step, duplicate it, create a Template out of it, or delete it.
Configuring Microsurvey Steps
For each Microsurvey you create, you have several pre-defined Steps that youâll configure as part of the same Experience. These are:
The main Question Step
The Follow Up Step
The Thank You Step
All Microsurvey Steps behave the same, they just have different configuration options for their respective context.
In the Dashboard
After you select a type, the Survey Step will be added by default, and youâll just have to add the Comment and Thank You ones. Click on any Step to open your Microsurvey in the Builder and configure it onto your interface.
After you build your Microsurvey, you can review your configurations in the Dashboard and access the interactions map.
The interactions map also shows any conditions needed for each Step to display, such as URL Rules or On Page Triggers. In the case of Follow Up Step, the Response logic you set will determine for what respondents this Step to show.
In the Builder
Use the Builder Navbar to switch between different modes (Navigate, Edit, Preview), move between Steps, or bring up the HelpBar. Add new Steps from the Builder's Navbar by clicking the "+" icon. You can start from a blank canvas or leverage an existing Template.
Depending on the Microsurvey you create, with each Step, you have a few specific configuration options in the Builder.
For Question Steps, you can:
Set the Stepâs position and bring attention to it by adding a shroud.
Set if specific elements need to be present on the page for the Step to show.
Style and tweak your Step with CSS.
Configure buttons' style, text, and colors.
Set how the user should interact with the Step, including dismissing it or configuring button Actions.
Add media or an entry animation.
For the Follow Up Steps, you have a few other configurations, such as: