# AI Builder

## Understanding the AI Builder

The AI Builder is Jimo’s intelligent tour generation assistant, designed to help you create experiences faster by leveraging contextual AI insights. Rather than manually building a tour from scratch, the AI Builder provides an entry point into the in-app creation process based on either a recorded user flow or highlighted interface elements.

<figure><img src="/files/j5Oi6EMZoWJ95RRJZm5B" alt=""><figcaption></figcaption></figure>

It differs from the Flow Builder (which handles step-by-step logic) and the Content Builder (which controls individual content blocks) by assisting with the very first draft—accelerating tour creation while keeping full customization control in your hands.

The AI Builder is especially useful when:

* You want to speed up the experience creation process with a guided draft.
* You need to replicate a user journey quickly and accurately.
* You prefer selecting elements directly in the live app context instead of structuring steps manually.

While the AI Builder doesn’t replace manual editing, it seamlessly integrates with the builder environment, allowing you to continue editing the generated tour using either the legacy Builder or the In-App editor.

{% hint style="info" %}
It is currently available only for **Tours**, ensuring that onboarding and walkthroughs benefit from AI support where it matters most.
{% endhint %}

***

## First Time Using the AI Builder

#### Step 1: Create a New Experience

<figure><img src="/files/MbkI6Z6S6P19M0PLpcYh" alt=""><figcaption></figcaption></figure>

From your dashboard:

1. Click **New Tour**.
2. Choose **Start with AI** under the "Generate a Tour with AI" option.

<figure><img src="/files/1JaU8TRglbzQa0oQHrWk" alt=""><figcaption></figcaption></figure>

#### Step 2: Enter Starting URL

<figure><img src="/files/8Cr5tJCZqFp7dRHYAgpU" alt=""><figcaption></figcaption></figure>

Paste the URL of the page where the user journey begins, then click **Enter Builder**. This action will take you in-app and present two modes of tour creation:

* **Guide users through a flow** - (Ideal for onboarding or step-by-step tutorials.)
* **Highlight specific elements** - (Best for showcasing features or providing contextual guidance.)

<figure><img src="/files/m7RzpVPBTmReb1lOSRE8" alt=""><figcaption></figcaption></figure>

***

## Managing AI Flow Creation

Each mode caters to different types of experiences—whether you're looking to recreate a sequential journey or spotlight individual features. Below is a breakdown of how each mode works and when to use them.

### Guide Users Through a Flow

This mode is best suited for creating onboarding flows or guided tutorials that mirror real user actions. It allows you to record a typical user journey through your product and automatically generates a step-by-step experience based on those interactions.&#x20;

<figure><img src="/files/fqSMdGzR8KrjYgQUxyuK" alt=""><figcaption></figcaption></figure>

It's particularly useful for showcasing multi-step processes, tool walkthroughs, or feature introductions where users need to be guided from one action to the next in context.

#### How it Works:

<figure><img src="/files/XZAwrStYQSu506UK8y55" alt=""><figcaption></figcaption></figure>

1. Select **Guide users through a flow**.
2. Click **Start recording**.
3. Perform the ideal user journey on your site. Jimo will track all meaningful interactions.

<figure><img src="/files/uxIeiJHhZDfVb4jYULtH" alt=""><figcaption></figcaption></figure>

#### On-Screen Tools:

* A bottom modal starts with a **Ready to select!** status and dynamically updates to show the number of interactions captured.
* Options to:
  * **Restart** – clear and re-record.
  * **Pause** – navigate without recording.
  * **Delete** – discard and return to mode selection.
  * **Generate Tour** – trigger AI to convert the recording into a tour.

<figure><img src="/files/LvyWijJaIpQzW8fgMkDq" alt=""><figcaption></figcaption></figure>

### Highlight Specific Elements

This mode is ideal for creating contextual help or spotlighting specific features within your app. Instead of recording a flow, it lets you manually select interface components you want to highlight.&#x20;

<figure><img src="/files/ONQdeDsVBwnN7NZh1Wec" alt=""><figcaption></figcaption></figure>

It's perfect for showcasing new UI elements, calling attention to important actions, or supporting users as they navigate key areas of your product. It’s a lightweight way to create targeted walkthroughs without requiring a full user journey capture.

#### How it Works:

1. Select **Highlight specific elements**.
2. Use **Select Mode** to click elements in the interface.
3. Hovered elements are highlighted and added upon click.

<figure><img src="/files/ZBP2XIfpj1kBttRiB7Ia" alt=""><figcaption></figcaption></figure>

#### On-Screen Tools:

* A bottom modal starts with a **Ready to select!** status and dynamically updates to show the number of selected elements as you make your selections.
* **Mode switch options:** A toggle lets you switch between two interaction styles depending on whether you're navigating or selecting elements.
  * **Interact Mode** – freely navigate within your application to move through pages or open menus.<br>

    <figure><img src="/files/KYhsTTnrsAqrKqLSIzZ7" alt=""><figcaption></figcaption></figure>
  * **Select Mode** – hover over interface elements to highlight them and click to add them to your selection.<br>

    <figure><img src="/files/Ty3987ceHEfZj1sOn5A6" alt=""><figcaption></figcaption></figure>
* Control buttons:
  * **Restart** – clears all current selections.
  * **Delete** – returns to the generation mode selection screen.
  * **Generate Tour** – builds the experience once you're happy with the selection.

⇒ Selected elements remain visually highlighted and can be removed via an ✕ icon in their corner.

***

## Editing and Finalizing the AI Tour

Whether created via recording or highlighting, once generated, you’re brought into **Preview Mode** to test the flow. Use bottom bar to **Recapture**, **Restart Preview**, or **Edit Tour**.

<figure><img src="/files/C7GpYLoG5iusTFTay1oH" alt=""><figcaption></figcaption></figure>

You can:

* Re-record or re-select content.
* Use the **Edit Tour** option:
  * [**Edit in builder**](/docs/build/builders/content-builder.md) – Access full flow editor.
  * [**Edit in-app**](/docs/build/builders/in-app-builder.md) – Refine placement directly on your product UI.

<figure><img src="/files/KNrKmuMHMQRBKCPT1Chf" alt=""><figcaption></figcaption></figure>

Tour logic, steps, and content can be then fully customized just like any other experience.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.usejimo.com/docs/build/builders/ai-builder.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.