Set up Appcues AI and your theme
Teach Appcues AI your product and brand so everything it builds fits.
Table of Contents
Before you launch your first campaign, give Appcues AI two things: context about your product, and a theme that matches your brand. It applies both to everything it builds, so experiences sound like your product and look like it without restyling each one.
Do this once, after you set up Appcues and before you launch your first campaign.
Prerequisites
- An admin role to add context rules. Only admins can see Settings > Appcues AI.
- Something that shows your brand: a screenshot of your product, a PNG or PDF from your design tool, a brand guidelines PDF, or your website's URL.
Step 1: Add context rules
Context rules are standing instructions Appcues AI follows in every conversation, for everyone on your team. Write down what it should always know about your product, so nobody has to repeat it in each prompt.
- Open Settings > Appcues AI.
- Click into the Context rules box in the AI Assistant section.
- Enter your rules. Cover:
- What your product does and who uses it, including the roles that matter, such as "service advisors and dealership GMs."
- The words your product uses, such as "Call your projects 'jobs', and refer to customers as 'clients'."
- Tone and language, such as "Write in plain, friendly English for non-technical users. Keep button labels to two words."
- Click Save. Your text stays in the box, and new conversations follow the rules.
Keep rules durable. "All copy is for small law firms, written in plain English" belongs here. "Make this Modal shorter" belongs in the prompt.
Appcues AI also keeps a memory for each user, built from their own conversations. See Configure Appcues AI.
Step 2: Build your theme with Appcues AI
A theme sets the default colors, fonts, corner radius, spacing, and button styles for your experiences. Appcues AI can build one from what you already have.
- On Home, start a conversation with Appcues AI.
- Give it something to work from:
- A screenshot or design spec. Attach a screenshot of your product, or a PNG or PDF exported from your design tool, and ask "Build a theme that matches this."
- A brand guidelines PDF. Attach it and ask for a theme that follows it.
- A URL. Share your product's or website's URL. Appcues AI reads the page and pulls its colors, fonts, and typography.
- A description. For example: "Build a theme using navy #1B2A4A, white, and a coral accent for buttons."
- Ask Appcues AI to set it as your account default. New experiences use it automatically.
- Review it. Themes are edited from inside an experience: open any Flow or Embed, click Experience Settings, then click Edit theme. The preview shows your headings, paragraph text, and buttons with the theme applied.
- Adjust anything that's off, either in the theme editor or by asking in the same conversation: "Make the primary button darker" or "Add a dark mode variant."
Appcues AI can restyle a theme's variants, but it can't rename or delete them, because experiences refer to variants by name. Rename or delete a variant in the theme editor.
See New Themes and advanced styling.
Lock in brand styles with design tokens
If your design team keeps colors and fonts as design tokens, import them into the theme from a JSON file exported from Figma or your design system. You can then limit pickers to your tokens, so nobody building an experience can use an off-brand color or font. See Use design tokens to lock in brand styles in your Appcues Theme.
Bring over a legacy theme
If your account has themes from the legacy Flow builder, you don't need to rebuild them. Ask Appcues AI to rebuild a legacy Flow and it migrates that Flow's theme in the same pass. See New Themes and advanced styling.
Confirm it worked
Ask Appcues AI to build a test experience, such as "Build a welcome Modal for new users." Check that:
- The copy follows your context rules: your product's terms, tone, and language.
- The Modal uses your theme's colors, fonts, and button styles without manual changes.
Delete the test experience when you're done.
If something isn't working
You don't see Settings > Appcues AI. Only admins can open it. Ask an admin on your account to add the context rules.
Appcues AI ignores your context rules. Rules apply to new conversations. Start a new one. If a rule still doesn't take, make it more specific.
The theme's colors or fonts are off. Screenshots don't always show exact values. Share your website's URL instead, or give the hex codes and font names directly.
Fonts don't match your product. In the theme editor, set the font family to Auto, or add your font as a font family token. A token names a font your product already loads, through Google Fonts, Adobe Fonts, or your own @font-face. It doesn't load the font itself. See Use design tokens to lock in brand styles in your Appcues Theme.
New experiences don't use your theme. Ask Appcues AI to set it as the account default, or select it under Experience Settings on the experience.
Contact support
If it still isn't working, collect the following and contact support@appcues.com:
- The theme name, and the name of an experience that should be using it
- The screenshot, PDF, or URL you gave Appcues AI
- A screenshot of the experience as it renders
- The browser and page URL where you see the problem