Skip to content
All case studies

Kumohime · Public beta

Real-time talking-AI avatars, embeddable anywhere.

How we turned KumoKodo's cyberpunk-anime mascot into a productized, multi-tenant platform for live talking-AI avatars — a self-hosted Claude brain, a cloned ElevenLabs voice, browser-mic listening, page-awareness, and a three.js/VRM (or inline-SVG) rig that lip-syncs on the spot — all embeddable on any brand's site with a single snippet.

Avg reply
~2s
Avg reply
3D render
three.js/VRM
3D render
Cost / turn
~$0.007
Cost / turn
Rig paths
2D + 3D
Rig paths
Product
Kumohime
Industry
AI Avatars · Conversational
Services
Product + full-stack development
Kumohime — the live talking-AI avatar site
kumohime.ai — the flagship avatar, live in the browser
The challenge

You can't just animate a drawing.

A talking avatar is three separate problems — a brain that decides what to say, a voice that says it, and animation that moves and lip-syncs to arbitrary speech in real time. The animation is the part everyone underestimates: her art is a flat, baked illustration, and a live avatar needs a rig — a puppet built to move — plus all the parts hidden in the original image (mouth visemes, the eye behind the open eye, the face behind the hair).

Why video-gen can't be the avatar

Veo, Sora, and Kling are clip generators — prompt in, a fixed video out. A chatbot says something different every reply, instantly; you can't render a fresh clip per message, and they don't lip-sync to specific words. Perfect for marketing loops, wrong for a live agent.

Why photoreal tools don't fit

Simli, Tavus, HeyGen, and D-ID are tuned for photoreal humans — anime looks wrong and often runs as per-response video. The stylized / mascot / character-IP corner of the live-avatar market was left wide open. That's the wedge Kumohime takes.

Our solution

One owned rig. Cloned voice. Grounded brain.

A multi-tenant platform where every avatar is a rendered character that listens, thinks, speaks, and lip-syncs live — never a canned clip — grounded in its own brand's knowledge.

01

Real-Time Live Conversation

The browser's Web Speech API hears the visitor on-device (audio never uploaded), a self-hosted Claude brain writes the reply, a cloned ElevenLabs voice speaks it, and the character lip-syncs to that audio on the spot via a viseme timeline built from ElevenLabs character timestamps.

02

Two Rigs, One Contract

A 3D path (three.js + GLTFLoader + meshopt rendering a VRM character delivered as GLB, with a Mixamo → VRM bone-map retarget baked to animation clips) and a dependency-free 2D inline-SVG path — both drop in behind one vendor-agnostic AvatarHandle contract (speak / stream / emote / stop).

03

Grounded + Page-Aware

Each avatar answers strictly from its brand's own crawled knowledge base, remembers the conversation for follow-ups, and is page-aware — it can answer about whatever the visitor is currently looking at, used per-reply only and never logged.

04

Multi-Tenant by Design

Every avatar resolves per slug, so adding a customer is data and art — not a fork. Brands license the ready-made Kumohime character or commission a custom avatar from their own mascot, logo, or illustration, with AI generating the rig inputs (visemes, expressions, turnarounds).

The key insight

Prompt caching as the retrieval strategy.

Rather than build a RAG pipeline with embeddings and a vector store, Kumohime carries the entire ~70K-token site crawl in a one-hour-cached Claude system-prompt prefix. The whole brand knowledge base rides in context on every turn — no retrieval step, no relevance misses, no stale index. Anthropic prompt caching makes it cheap: a cached turn runs about $0.007 versus ~$0.07 uncached, a roughly 10× saving, and a Vercel cron keeps the function and the cache warm. Measured end to end: ~2.05s average response and ~2.0s time-to-first-speech.

The AI-generated edge

Because the character is itself AI-generated, AI can produce the rig inputs — her visemes, eye states, brow expressions, and turnarounds — with the same character-consistency trick. That automates most of the tedious "redraw the hidden bits" labor that makes hand-drawn mascots expensive to rig.

Technical architecture

Stack and pipeline.

Frontend & rendering

  • Next.js 15 (App Router), React 19, TypeScript
  • three.js + GLTFLoader + meshopt — VRM character as GLB
  • Morph-target visemes scaled by held duration (coarticulation)
  • Inline-SVG 2D rig with code-generated motion
  • One AvatarHandle contract: speak / beginStream / emote / stop

Brain, voice & data

  • Anthropic Claude (Haiku 4.5) brain via a swappable adapter
  • ~70K-token site crawl in a 1-hour-cached prompt prefix (no RAG)
  • ElevenLabs (eleven_flash_v2_5) TTS with timestamp visemes
  • Browser Web Speech API for on-device speech-to-text
  • Neon Postgres via Drizzle — personas, voice IDs, 30-day memory
  • Vercel hosting + cron keep-warm and retention pruning
What it does

Feature pillars.

Listens

On-device browser mic (Web Speech API) — audio never leaves the visitor's machine.

Thinks

Self-hosted Claude brain, answering only from the brand's own crawled knowledge base.

Speaks

A per-avatar cloned ElevenLabs voice, streamed for a fast time-to-first-speech.

Lip-syncs & emotes

Blink, gaze, smile, and gestures driven live off the speech audio — never a fixed clip.

Embeds anywhere

Corner widget, full-page host, or kiosk — a single snippet drops an avatar onto any site.

Remembers

Conversation memory in Neon for follow-ups, with 30-day retention and a privacy policy.

The results

Fast, cheap, and on-brand.

~2.05s
Avg response
~2.0s
Time to first speech
~$0.007
Cost per turn (cached)
30 days
Memory retention

For brands

  • A memorable, on-brand concierge instead of a generic chat bubble
  • Owns the anime / stylized / character-IP wedge photoreal tools miss
  • License the ready-made character or commission your own
  • Grounded in your knowledge base — it answers about your business

For the business

  • A real owned rig, not per-response video — cheap at scale
  • Multi-tenant from day one: a new avatar is data + art, not a fork
  • Dogfooded as the animated face of Aether AI Support
  • AI generates the rig inputs, automating hand-drawn rigging labor
Built with

Technology stack.

Next.js 15React 19TypeScriptthree.jsVRM / GLBAnthropic Claude (Haiku 4.5)Prompt cachingElevenLabsWeb Speech APINeon PostgresDrizzle ORMVercel
Try it live

Want a talking avatar for your brand?

Meet Kumohime on kumohime.ai, or contact us to commission a custom avatar — your character, cloned voice, and knowledge base, embedded on your site.