Skip to main content

Hub Overview

The Hub – also known as the Playground – is your primary interaction space where you talk to your AI agents. It ships in three related modes, all built on the same chat composer:
RouteModeUse it for
/new-playground/new-chatNew chatA fresh conversation – pick agent, model, voice, and avatar before sending your first message.
/{conversationId}/chatText chatContinue an existing text conversation with file attach and image generation.
/{conversationId}/avatar-chatAvatar chatA live 3D avatar that listens, speaks, and reacts in real time.
The home route (/) automatically loads your most recent conversation. If you don’t have one yet, it redirects to New chat. New chat composer New chat with the welcome line and the chat composer pills for agent, character, model, and voice.

Hub Components

New chat composer

When you open New chat you see a welcome line and a single chat composer with configuration pills:
  • Knowledge base / Agent – which agent answers you
  • LLM model – which large language model to use
  • Voice – which voice the avatar will speak with
  • Avatar / Character – the 3D companion or 2D character that appears
Type your first message and press Enter. Aivah creates a new conversation, redirects to its chat URL, and delivers the message. If any default cannot be loaded automatically you’ll see a toast – set defaults from Preferences (palette icon).
Agent picker in composer
LLM model picker in composer
Voice picker in composer

Avatar / scene canvas (Avatar chat)

On /{conversationId}/avatar-chat the page splits in two:
  • Avatar / scene canvas – a real-time 3D rendering with lip-sync that reacts to audio
  • Side panel – chat transcript, composer, and inline voice controls
On smaller screens the layout switches to a vertical resizable split.
Avatar chat zen scene

Scene Selection

The palette icon next to the composer opens Preferences, where you choose your default avatar and scene. The first time you visit Avatar chat without an avatar selected, Preferences opens automatically.
Preferences avatar tab
Preferences scene tab
Available scenes:
ScenePurpose
StandardEmpty studio.
ZenCalm zen background.
Web ResultsEmbedded web pages while you talk.
VideoVideo wall.
Present 1 / Present 2Slide presentation backdrops.

Floating productivity toolbar

When the active agent supports them, additional icons surface next to the chat composer:
  • Quiz overlay – multiple-choice questions for presentation agents
  • Mind map – an interactive mind map for the current content
  • Podcast player – plays the latest generated podcast for this agent
  • Chat toggle (speech bubble) – hide or show the transcript so the avatar has more room

Credits badge

A small pill in the top-right of Avatar chat shows your live credit balance and updates whenever the agent consumes credits (chat tokens, voice generation, image generation, etc.).

Core Functionality

Avatar & Character Management

  • 3D Avatars and 2D Characters: Switch between fully animated companions and image-based personas
  • Seamless Switching: Change avatars without losing conversation context
  • Real-Time Loading: Avatars load instantly with visual feedback
  • Voice Consistency: Each avatar can be paired with a built-in or cloned voice

Scene Environments

Multiple immersive environments enhance different interaction types: Standard Scene: Clean professional environment for general interactions Zen Scenes: Interactive widgets displaying websites, videos, or presentations Web Search Scene: Immersive search results with clickable source widgets Video Wall Scene: Customizable video backgrounds with upload capability Presentation Scenes: Interactive presentation delivery with slide control

Communication Options

Three Interaction Modes:
  • New chat: Pick agent, model, voice, and avatar before sending your first message
  • Text chat: Classic message thread with file attach and image generation
  • Avatar chat: Real-time 3D avatar with voice and lip-sync
  • Hybrid Support: Switch between text and voice within the same conversation

Chat composer features

The composer is shared by every mode:
  • Text input – multi-line, supports keyboard send
  • File attach – paper-clip icon attaches images, PDFs, Word docs, Excel sheets, PowerPoint
  • Image generation – pick an image model from the trailing dropdown to ask the agent to create a picture
  • Voice – tap the mic icon to dictate or switch to voice-first mode
  • Agent badge – shows which agent is currently active
  • Inline selectors – agent / model / voice pickers (visible on New chat)
While the agent is producing a long asset (slide deck, podcast, mind map) the Document Creating Banner appears so you know what’s happening.

Realtime Media Creation

  • Prompt-Based Images: Generate high-quality visuals without leaving the Hub
  • Instant Video Transformations: Convert fresh images into short clips in seconds
  • Powered Models: Google Nano Banana, Veo 3.1, and Sora 2 handle rendering behind the scenes
  • AI Drive Sync: Every asset drops automatically into the AI Drive integration for reuse

