Chameleon Launchers are a great way to allow users to discover new functionality and unblock themselves at their convenience.
Launchers can be configured to fully match your use case and brand guidelines. Let's explore the main aspects of this configuration, by covering:
How to create a new Launcher.
What are the main components that you can customize?
How to define where and to whom the Launcher should appear.
Creating a Launcher
To create a new Launcher, go to the Chameleon Dashboard and pick this Experience from the left-side menu. Click on "Create a Launcher" from the top-right button to start creating your Launcher.
Start with a relevant name. You'll thank yourself later for good organizational habits 😉 Click on "Configure Launcher" and you'll be presented with a list of pre-configured templates, which can be used for the most common use cases. These templates are:
Onboarding checklist
Updates log
Help menu
Pick the Launcher type that fits your needs. Once you've selected your template, your Launcher will be created with a placeholder name and it will be available on your website, where you can access all the configuration options.
After entering your URL, hit "Enter Builder" to go to your website where the fun begins. 😊
Here, the Chameleon Builder will pop up to assist you through customization and configuration. Add your Launcher items, and style its look to achieve a native integration with your interface.
When you're done styling it. Return to your Chameleon Dashboard and find all your visual changes saved in the Experience preview tab.
Next, you'll just have to finish setting it up from the Dashboard. Select the target audience, choose the displaying Environments, and finally publish your Launcher. 🎉
Keep in mind while configuring your Launcher
To make your Launcher feel at home in your interface, you can customize a number of key aspects, when configuring a Launcher:
Widget
The icon with which the user interacts to open your Launcher.
Menu
The Launcher's body, which will present a list of items to your users.
Location and position
The rules that determine where your Launcher will show, whether a specific element should exist on those pages, and where on the page it will be located.
👉 Discover all the different items you can add to your Launchers
Launcher Widget
The Launcher Widget is the icon or interface with which your users will interact to open the Launcher Menu.
You can configure the following aspects of Launcher Widgets:
Trigger: whether a user needs to click or hover over the target to open the Menu
Widget Type/Target: you can choose a default icon, upload your own, set custom text, or select an existing element on your page, to open the Menu
Position: this is available if you use an icon for the Widget. If you choose an 'Element on page' then there is no positioning needed.Â
Axis adjustment: you can manually adjust the position of the icon, by using px or % values
Colors: if you selected an icon then you can change the colors for this
Tip: You can also use our Launchers API to trigger the opening of the Menu without the need for a widget at all.Â
Launcher Canvas
The Launcher Canvas is the actual Launcher's body which contains your list of items, which can be Tours, Microsurveys, hyperlinks, search bar, dividers, etc.
You can configure the following aspects of the Launcher Menu:
Content: you can click into the Menu title to directly edit the Header copy
Widget and Height: you can set the width and maximum height for the Menu window. The window height will resize to fit the number of tours displayed until the maximum is reached.Â
Colors: for the background and text
Checklist: you can choose to show checkmarks adjacent to Tours once they have been completed
Search: you can decide whether to show the search bar in the Menu or not. This is great if you have a lot of Tours, as the search will return matches for any content from these (Tour title, Step body text, etc.).Â
🎯 Go in and make sure you nail these down to your brand guidelines. Keep in mind that users appreciate contextual, relevant information and are keen on learning on their own.
Adding an Empty State
When all your Launcher items are configured to be hidden when completed, you can determine whether:
The Launcher will also be hidden
The Launcher will remain on the page and an Empty State will be shown.
Opting for the latter, all you need to do is to add an Empty State item and configure how your empty state should look like.
Launcher items will be marked as complete when their success condition has been met, regardless of whether the user has clicked the item within the checklist or not.
Hiding the Launcher after checklist is complete
When you configure a Launcher to be a checklist, you have the option to hide the Launcher entirely after each item has been checked. Just toggle on the "Hide upon completion" feature.
💡 After the checklist is completed, the Launcher will display an Empty State. Make sure that you have the Empty State disabled. Otherwise, that is what will display once the items are all checked.
Location and position
Similar to other Chameleon Experiences, you'll also have to ensure your Launcher is showing on the correct areas of your product.
The right way to do this is by leveraging:
Environments (from the Dashboard): Here you can define which domains and subdomains your Launcher will show in.
Element Rules (under "Display Rules"): Here you can require a given element to be present on the page for the Launcher to show.
Position (under "Design"): Indicate in which area of the screen your Launcher should show.
Targeting your Launcher
Launchers can also be targeted to a specific Segment of users.
This gives you the possibility to create multiple Launchers that fit different use cases. For example, you can leverage a Target Audience of users that are currently in the onboarding phase and target a Help Launcher to them.
Targeting Launchers is similar to targeting other Chameleon Experiences. Learn all about creating custom audiences with Chameleon, here.