> For the complete documentation index, see [llms.txt](https://docs.uptiq.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.uptiq.ai/ai-workbench-qore/console/agent-builder/the-canvas.md).

# The Canvas

The Builder Canvas is the visual overview of the agent configuration inside the UPTIQ Qore Platform Agent Builder. It presents the agent at the center, with its connected knowledge, skills, triggers, and integrations arranged around it in a structured layout.

<figure><img src="https://1326225582-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0qmgQjJ5aArDTj2ACFHG%2Fuploads%2Fgit-blob-3660516ba2ecbaeb4628573e0f4e5d76c12d6ae3%2Fqore_agent-builder_studio-agent-builder-attach-agent-canvas_rounded_shadow.png?alt=media" alt="The Builder Canvas, with the agent at the center and connected knowledge, skills, and triggers arranged around it"><figcaption><p>The Builder Canvas.</p></figcaption></figure>

The canvas acts as a high-level representation of how the agent has been configured. At a glance, you can quickly understand:

* What knowledge sources are attached
* Which skills and connectors are available
* How many triggers are configured
* What runtime capabilities the agent has access to

Most configuration changes happen through **Agent Config**, but the canvas serves as the primary navigation surface for understanding the agent setup and accessing related workflows.

***

## The core layout

The canvas follows a simple mental model: one agent with connected capabilities around it.

### Agent

The agent appears at the center of the layout with its avatar, name, and agent type.

### Knowledge

Knowledge sources appear to the left of the agent, below **Triggers**. These represent the files, documents, and connected data sources the agent can reference during execution.

### Skills and Integrations

Skills and connected integrations appear to the right of the agent. These include platform-provided skills, MCP-based integrations, external connectors, and additional capabilities attached to the agent.

### Triggers

Triggers appear to the left of the agent, above **Knowledge**. Triggers define the events or actions that can initiate agent execution.

Each section in this guide maps back to one of these areas of the canvas.

## The headers <a href="#the-headers" id="the-headers"></a>

The Agent Builder has two headers: one above the chat on the left, and one above the canvas on the right.

### Chat header

* **Agent name**: opens the agent's options menu, with **Back** and **Rename Agent**.
* **Chat history**: your past conversations with the builder.
* **New chat**: starts a fresh conversation with the builder.
* **Need Help? Report the Issue** (the **?** icon): opens a form to raise a request. See [Report an issue](#report-an-issue).
* **Toggle Panel**: hides or shows the chat.

### The builder chat

* **Attach Files**: select **+** beside **Type here…**, then **Attach Files** (*Upload files from your device*).
* **Context usage**: the ring beside the send arrow shows how much of the chat's context is used. Hover for how full it is, such as *11% Full*, the tokens used out of the total, such as *\~21.1K / \~200.0K Tokens*, and the tokens taken by **User messages**, **Assistant messages**, **Tool calls**, and **Tool results**.
* **Credits per reply**: each builder reply shows the credits it used, such as *70.3 credits · $0.0351*.
* **Chats from an older version**: these show *This chat was made in an older version.* Select **Migrate chat** to keep building in it with its history (migrating can take a while), or **Start new conversation**.

<figure><img src="https://1326225582-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0qmgQjJ5aArDTj2ACFHG%2Fuploads%2Fgit-blob-9c0e62353fda93798f14d726177fbb0b6c1039b4%2Fqore_agent-builder_how-to-context-usage_rounded_shadow.png?alt=media" alt="The context usage breakdown: 11% Full, about 21.1K of 200.0K tokens, with User messages, Assistant messages, Tool calls and Tool results"><figcaption><p>Context usage in the builder chat.</p></figcaption></figure>

<figure><img src="https://1326225582-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0qmgQjJ5aArDTj2ACFHG%2Fuploads%2Fgit-blob-5476e3536479aab0160cefea4cfb292e26ce78cb%2Fqore_agent-builder_how-to-migrate-chat_rounded_shadow.png?alt=media" alt="The notice This chat was made in an older version, with Migrate chat and Start new conversation buttons"><figcaption><p>A chat from an older version.</p></figcaption></figure>

### Canvas header

<figure><img src="https://1326225582-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0qmgQjJ5aArDTj2ACFHG%2Fuploads%2Fgit-blob-4c319badc50b2ba5cb0fd89dddfbe4970eb4ca7e%2Fqore_agent-builder_header-2-16_rounded_shadow.png?alt=media" alt="The Agent Builder header: chat history, new chat, help and panel icons on the left; the Overview and Flow tabs; then credits and cost, the version selector, download, integrate and export icons, Agent Config and Try Agent"><figcaption><p>The Agent Builder header.</p></figcaption></figure>

From left to right:

* **Overview** and **Flow**: the two views of the agent. See [Overview and Flow tabs](#overview-and-flow-tabs).
* **Credits and cost**: what the agent has used, such as `1,530 credits` and `$0.77`. Hover for the breakdown.
* **Version selector**: the version you're viewing, such as **Draft Version** or **v1.0**. See [Runtime & Versioning](/ai-workbench-qore/console/agent-builder/build/runtime-and-versioning.md).
* **Download Agent Version** (download icon): downloads the selected version's file to your browser. It appears only when you're on a saved version with no unsaved changes.
* **Integrate Agent** (`</>`): the options for running the agent inside your own app. See [Integrate Agent](/ai-workbench-qore/console/agent-builder/deploy/agent-integration.md).
* **Export Agent** (export icon): exports the agent as a package, delivered by email. You need the **Export Agent** capability; without it the button is disabled. See [Export Agent](/ai-workbench-qore/console/agent-builder/deploy/export-agent.md).
* **Agent Config**: opens the agent's settings.
* **Try Agent**: opens the Agent Playground in a new tab, where you can chat with the agent. You need the **Trigger Agent** capability, and the agent needs a widget key.

***

## Overview and Flow tabs <a href="#overview-and-flow-tabs" id="overview-and-flow-tabs"></a>

The canvas has two tabs, in the canvas header.

### Overview

The default view. It shows the agent at the center with its **Triggers**, **Knowledge**, **Skills**, and **Integrations** cards around it.

<figure><img src="https://1326225582-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0qmgQjJ5aArDTj2ACFHG%2Fuploads%2Fgit-blob-110b79580582985923ad6e49069a877d241acc94%2Fqore_agent-builder_canvas-overview-tab_rounded_shadow.png?alt=media" alt="The Overview tab: the agent at the center, Triggers and Knowledge cards to its left, and Skills and Integrations cards to its right"><figcaption><p>The Overview tab, the canvas's default view.</p></figcaption></figure>

### Flow

The Flow tab (formerly **Plan**) displays the agent’s decomposed execution flow as a sequence of steps the agent may follow during runtime, under *What the Agent will do*.

Instead of showing the visual layout of connected components, the Flow tab focuses on how the agent approaches task execution. It breaks the workflow into structured milestones, helping you understand:

* How the agent plans to solve a task
* The sequence of execution stages
* Which skills or integrations may be used during execution
* How larger workflows are decomposed into smaller operational steps

This view is useful for understanding orchestration logic, validating execution behavior, and reviewing how the agent is expected to progress through a task.

<figure><img src="https://1326225582-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0qmgQjJ5aArDTj2ACFHG%2Fuploads%2Fgit-blob-968f801f416ba680900d4fa54b241f88731e7a8d%2Fqore_agent-builder_canvas-flow-tab_rounded_shadow.png?alt=media" alt="The Flow tab: What the Agent will do, followed by a sequence of steps such as Receive and Validate Request and Analyze and Extract Questions, each with a short description"><figcaption><p>The Flow tab.</p></figcaption></figure>

## Report an issue <a href="#report-an-issue" id="report-an-issue"></a>

To raise a request, select **Need Help? Report the Issue** (the **?** icon) in the chat header. The **Need Help? Raise a Request** form opens with the agent already filled in.

<figure><img src="https://1326225582-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0qmgQjJ5aArDTj2ACFHG%2Fuploads%2Fgit-blob-9c1c59673e7016c150f3c495f44e05b25eac99af%2Fqore_agent-builder_report-issue-dialog_rounded_shadow.png?alt=media" alt="The Need Help? Raise a Request form, with the Agent field filled in, Title and What do you need help with? fields, an Upload button for attachments, and Cancel and Submit Request buttons"><figcaption><p>Raise a request from the Agent Builder.</p></figcaption></figure>

* **Title**: required, up to 200 characters.
* **What do you need help with?**: required, up to 2,000 characters. Explain the issue or the outcome you're trying to achieve.
* **Attachment**: optional. Upload up to five PNG or JPEG screenshots, each up to 10 MB.

Select **Submit Request**. Qore confirms with *Issue reported successfully. Thank you for your feedback!* The same form is available in App Builder.

## Interactive Areas on the Canvas

The canvas primarily acts as a visual overview rather than a direct editing surface.

Most nodes are informational summaries of the current agent state. Configuration changes are managed through **Agent Config** and related setup flows.

Some sections act as shortcuts into deeper workflows, such as:

* Adding knowledge
* Managing skills
* Configuring integrations
* Setting triggers

The visual layout helps you quickly understand what is connected to the agent and identify what may still need configuration.

***

## Why this matters

The Builder Canvas serves as the central navigation and visualization layer for the agent.

Understanding this layout makes it easier to:

* Review the current agent setup
* Navigate to the correct configuration area
* Validate attached knowledge and integrations
* Identify missing runtime capabilities
* Troubleshoot agent behavior during testing

Most pages in this guide either explain a section visible on the canvas or describe the configuration flows launched from it.

***

{% columns %}
{% column width="83.33333333333334%" %}

<p align="right"><em>Maintained by</em> <mark style="color:green;">Abhishek Paul</mark><br><code>AI-assisted, human-approved</code></p>
{% endcolumn %}

{% column width="16.666666666666664%" %}

<div align="left"><img src="https://1326225582-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0qmgQjJ5aArDTj2ACFHG%2Fuploads%2Fgit-blob-d034645b4f8f8ee661985f5306b60ded3289653c%2Fmaintainer-abhishek-paul.png?alt=media" alt="" width="60"></div>
{% endcolumn %}
{% endcolumns %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

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

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.uptiq.ai/ai-workbench-qore/console/agent-builder/the-canvas.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.
