Live showcase demos

The marketing site can host live demos that connect to VoiceThere-owned projects — a landing-page voice chat, a showcase catalog, and a shared-world board where visitors spawn objects other visitors can see. Demos use the same browser client and session API as production embeds; visitors never send a forgeable project header.

Try the live demos

  • Showcase catalog — voice agent, shared world, and links to related docs.
  • Home — scroll to Live voice demo or use the floating chat launcher.
  • Shared world — connect and spawn circles on a multiplayer board.

Landing chat

The floating Chat launcher on the home page and showcase routes loads public demo config from GET /api/public/showcase-demos. When voice demo env vars are set, Connect provisions a session with the returned projectId, clientKey, and sessionApiBase — the same pattern as the dashboard project chat panel and embed snippet. Speech and text events appear in the panel log.

When voice env vars are empty, the launcher stays visible and shows Live demo is not configured — CI and local dev stay green without secrets.

Shared world

The shared-world page connects with the world demo target from the same public API. Visitors click Connect, then Spawn to send { "type": "register" } to the agent over the data channel. Object positions sync via binary messages (game-sync protocol).

Stock template: deploy the game-sync agent bundle on the world demo project with shared agent child enabled so in-memory world state is visible across every visitor session. Without shared agent child, each session would see an isolated board.

How demos are configured

Platform runtime env (names only — set in GitHub Environment staging / production, synced to K8s by deploy):

  • SHOWCASE_VOICE_PROJECT_ID + SHOWCASE_VOICE_CLIENT_KEY — landing chat and voice card
  • SHOWCASE_WORLD_PROJECT_ID + SHOWCASE_WORLD_CLIENT_KEY — shared-world board
  • SHOWCASE_SESSION_API_BASE(optional) — overrides the public sessions API base; defaults to the site's normal sessions URL

Each demo is active only when both project id and client key are non-empty. Empty values mean that demo shows unavailable copy — never a crash.

Client key + project

The browser uses the client API key as a Bearer token on startSession. The platform resolves tenant scope from that key — visitors do not send X-Project-Id or pick a project id from the URL. The public API returns the project id that matches the configured client key; the UI passes that id to the client library together with the same key.

Mint a clientAPI key per demo project in the VoiceThere dashboard. Allow browser origins for the marketing hostname on that project's CORS list (dashboard origin is typically already included). Deploy agents before enabling demos:

  • Voice demo — echo or voice-starter template
  • World demo — game-sync with shared agent child enabled

See also Browser client, Agent templates, and Inbound webhooks for related building blocks linked from the showcase catalog.

← All documentation