Getting Started

Initial Setup

  1. Mic/Audio Permissions: Grant browser permissions for voice interaction
  2. Avatar Selection: Choose your preferred avatar from the right carousel
  3. Scene Selection: Pick appropriate scene for your intended interaction
  4. Connection Status: Look for green dot indicating agent readiness

First Interaction

  1. Click Chat or Talk: Start your session with preferred communication mode
  2. Wait for Green Dot: Amber dot means connecting, green means ready, red means disconnected
  3. Begin Conversation: Ask questions or give instructions to your agent
  4. Explore Features: Try different scenes and avatar combinations

Session Management

  • Active Sessions: Green dot shows active connection status
  • Idle Timeout: Sessions expire after 20 minutes of inactivity
  • Reconnection: Click chat or talk icons to restart, or refresh page
  • WebRTC Connection: System uses WebRTC for optimal real-time performance

Advanced Features

Smart Memory Management

  • Context Retention: Agents remember key information across conversations
  • Personal Data: Names, preferences, tasks, and important details stored
  • Session History: Previous conversations accessible through options menu

Agentic Capabilities

  • RAG Integration: Intelligent retrieval from your knowledge sources
  • Web Search: Live web search with immersive result display
  • Tool Integration: Composio MCP connectors for Gmail, Calendar, Notion, Linear, Slack, GitHub and more
  • Channel Integration: Native Slack and WhatsApp bots that respond using the same agent
  • Phone Capabilities: Bring-your-own Twilio number for inbound and outbound calls
  • Tasks: Cron jobs and heartbeat monitors created on demand from chat

Interactive Status Display

Real-time status indicators show agent activities:
  • Searching: Agent finding information in knowledge base
  • Web Searching: Performing live web searches
  • Tool Calling: Using connected applications and workflows
  • Memory Updates: Storing important conversation details
  • Message Processing: Generating responses and taking actions

Agent Tool Integration Example

Watch agents perform real-world tasks like sending emails through connected applications: Agent Gmail Integration Agent successfully sending email through Gmail integration, showing tool calling capabilities and real-world task execution

Scene-Specific Features

Presentation Mode

  • Interactive Slides: Agent controls slide progression
  • Content-Aware Navigation: Slides advance based on conversation context
  • Presentation Upload: PDF presentations integrated with agent knowledge

Video Wall Experience

  • Custom Videos: Upload MP4 files under 50MB
  • Background Integration: Videos play while maintaining agent interaction
  • Upload Controls: Access upload button near talk/chat controls

Web Search Visualization

  • Immersive Results: Search results displayed as interactive 3D widgets
  • Source Access: Click widgets to open cited sources in new tabs
  • Visual Context: Search results spatially arranged around agent

Interactive Widgets (Zen Scenes)

  • Website Display: Show live websites from knowledge source URLs
  • YouTube Integration: Play videos while maintaining agent interaction
  • Presentation Viewer: Display uploaded presentations with agent commentary

Best Practices

Optimal Usage

  • Grant Permissions: Always allow microphone and audio access
  • Stable Connection: Ensure reliable internet for smooth WebRTC performance
  • Scene Selection: Choose scenes that match your interaction goals
  • Session Awareness: Monitor connection status indicators

Troubleshooting

  • Connection Issues: Look for red dots and refresh if needed
  • Audio Problems: Check browser permissions and microphone settings
  • Avatar Loading: Allow time for character switching and scene changes
  • Session Timeout: Restart sessions after extended idle periods

Integration with Platform

Avatar Library Connection

  • Directly connected to your Available Avatars collection
  • Changes to avatars and Characters reflect immediately in Hub
  • System avatars like Orbe available alongside custom avatars

Voices

  • Choose from Aivah’s built-in voice library or your own voice clones
  • Switching the LLM provider may filter the available voice list

Agent Integration

  • Access all created agents through the composer pills or the side navigation
  • Switch between different AI models and voice settings
  • Conversation history maintained across agent switches

Sharing Preparation

  • Test avatars and agents thoroughly in Hub before sharing
  • Validate voice, appearance, and knowledge accuracy
  • Use Hub testing to refine agent responses and behaviors
Ready to start interacting? Choose an avatar, select a scene, and begin your conversation!