Build a Google Chat app with an Agent2UI agent

This page explains how to build a Google Workspace add-on that works in Google Chat and interfaces with an AI agent that uses the Agent2UI (A2UI) protocol. You develop the agent using the Agent Development Kit (ADK), and host it in Vertex AI Agent Engine.

AI agents autonomously perceive their environment, reason, and execute complex, multi-step actions to achieve a defined goal. In this tutorial, you deploy a basic AI agent that returns static profile information retrieved from a tool.

A2UI enables AI agents to generate adaptive, rich, interactive UIs that render natively. You can then focus on the logic of the AI agents, not the UIs.

Figure 1. The A2UI agent responds to the user with text and a card containing the name, image, and LinkedIn button.
Figure 2. The A2UI agent is updated to return the profile title as well.
Figure 3. The A2UI agent responds to the user with a message that displays the profile name in the card.

The following diagram shows the architecture and messaging pattern:

Architecture of a Chat app implemented with an A2UI AI agent.

In the diagram, a user interacting with a Chat app implemented with an A2UI agent has the following flow of information:

A user sends a message to a Chat app, either in a direct message or in a Chat space.
The Chat app logic that's implemented either in Apps Script or as a web server with HTTP endpoints receives and processes the message.
The A2UI agent hosted with Vertex AI Agent Engine receives and processes the interaction.
Optionally, the Chat app or AI agent can integrate with Google Workspace services, such as Calendar or Sheets, or other Google Services, such as Google Maps or YouTube.
The Chat app generates and sends adaptive responses asynchronously, using the Google Chat API to communicate the AI agent's progress.
The responses are delivered to the user.

Objectives

Set up your environment.
Deploy the A2UI agent.
Deploy the Chat app.
Configure the Chat app.
Test the Chat app.

Prerequisites

A Business or Enterprise Google Workspace account with access to Google Chat.
A Google Cloud project with billing enabled. To check that an existing project has billing enabled, see Verify the billing status of your projects. To create a project and set up billing, see Create a Google Cloud project.
Python 3.11+: For installation, follow instructions on the official Python website.
Python Poetry: For installation, follow instructions on the official Poetry website.
Google Cloud CLI: For installation, follow instructions on the official Google Cloud website.

Set up your environment

Enable the Google Cloud APIs

Before using Google APIs, you need to turn them on in a Google Cloud project. You can turn on one or more APIs in a single Google Cloud project.

In the Google Cloud console, enable the Google Chat, Vertex AI, and Cloud Resource Manager APIs.

Enable the APIs

Configure the OAuth consent screen

All apps using OAuth 2.0 require a consent screen configuration. Configuring your app's OAuth consent screen defines what is displayed to users and app reviewers, and registers your app so you can publish it later.

In the Google Cloud console, go to Menu > Google Auth platform > Branding.
Go to Branding
If you have already configured the Google Auth platform, you can configure the following OAuth Consent Screen settings in Branding, Audience, and Data Access. If you see a message that says Google Auth platform not configured yet, click Get Started:

Under App Information, in App name, enter a name for the app.
In User support email, choose a support email address where users can contact you if they have questions about their consent.
Click Next.
Under Audience, select Internal.
Click Next.
Under Contact Information, enter an Email address where you can be notified about any changes to your project.
Click Next.
Under Finish, review the Google API Services User Data Policy and if you agree, select I agree to the Google API Services: User Data Policy.
Click Continue.
Click Create.

For now, you can skip adding scopes. In the future, when you create an app for use outside of your Google Workspace organization, you must change the User type to External. Then add the authorization scopes that your app requires. To learn more, see the full Configure OAuth consent guide.

Create a service account in Google Cloud console

Create a new service account with the role Vertex AI User by following these steps:

Google Cloud console

In the Google Cloud console, go to Menu > IAM & Admin > Service Accounts.
Go to Service Accounts
Click Create service account.
Fill in the service account details, then click Create and continue.
Note: By default, Google creates a unique service account ID. If you would like to change the ID, modify the ID in the service account ID field.
Optional: Assign roles to your service account to grant access to your Google Cloud project's resources. For more details, refer to Granting, changing, and revoking access to resources.
Click Continue.
Optional: Enter users or groups that can manage and perform actions with this service account. For more details, refer to Managing service account impersonation.
Click Done. Make a note of the email address for the service account.

gcloud CLI

Create the service account:

gcloud iam service-accounts create SERVICE_ACCOUNT_NAME \
  --display-name="SERVICE_ACCOUNT_NAME"

Optional: Assign roles to your service account to grant access to your Google Cloud project's resources. For more details, refer to Granting, changing, and revoking access to resources.

