Interactive Avatarfor Websites and Apps

What Is an Interactive Avatar?

An interactive avatar is a digital character that can speak, respond, and guide users inside a website or app. Avatar AI SDK gives your product a visual presentation layer that works with your existing content, chatbot, or AI agent.

Instead of generating one-off avatar videos, you can embed a reusable avatar experience that speaks with text-to-speech, syncs mouth movement with audio, and fits into your existing frontend.

• Add an interactive avatar without rebuilding your product UI.
• Connect your own LLM, chatbot, or scripted content.
• Deliver speech with TTS and real-time lip sync.
• Launch through iframe, Web Component, or JavaScript SDK.

Not Just an AI Avatar Generator

Most AI avatar tools are built for creating videos. Avatar AI SDK is built for teams that need an avatar inside a live website, product page, learning flow, or app WebView.

Drop in the JavaScript SDK

Each project has its own API key; embed URLs and domain allowlists are configured in the console. Minimal interactive avatar SDK example below — replace the placeholder values with your own.

<!-- 1. Load the SDK -->
<script type="module" src="https://embed.avataraisdk.com/sdk.js"></script>

<!-- 2. Initialize (copy apiKey from the console) -->
<script type="module">
  const widget = AIAvatar.init({
    agentId: 'YOUR_AGENT_ID',
    apiKey: 'YOUR_API_KEY',
    behavior: { llmMode: 'external' },

    // Route A: your LLM returns text, we do TTS + lip-sync
    onUserInput: async (msg) => {
      const reply = await myCustomerLLM(msg.content);
      widget.replyText(reply);
    },
  });
</script>

Web Component and JS SDK setup—see documentation.

Frequently asked

The questions we hear most often about the interactive avatar, the free phase, data handling, and supported environments.

• What is an interactive avatar?

  An interactive avatar is a digital character embedded in a website or app that can speak, respond, and guide users through content or conversations. Unlike a pre-rendered video, it reacts to user input in real time and stays inside your existing page.

• How is this different from an AI avatar generator?

  AI avatar generators usually create one-off video files. Avatar AI SDK helps teams embed a live, interactive avatar experience into websites and apps, connected to your own chatbot, LLM, or scripted content.

• Can I connect the avatar to my own chatbot or AI agent?

  Yes. Route user input to your own LLM or chatbot, then send the reply back to the avatar — we handle TTS synthesis and lip sync. You keep ownership of the conversation logic.

• How long will the limited-time free phase last?

  No hard end date yet. We're focused on polishing the product first. When paid plans launch, we'll notify all registered users at least 30 days in advance via the console and website — no surprise cutover.

• Are the avatars, API keys, and usage records from this phase preserved?

  Yes, fully. All projects, look/voice configurations, API keys, and historical usage created during the free phase remain available in the paid version — no need to re-create or migrate.

• What will the paid pricing look like?

  Metered on TTS characters and lip-sync seconds, with monthly plan quotas and top-up packs. We don't plan to charge for console-side actions like creating projects or copying embed snippets. Exact pricing will be announced before launch — no numbers committed right now.

• Are there usage limits during the free phase?

  There are soft per-account fair-use ceilings to prevent abuse and runaway consumption. Typical workloads won't hit them. If you expect a spike (e.g. a campaign day with >5k calls), email us in advance and we'll raise your limit manually.

• Which browsers and environments are supported?

  Latest two major versions of Chrome / Edge / Safari / Firefox on desktop; iOS Safari and Android Chrome on mobile. The embedded 3D avatar requires WebGL 2.0 — very old devices may fall back to a static image.

• Can I install on WordPress, Shopify, Webflow, Wix, or Squarespace?

  Yes. WordPress and Shopify have dedicated integrations (WordPress plugin and Shopify Theme App Extension). For Webflow, Squarespace, Ghost, Wix, or plain static HTML, paste the SDK snippet from the console — 1–3 minutes per platform, no coding required. Step-by-step guides live in the console's integration docs.

• Can I embed it in WeChat official accounts, mini programs, or app WebViews?

  WeChat article bodies don't allow iframes or Web Components, so direct embedding isn't possible there. Mini programs can use web-view pointing to your own domain where the SDK works. App WebViews are supported as long as they allow JavaScript and WebGL.