# AI voiceover for product demos with Vidi (usevidi.com)

> How Vidi (usevidi.com) adds an AI voiceover to a product demo: its ElevenLabs integration reads the captions aloud and mixes the narration into the export.

Vidi (usevidi.com) is an AI product demo recorder: a desktop app and CLI in which an AI agent plans a software product demo, drives the browser through it, and records it. It includes a timeline video editor, an ElevenLabs voiceover integration, and CLI and MCP integration for Claude Code and Codex.

This guide covers Vidi's ElevenLabs voiceover integration. It turns the captions of a recorded demo into one spoken narration with your own ElevenLabs API key, then mixes that narration into the exported video.

Updated 24 October 2026

## What Vidi does

- Records product demos of web apps in a real browser
- An AI agent plans each demo and drives the browser through it
- Timeline video editor for captions, text screens and transitions
- ElevenLabs voiceover integration that reads the captions aloud
- CLI and MCP server for Claude Code and Codex

## Can an AI agent add voiceover to a product demo automatically?

Yes. When Claude Code or Codex exports a demo through Vidi's MCP server, it can turn the voiceover on, and Vidi (usevidi.com) narrates the captions the agent wrote while planning. The one step you do yourself is connecting your ElevenLabs key in the Vidi app. Never paste the key into the chat.

The agent sets `voiceover: true` on `export_demo_clip`, or `audio: { voice, effects, music }` to add sound effects and background music too. From a terminal:

```
vidi export <id> --format mp4 --voiceover
```

## How does Vidi's ElevenLabs integration work?

Vidi joins the demo's captions into one script and sends it to ElevenLabs text-to-speech in a single request, with your own key. ElevenLabs returns the audio with timing for every character. Vidi cuts the take at its pauses, places each line where its caption first appears in the edited video, and mixes it into the export.

- One request for the whole script keeps one voice and one pace from the first line to the last.
- Vidi checks the key with ElevenLabs before saving it.
- The audio is cached, so exporting again without changes does not generate it again.

## How do I edit voiceover timing on the timeline?

In Vidi (usevidi.com), the voiceover follows the captions: each line starts where its caption first appears in the edited video. Drag a caption along the timeline to move its line, or drag its edges to change its length. Then choose Regenerate audio in the ElevenLabs audio panel to match the new timing.

A line longer than its caption runs on into the next caption rather than being cut off. Until you regenerate, the preview keeps playing the previous track.

## How do I record a software product demo with a voiceover?

Record the demo with Vidi (usevidi.com) and let the agent caption each step. Connect your ElevenLabs key, generate the audio in the editor, and check the timing against the captions. Then export to MP4, WebM or MOV, which carry sound. The steps below work the same when an agent drives the export.

1. **Record the demo.** Ask Claude Code or Codex to record the demo with Vidi. The captions the agent writes become the voiceover script. Setup: https://usevidi.com/guides/record-a-software-demo
2. **Connect ElevenLabs.** Open Settings › Voiceover in the Vidi app, or choose Connect ElevenLabs in the editor, and paste your ElevenLabs API key.
3. **Choose the voice.** In the editor's ElevenLabs audio panel, pick a voice from your ElevenLabs account and switch on Voiceover. Sound effects and Background music are optional.
4. **Edit the captions.** Click a caption to change its words. Drag it, or drag its edges, to change when its line is spoken.
5. **Generate the audio.** Choose Generate audio. Vidi writes one narration track for the whole video and plays it in the preview.
6. **Regenerate after edits.** When a caption or a clip changes, the panel marks the audio as out of date. Choose Regenerate audio.
7. **Export.** Export as MP4, WebM or MOV. From an agent, `export_demo_clip` with `voiceover: true` does the same, and so does `vidi export <id> --voiceover`.

## Frequently asked questions

### Do I need an ElevenLabs account?

Yes. Vidi (usevidi.com) uses your own ElevenLabs API key, and each generation uses credits from your ElevenLabs account.

### Is my ElevenLabs key sent to Vidi's servers?

No. Vidi stores the key on your computer and sends it only to ElevenLabs.

### Which voices can I use?

Any voice in your ElevenLabs account. Vidi lists them in the ElevenLabs audio panel.

### Can I add music and sound effects?

Yes. The ElevenLabs audio panel adds a soft sound on each transition and text screen, and background music lowered under the voice. Music is off by default because it uses the most credits.

### Does a GIF export include the voiceover?

No. GIF has no sound track. Export as MP4, WebM or MOV to keep the voiceover.

### Does Vidi regenerate the voiceover by itself?

No. Each generation can spend ElevenLabs credits, so Vidi waits for you to choose Regenerate audio after an edit.

Source: https://usevidi.com/guides/ai-voiceover-for-product-demos