Skip to main content
In this guide, you’ll build a fully functioning customer support agent that lives on your website. It will answer inquiries, recommend products, and resolve customer issues. We’ll guide you through these steps:

Create Components

Build your agent’s foundation: a Website Knowledge Base, a Prompt, and a Web Chat Channel.

Assemble Your Agent

Combine your components into a single agent with a large language model, name, and description.

Test & Deploy

Preview your agent in chat, then deploy to your website or internal tools.
Click on hyperlinked topics to explore more information as you work through the guide.

Create Components

1

Knowledge Base

Your knowledge base serves as an internal source of truth for your agent. You can connect documents, website URLs, or databases. For this guide, we’ll link your website so your agent can fetch up-to-date product info.Navigate to the Knowledge Bases tab on the VIVI platform and click the Add New button. Fill in the required Name, Description, and Category sections. Once you add your URL into the website URL slot, you’ll be prompted to test the URL connection. This ensures your website is accesible to your agent. Once successful, click save and move onto your prompt!
2

Prompt

Your prompt defines the agent’s tone and behavior. You can either choose from one of our templates or build your own.Navigate to the Prompts tab and either click the Add New button to create your own or switch to the Templates menu to pick from a pre-built one. If you use a template, ensure you customize the default variables that are marked with square brackets. If building your own, we recommend you add the following sections at minimum: Profile, Safety, Tool Usage, Session Structure, and Example Session.
3

Channel

A channel is the way your agent will connect to your audience. Let’s use the web chat channel to embed the agent on your webiste.Navigate to the Channels tab and click the Add New button. Once you select Web Chat as the channel option, a customization screen will open up. This allows you to preview how the web chat will appear on your website. Configure the options so that the web chat fits your brand design and save the changes.

Assemble Your Agent

Your agent is the central brain of your system. It connects your components so that your assistant can reason and take actions. Navigate to the Agent tab and click the Add New button at the top of the page. Choose the agent name, description, and assign the components you built to your new agent. Select gpt-4.1 as your model and click save.

Test & Deploy

There are two ways to test your agent’s responses: live chat or evaluations. We recommend live chat testing to verify response tone and layout while evalutions is suited best to verifying accuracy and groundedness.
1

Live Chat

Navigate to the Chat button at the bottom left of the page and select your new agent from the dropbown menu. Chat with your agent to see if its responses match your tone. Refine your prompt or documentation to adjust responses if necessary.
2

Evaluations

Navigate to the Evaluations tab and click the Manage Dataset tab. Follow the pop-up guidance to build a .CSV that will allow the agent to test responses. Once you’ve created and uploaded your .CSV, head back to the Evaluations Run tab and select your agent, dataset, and number of repetitions to run the evaluation. Review the run results and adjust prompt or documentation as necessary.
Once satisfied with your agent’s responses, head back to your web chat channel and access the Installation tab. Copy the JavaScript code snippet and place it into the HTML on each web page where you want the agent to appear. Congratulations! Your agent is now live on your website.

Next Steps

  • On the Installation tab we offer a number of optional parameters, such as welcomemessage. Add optional parameters to customize your agent’s chat environment.
  • Integrations are external tools that allow agents to take actions. Try connecting your web chat agent to your CRM, such as HubSpot or Salesforce, to help track client questions and leads.