To help users discover and adopt new functionality or changes in design, Chameleon has a suite of built-in labels and icons, that can be added to your application, to start a step / tour.
These include examples such as the ones below:
You can position these anywhere on your page (anchored to an element) and configure a step to show when a user hovers / clicks on these. You can also style these to match your brand.
Do this in the 'Trigger' section of the Step Builder (top bar) once you have created a step.
Set a user action such that the 'Step will show when:' > 'On click' or 'On hover' and then choose the relevant icon or label.
You can choose from one of the pre-built Icons and Labels, and then further style these.
Once you have selected an option, click 'Select element' to choose the element on the page where the label / icon should be positioned. Then click 'Adjust' to further configure and style your label / icon.
The configuration options include:
- Offsets (to refine the positioning)
- Colors (for text / border / fill etc.)
- Persistence: choose whether this icon / label should continue to show when the step is displayed (see below)
In addition to these labels, you can also choose to upload your own custom icon / label, by selecting 'Custom icon'. Learn more about triggering options here.
Persisting the trigger
Once the user takes the trigger action (e.g. hovers over the label), the step will appear.
You can configure the trigger icon / label to continue to show alongside the step ('Icon Trigger Persists' = Yes) or hide it ('Icon Trigger Persists' = No) as per the gif example above.
Creating an on-demand tour
You can use this trigger functionality, alongside Tour Recurrence to create on-demand tours.
When you set the tour to appear again (after it's exited / completed) the trigger icon / label will re-appear, and a user will be able to select when to begin the tour again.
This can be great to let users retake tours later or if there are aspects of your product that need explanation regularly (because of complexity or infrequent usage).