Note: The above video displays an outdated version of Chameleon's interface. It has been replaced to give our users a more intuitive and pleasing experience. We will soon create new videos to showcase our new UI 🙂

A Tour step is the individual prompt or user experience that is shown as part of a Chameleon Tour. 

A Tour can consist of a single step (e.g. for an ad-hoc notification), or be multi-step (e.g. as part of a tutorial flow). We recommend keeping tours to 3-4 steps at a maximum to avoid fatiguing and overwhelming users. 

You can build steps from within the Tour View by clicking New step:

Step configuration options

Once you create a new step, you will be prompted to choose a Template or go with a blank canvas.

For subsequent steps, you can choose a template directly from the top bar, rather than needing to open the side panel:

A demo image showing the Top Bar of the Chameleon Builder, with a dropdown revealed after clicking on the New Step button showing available step templates

👉 Learn more about using Templates for your Tour steps

Upon choosing one, you'll be taken to the Step Builder. Here, you have a visual representation of your step component and three menus, represented by circle icons:

  • Location & Position (pin icon): where you can configure your Tour's positioning, the pages where it will show, etc.

  • Add Content (plus icon): where you can add and configure different components to your Tour step.

  • Actions (clapperboard icon): where you can adjust animations and triggers

Some relevant configurations that you can access through these menus:

In the Step Builder, you are also presented with a top bar, that allows you to switch between the different modes (Navigate, Edit, and Preview), move to a different step, or even create a new step.

While you're previewing your Tour, this top bar will also display important messages that can give you insights when things go wrong. For example, you will be alerted when a step is not set to be displayed on the current page, when an element is required and does not exist on the current page, etc.

Reordering steps

Steps are triggered in the order that they are listed. You can drag steps to reorder them according to your preference.

Later steps do not trigger without the previous step being completed, and there is no way to jump between steps. For example, step 2 will not trigger unless step 1 is completed; and there's no way to jump from step 1 to step 3.

👉 Have any questions or issues? Review the best way to get help

COMING SOON - Tour configuration in the Dashboard

Tours will soon be configured in your Chameleon Dashboard. While you will still load the Builder in your website or application to build your Tour, you can make quick adjustments like step order, deleting steps, and more directly in the Dashboard.

Learn more

Did this answer your question?