The service account appears on the service account page.

Create a private key

To create and download a private key for the service account, follow these steps:

In the Google Cloud console, go to Menu > IAM & Admin > Service Accounts.
Go to Service Accounts
Select your service account.
Click Keys > Add key > Create new key.
Select JSON, then click Create.
Your new public/private key pair is generated and downloaded to your machine as a new file. Save the downloaded JSON file as credentials.json in your working directory. This file is the only copy of this key. For information about how to store your key securely, see Managing service account keys.
Click Close.

For more information about service accounts, see service accounts in the Google Cloud IAM documentation.

Deploy the A2UI agent

If you haven't done so, authenticate with your Google Cloud account and configure the Google Cloud CLI to use your Google Cloud project.
```
gcloud auth application-default login
gcloud config set project PROJECT_ID
gcloud auth application-default set-quota-project PROJECT_ID
```
Replace PROJECT_ID with the ID of your Cloud project.
Download the googleworkspace/add-ons-samples GitHub repository using this button:

Download repository
In your preferred local development environment, extract the downloaded archive file and open the add-ons-samples/apps-script/chat/a2ui-ai-agent/a2ui directory.
```
unzip add-ons-samples-main.zip
cd add-ons-samples/apps-script/chat/a2ui-ai-agent/a2ui
```
Create a new Cloud Storage bucket dedicated to the ADK agent.
```
gcloud storage buckets create gs://CLOUD_STORAGE_BUCKET_NAME --project=PROJECT_ID --location=PROJECT_LOCATION
```
Replace the following:
1. CLOUD_STORAGE_BUCKET_NAME with a unique bucket name you want to use.
2. PROJECT_ID with the ID of your Cloud project.
3. PROJECT_LOCATION with the location of your Cloud project.
Set the following environment variables:
```
export GOOGLE_GENAI_USE_VERTEXAI=true
export GOOGLE_CLOUD_PROJECT=PROJECT_ID
export GOOGLE_CLOUD_LOCATION=PROJECT_LOCATION
export GOOGLE_CLOUD_STORAGE_BUCKET=CLOUD_STORAGE_BUCKET_NAME
```
Replace the following:
1. CLOUD_STORAGE_BUCKET_NAME with the name of the bucket you created.
2. PROJECT_ID with the ID of your Cloud project.
3. PROJECT_LOCATION with the location your Cloud project.

Install and deploy ADK agent from virtual environment.

python3 -m venv myenv
source myenv/bin/activate
poetry install --with deployment
python3 deployment/deploy.py --create

Retrieve the agent ID. You need it later, when you configure the Chat app.
```
python3 deployment/deploy.py --list
```

Create and configure the Chat app project

Click the following button to open the A2UI AI Agent Quickstart Apps Script project.

Open the project
Click Overview > Make a copy.
In your Apps Script project, click Project Settings > Edit script properties > Add script property to add the following script properties:
1. REASONING_ENGINE_RESOURCE_NAME with the Vertex AI agent resource name copied in previous steps.
2. SERVICE_ACCOUNT_KEY with the JSON key from the service account downloaded in previous steps such as { ... }.
Click Save script properties.
In the Google Cloud console, go to Menu > IAM & Admin > Settings.

Go to IAM & Admin Settings
In the Project number field, copy the value.
In your Apps Script project, click Project Settings.
Under Google Cloud Platform (GCP) Project, click Change project.
In GCP project number, paste the Google Cloud project number copied in previous steps.
Click Set project. The Cloud project and Apps Script project are now connected.

Create a test deployment

You need a deployment ID for this Apps Script project, so that you can use it in the next step.

To get the head deployment ID, do the following:

In the Chat app Apps Script project, click Deploy > Test deployments.
Under Head deployment ID, click Copy.
Click Done.

Configure the Chat app

Using your Apps Script deployment, follow these steps to deploy the Google Chat app for testing:

In the console, search for Google Chat API, and click Google Chat API.
Click Manage.
Click Configuration and set up the Chat app:
1. In the App name field, enter A2UI Quickstart.
2. In the Avatar URL field, enter https://developers.google.com/workspace/add-ons/images/quickstart-app-avatar.png.
3. In the Description field, enter A2UI Quickstart.
4. Under Functionality, select Join spaces and group conversations.
5. Under Connection settings, select Apps Script project.
6. In the Deployment ID field, paste the Head deployment ID that you previously copied.
7. Under Visibility, select Specific people and groups in your domain, and enter your email.
Click Save.

The Chat app is ready to respond to messages.

Test the Chat app

To test your Chat app, open a direct message space with the Chat app and send a message:

