<!-- LLM_VERSION_INFO
FORMAT: text/markdown
CONTENT_TYPE: article
ORIGINAL_URL: https://www.kapa.ai/blog/tutorial-how-to-make-a-front-email-ai-agent
ALTERNATE_VERSION: blog/tutorial-how-to-make-a-front-email-ai-agent/index.html (text/html)
EXTRACTION_DATE: 2026-04-19T00:04:35.109Z

This is the markdown version with text-only content (images converted to alt-text).
For rich formatting with images, request the HTML version at: blog/tutorial-how-to-make-a-front-email-ai-agent/index.html
-->

# How To Make A Front Email AI Agent

Learn how to build an AI-powered email support agent in Front using Kapa.ai - step-by-step setup with the flow builder, API integration, and automation rules.

by

Karl Jones

## Overview

What if every inbound support email got an instant, intelligent first response - without your team lifting a finger?

With [Front](https://front.com/) and [Kapa.ai](/content/site-root.html), you can build exactly that. Kapa is an AI platform trained on your documentation, and Front is the team inbox tool used by thousands of support and success teams. Together, they make it possible to wire up an AI agent that reads incoming emails, queries your knowledge base, and drafts a response automatically.

This tutorial walks you through the full setup: creating the Kapa Connector app in Front, configuring the API integration in the flow builder, and writing the rules that trigger the agent whenever a new conversation lands in your inbox.

No custom code required. Let's get started.

## Prerequisites

Before diving in, make sure you have the following:

- **A Front account** with access to developer settings (Admin or Developer role)
- **A Kapa.ai account** with an active project and access to your API key and project/integration IDs
- Familiarity with Front's flow builder is helpful but not required

You'll also want your Kapa credentials on hand:

- Your **API key** (from the Kapa dashboard)
- Your **project ID** (used in the API URL path)
- Your **integration ID** (used in the request body)

## Setup

### Step 1: Create the Kapa Connector App in Front

1. Open Front and navigate to **Settings → Developer Settings**  
2. Click **Create New App**  
3. Inside the app, click **Add New Feature** and select **App Request**  
4. Name the feature: **Kapa Connector**

### Step 2: Configure the Flow Builder

Once your app and feature are created, you'll land in the **Flow Builder** - a three-step visual editor that defines what happens when the app is triggered. Here's how to configure each step.

#### Collect Input

1. Click **Collect Input**  
2. Add a new input and name it `query`
3. This variable will hold the message body from the incoming email - it's what gets sent to Kapa as the query

#### Send Request

1. Click **Send Request**  
2. Set the **Method** to `POST`
3. Under **URL**, click **Add New Server** and configure it as follows:
   - **Origin:** `https://api.kapa.ai`
   - **Authentication strategy:** API Key
     - **Property name:** `X-API-KEY`
     - **Send as:** HTTP Header
     - Enter your Kapa API key when prompted
4. Set the **Path** to: `/query/v1/projects/:project_id/chat/`
   - Replace `:project_id` with your actual Kapa project ID
5. In the **Body** section, paste the following JSON - replacing `your_integration_id` with your real value and making sure `query` is passed as a dynamic variable (not hardcoded):
```json
{
  "integration_id":"your_integration_id",
  "query":"You are a Kapa.ai support agent, respond to this email: {{query}}"
}
```
_note: The `{{query}}` placeholder represents where your dynamic input variable should be inserted. In Front's flow builder, this should be wired as a variable reference, not typed literally with curly brackets._
6. Click **Run Test** to send a sample request and verify the connection is working  
7. From the test response, click on the `answer` and `is_uncertain` fields to save them as dynamic variables - you'll use both of these in the next step

#### Return Data

This step defines what data the app sends back to Front after querying Kapa.

Add two outputs:

**Output 1 - The AI's answer:**
- **Type:** String  
- **Name:** `answer`  
- **Data:** The `answer` variable captured from the API response

**Output 2 - Confidence signal:**
- **Type:** Boolean  
- **Name:** `is_uncertain`  
- **Data:** The `is_uncertain` variable captured from the API response

The `is_uncertain` flag is particularly useful - you can use it downstream to route low-confidence responses to a human agent for review instead of sending them directly.
Once both outputs are configured, click **Save**.

### Step 3: Set Up the Rule to Trigger the Agent

1. Go to **Settings → Rules & Macros**  
2. Click **Create New Rule** and select **Create Linear Rule**  
3. Configure the rule as follows:
**Trigger:**
- Select **Inbound message is received (new conversation)**

**Conditions:**
- Add any conditions that determine when the rule should apply - for example, limiting it to a specific inbox, tag, or sender domain. This ensures the AI agent only fires where it makes sense.

**Actions:**
1. Click **Add Action** and select **Send App Request**
   - Choose the **Kapa Connector** app you created
   - In the `query` field, click **Add Variable**:
     - Create a new dynamic variable for **Message Body** - this pulls the email content from the incoming message
     - Then click on **Message Body**, choose **Add a Step**, and select `answer` - this chains the message through Kapa and retrieves the response
2. Click **Add Action** again and select **Add Comment**
   - In the body of the comment, insert the **App Request** variable (which contains the `answer` from Kapa)
   - This posts the AI's response as a comment on the conversation thread, visible to your team before it's sent
3. Click **Create** to activate the rule

## Conclusion

You've now set up a fully automated email AI agent inside Front, powered by Kapa. Every new inbound conversation will automatically be analysed by Kapa's AI, which generates a response grounded in your documentation. That response lands as a comment on the conversation - ready for your team to review, edit, and send.

From here, you can extend this setup further: use the `is_uncertain` flag to route low-confidence responses to a human review queue, add conditions to scope the rule to specific inboxes, or chain additional actions to close or tag conversations automatically.

If you run into any issues or want to explore more advanced Kapa configurations, [check out the Kapa documentation](https://docs.kapa.ai/).

## AI that actually understands your product

See how kapa.ai can transform your docs, support, and product experience.
