> ## Documentation Index
> Fetch the complete documentation index at: https://platform.perso.ai/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Overview

Perso Interactive Web SDK enables developers to build real-time, voice-enabled AI avatars in the browser.

\
**The Perso Interactive Web SDK is a browser-first SDK designed for creating interactive AI avatars and chat experiences with low-latency audio, video, and text streaming**.

It handles session creation, real-time WebRTC connections, and event-driven chat state updates while allowing developers to configure STT type, TTS type, LLM type, background image, prompts, and documents.

> ## Demo App Installation
>
> Learn how to install Perso Interactive Web SDK Demo App.
>
> [<u>Install Perso Interactive Web SDK Demo App →</u>](https://perso-platform.readme.io/docs/web-sdk)

> ## **Perso Interactive Web SDK Repository**
>
> Learn how to install and fully configure Perso Interactive Web SDK.
>
> [<u>Explore Perso Interactive Web SDK Repository→</u>](https://github.com/perso-ai/perso-interactive-sdk-web)

## Key Features

<Card title="Real-Time AI Avatars" icon="user-vneck-hair-long">
  Interact with AI avatars with real-time audio, video, and text streaming.
</Card>

<Card title="Conversational AI Pipeline" icon="message-bot">
  A configurable STT → LLM → TTS pipeline enabling natural, low-latency AI conversations in the browser.
</Card>

<Card title="Configurable Session Architecture" icon="gears">
  Dynamically select models, prompts, documents, backgrounds, tools, and MCP servers per session.
</Card>

<Card title="Browser-Native & Secure" icon="desktop">
  Runs entirely in modern browsers using WebRTC, with flexible server-side or client-side session creation.
</Card>

# **How It Works**

The Perso Interactive Web SDK connects your web application to the Perso AI Platform through a real-time WebRTC session.

Integration starts by fetching available session settings (STT type, TTS type, LLM type, background image, prompts, and documents) creating a session ID using your API key, and then establishing a WebRTC connection in the browser.

Once connected, your application subscribes to chat states and events to render messages, control voice input/output, and handle tool calls in real time.

<Frame>
  <img src="https://mintcdn.com/estsoftcorp-ffedd976/P6qbTz13gUA6nea_/images/image.png?fit=max&auto=format&n=P6qbTz13gUA6nea_&q=85&s=dfa265938360666ac10350f3080a9877" alt="Image" width="906" height="814" data-path="images/image.png" />
</Frame>