Open Google Chat using the Google Workspace account that you provided when you added yourself as a trusted tester.

Go to Google Chat
Click New chat.
In the Add 1 or more people field, type the name of your Chat app.
Select your Chat app from the results. A direct message opens.

Note: If you don't see your Chat app in the list of results, ensure that you've included your Google Workspace account in the Visibility settings of the Chat API Configuration page in the Google Cloud console.
In the new direct message with the app, type Hello! and press enter.

The Chat app replies a message with greeting text and a card containing the profile name, image, and LinkedIn button.

Update the implementation of the A2UI agent to start returning the profile title as well.

In your local development environment, open the file a2ui/agent.py and uncomment the line in the tool that adds the title to the returned data.

apps-script/chat/a2ui-ai-agent/a2ui/a2ui/agent.py

View on GitHub

# Copyright 2026 Google LLC
#
# Licensed under the Apache License, Version 2.0 (the "License");
# you may not use this file except in compliance with the License.
# You may obtain a copy of the License at
#
#     http://www.apache.org/licenses/LICENSE-2.0
#
# Unless required by applicable law or agreed to in writing, software
# distributed under the License is distributed on an "AS IS" BASIS,
# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
# See the License for the specific language governing permissions and
# limitations under the License.

"""A2UI agent."""

from google.adk.agents import LlmAgent
from google.adk.tools.tool_context import ToolContext
import json

# The schema for any A2UI message. This never changes.
from .a2ui_schema import A2UI_SCHEMA

def get_user_profile(tool_context: ToolContext) -> str:
    """Call this tool to get the current user profile."""
    return json.dumps({
        "name": "Pierrick Voulet",
        # "title": "DevRel Engineer @ Google Workspace | Gen AI & AI Agents & Agentic AI | Automation & Digital Transformation",
        "imageUrl": "https://io.google/2024/speakers/3ea87822-3160-4d54-89dd-57e185085f79_240.webp",
        "linkedin": "https://www.linkedin.com/in/pierrick-voulet/"
    })

AGENT_INSTRUCTION="""
You are a user profile assistant. Your goal is to help users get their profile information using a rich UI.

To achieve this, you MUST follow these steps to answer user requests:

1.  You MUST call the `get_user_profile` tool and extract all the user profile information from the result.
2.  You MUST generate a final a2ui UI JSON based on the user profile information extracted in the previous step."""

A2UI_AND_AGENT_INSTRUCTION = AGENT_INSTRUCTION + f"""

To generate a valid a2ui UI JSON, you MUST follow these rules:
1.  Your response MUST be in two parts, separated by the delimiter: `---a2ui_JSON---`.
2.  The first part is your conversational text response.
3.  The second part is a single, raw JSON object which is a list of A2UI messages.
4.  The JSON part MUST validate against the A2UI JSON SCHEMA provided below.

To represent the user profile, you MUST use the following A2UI message types:
1.  Buttons MUST be used to represent links (e.g., LinkedIn profile link).
2.  Image MUST be used to represent the user's profile picture.

---BEGIN A2UI JSON SCHEMA---
{A2UI_SCHEMA}
---END A2UI JSON SCHEMA---
"""

root_agent = LlmAgent(
    name="user_profile",
    model="gemini-2.5-flash",
    instruction=A2UI_AND_AGENT_INSTRUCTION,
    description="An agent that returns the current user profile.",
    tools=[get_user_profile]
)

Update the ADK previously deployed with the new version of the implementation.
```
python3 deployment/deploy.py --update --resource_id=RESOURCE_ID
```
Replace RESOURCE_ID with the Vertex AI agent resource name copied in previous steps.
In the direct message with the app, type Hello again! and press enter.

The Chat app replies a message with some text and a card containing the profile title.

To add trusted testers and learn more about testing interactive features, see Test interactive features for Google Chat apps.

Troubleshoot

When a Google Chat app or card returns an error, the Chat interface surfaces a message saying "Something went wrong." or "Unable to process your request." Sometimes the Chat UI doesn't display any error message, but the Chat app or card produces an unexpected result; for example, a card message might not appear.

Although an error message might not display in the Chat UI, descriptive error messages and log data are available to help you fix errors when error logging for Chat apps is turned on. For help viewing, debugging, and fixing errors, see Troubleshoot and fix Google Chat errors.

Clean up

To avoid incurring charges to your Google Cloud account for the resources used in this tutorial, we recommend that you delete the Cloud project.

In the Google Cloud console, go to the Manage resources page. Click Menu > IAM & Admin > Manage Resources.
Go to Resource Manager
In the project list, select the project you want to delete and then click Delete .
In the dialog, type the project ID and then click Shut down to delete the project.