Personalization

Check out Page Morph, Custom Variables, and Choose Your Own Adventure!

All the features below, including Page Morph, Custom Variables, and Choose Your Own Adventure, are available on the Growth plan. You can trial Growth for free here.

Page Morph

What is Page Morph?

Page Morph is the ability to edit any text on your page before recording. These edits will stay in place, even if you click or refresh the page.

How can I remove the Page Morph edits?

If a page has any edits, you'll see a small popup in the bottom of the screen that says "This domain has edits." You can always remove the edits by clicking Edit and then Reset all.

What are some use cases for Page Morph?

You can use Page Morph to remove private customer data from the screen, quickly personalize a demo for a specific customer, delete clutter from the screen for a cleaner demo, and more!

Custom Variables

Variables and custom links allow you to personalize all text elements within your Arcades to tailor content to your unique viewers. In the example below, we’ve personalized the chapter title with the names of some folks who work at Arcade to illustrate a common use case: adding the viewer’s name in a salutation at the start of an Arcade.

What are variables?

Personalization within Arcades is powered by variables. Variables are placeholders you can define that turn the text within your Arcade into templates. At view time, these templates will be replaced with personalized values. For example, if you view the Arcade above in the editor, you’ll see a variable in place of our team members' names: {{ first_name }}.

Where can I define the variables?

Variables are defined in your Arcade’s settings modal in the editor. You can create as many variables as you need for each Arcade, and to help you get started, we register the common first_name and company_name variables by default. Variables may contain any alphanumeric character and underscores. They also have default values which will be used if no value is provided via custom links (see more on custom links below); if no default is provided, they'll fall back to an empty value.

Once registered, variables can be used in any text element inside an Arcade – hotspots, callouts, chapter titles, chapter subtitles, chapter buttons, the Arcade's title, and the Arcade's description – by referencing the variable’s name surrounded by two curly braces on each side (spaces within the braces are optional): {{ first_name }}.

Once you’ve created your variables and edited your Arcade so they appear in the appropriate places, there are two forms of personalized links you can use to share the Arcade. For both, you'll want to start by publishing your Arcade in the Share menu and navigating to the Custom links tab in the menu.

Sometimes you may need to personalize your Arcade for many viewers, in which case creating individual custom links for each one would not be feasible. (See the following section for some examples of when this form of custom links may come in handy!)

In the Custom links tab of the Share menu, you'll see a section at the bottom that says Sharing this Arcade at scale? which contains two buttons: Copy link template and Copy embed template. Depending on whether you'll just need to share a personalized link to your Arcade or you'll need to embed a personalized version of your Arcade in your website or app, click the button that best fits your use case.

You'll see that the template copied to your clipboard contains placeholder values, INSERT_VALUE_HERE, for each variable you've registered. For example, if you chose to Copy link template, your copied link will look something like this if your Arcade has first_name and company_name variables:

https://app.arcade.software/share/ARCADE_ID?variable.first_name=INSERT_VALUE_HERE&variable.company_name=INSERT_VALUE_HERE

Each variable and value pair is separated by an & with the value assigned to the variable via an = character. These variable names, starting with variable. and followed by the variable's name, are called query parameters in URLs.

Wherever you'll be using this Arcade, simply replace the placeholder in each query parameter with your dynamic, custom value to ensure your viewers see a demo personalized just for them.

This form of personalization is perfect for high-touch outreach to specific prospects, customers, or partners.

To create a personalized version of your Arcade for a particular viewer, click the Create button in the Custom links tab, give your link a recognizable name (this will only be visible to you and your team), and provide the variable values you'd like to use for the intended viewer. After saving your link, simply click Copy link next to the new entry and share it will your desired viewers!

What are some use cases for personalization at scale?

Personalize Arcades in email, newsletters, or drip campaign

Most email software, such as SendGrid, allows you to create templates with variables that are replaced with recipient-specific values at send time. The specifics of this functionality vary across services, but each can be used to personalize Arcade template links in your customer outreach.

Personalized Arcade inside of an Intercom message

Intercom’s Messenger allows admins to create messages that appear when the user uses the product. Defining these messages is simple and can be done in minutes. Intercom provides users access to an extensive list of variables that can be used to personalize Arcade template links.

Personalized in-product onboarding

Many Arcade customers are using Arcades inside their products via embedding to help with onboarding. Products can be a wealthy source for variable inputs that could feed a personalized Arcade. For example, imagine tailoring the Arcade based on the user’s role in the app.

Personalize your homepage Arcades

Imagine viewing a website and having the Arcade know what company you work for and possibly your title. Yes, this is possible if you bridge data from Clearbit Reveal with a personalized Arcade.

Choose Your Own Adventure

What is Choose Your Own Adventure?

Choose Your Own Adventure is our new name for Advanced Branching! In addition to regular branching with hotspots, we now support adding multiple buttons to chapters, each leading to a different end step.

What are some sample use cases for CYA?

You can use CYA to allow customers to choose a path based on their personae (sales, marketing, customer success), their interested (Feature A, Feature B, Book a Call), their level of understanding, to survey them, or more!

Will I be able to see Insights from CYA?

For sure! Wherever there is a branch in your Arcade, the Insights table will show a little branch icon. If you hover over the branch, you'll be able to see the specific drop-off and engagement percentage for each option. If you scroll down to the bottom of the Insights page, you'll see specific engagement charts for each branch.

Forms

How do I add a form to my Arcade?

Yup! Just select the Form button from the right hand toolbar and it will add a Chapter to your Arcade. All Chapters can either have buttons (leading people to specific places within the Arcade or external URLs) or form fields.

Where do I see the responses?

Responses to the forms are stored in Insights and emailed to the Arcade creator. You can turn off the email notifications at any time from within Insights.

Can I download the responses?

Form responses are downloadable in CSV form from the Insights page.

What are the different fields in the Form?

Each option you add in the form will have a text area for you to prompt answers from your viewers. For example, as show below, you can write "Enter your email..." or "Phone number", etc.

If you click on the question, you'll see a number of options pop up:

  1. Validation: Choose whether you'd like the answer to be the form of of an email, text string, multiple choice, or a hidden fields.

  2. Field name: This is an internal field, not seen by viewers. It allows you to set the name for the columns you'll see / be able to export from Insights.

  3. Required: Whether or not a viewer can progress without this filled out.

  4. Settings: Only shown when validation is set to email. This allows you to exclude generic emails (e.g. Gmail) and only allow company emails to proceed.

Can I add a webhook to form submissions (or elsewhere)?

Yes! Check out this Arcade to see how you can add webhooks to forms.

Last updated