elevenlabs-remotion

ElevenLabs 配音生成

使用 ElevenLabs API 为 Remotion 视频生成专业的 AI 配音。

前提条件

• 在 .env.local 中设置 ELEVENLABS_API_KEY

快速开始

# Generate voiceover from text
node .claude/skills/elevenlabs-remotion-skill/generate.js --text "Your text here" --output public/audio/voiceover.mp3

# Generate with narrator style (more natural)
node .claude/skills/elevenlabs-remotion-skill/generate.js --text "Your text" --character narrator --output voiceover.mp3

# Generate scenes with request stitching
node .claude/skills/elevenlabs-remotion-skill/generate.js --scenes remotion/scenes.json --output-dir public/audio/project/

# Regenerate a single scene
node .claude/skills/elevenlabs-remotion-skill/generate.js --scenes scenes.json --scene scene2 --new-text "Updated text"

# List available voices and character presets
node .claude/skills/elevenlabs-remotion-skill/generate.js --list-voices
node .claude/skills/elevenlabs-remotion-skill/generate.js --list-characters

角色预设

使用角色预设，让配音听起来自然一些，而不是照读屏幕上的文字：

角色	描述	最适合用于
literal	完全按照原文朗读	屏幕文字、引言
narrator	专业的故事讲述者，流畅且引人入胜	讲解视频、纪录片
salesperson	热情、有说服力、充满活力	营销、广告
expert	权威、自信、博学	法律内容、教程
conversational	随意、友好、自然	社交媒体、轻松内容
dramatic	强烈、富有情感、令人印象深刻	开场钩子、问题陈述
calm	舒缓、令人安心、温和	建立信任、结尾

# Use narrator style globally
node .claude/skills/elevenlabs-remotion-skill/generate.js --scenes scenes.json --character narrator --output-dir public/audio/

# Or set per-scene in scenes.json
{
  "scenes": [
    { "id": "scene1", "text": "Problem statement", "character": "dramatic" },
    { "id": "scene2", "text": "Solution", "character": "calm" }
  ]
}

使用请求拼接生成分场景配音

使用 ElevenLabs 请求拼接功能，为多个场景生成韵律一致的配音：

scenes.json 格式

{
  "name": "product-demo",
  "voice": "George",
  "character": "narrator",
  "scenes": [
    {
      "id": "scene1",
      "text": "Generic text-to-speech sounds robotic. Your brand deserves better.",
      "duration": 4.5,
      "character": "dramatic"
    },
    {
      "id": "scene2",
      "text": "With voice cloning, you can use your own voice for unlimited content.",
      "duration": 5.5
    },
    {
      "id": "scene3",
      "text": "Record a short sample. Clone it. Create professional voiceovers in minutes.",
      "duration": 6,
      "delay": 0.3
    }
  ]
}

生成所有场景

node .claude/skills/elevenlabs-remotion-skill/generate.js \
  --scenes remotion/product-demo-scenes.json \
  --output-dir public/audio/product-demo/

这会生成：

• product-demo-scene1.mp3 至 sceneN.mp3
• product-demo-combined.mp3（拼接后的所有场景）
• product-demo-info.json（包含时长的元数据）

重新生成单个场景

如果某个场景开始得太早、时序不正确，或需要更换文本：

# Regenerate scene2 with new text
node .claude/skills/elevenlabs-remotion-skill/generate.js \
  --scenes remotion/scenes.json \
  --scene scene2 \
  --new-text "Updated scene 2 text" \
  --output-dir public/audio/project/

# Regenerate scene3 with different character
node .claude/skills/elevenlabs-remotion-skill/generate.js \
  --scenes remotion/scenes.json \
  --scene scene3 \
  --character salesperson \
  --output-dir public/audio/project/

# Just regenerate (same text, same character)
node .claude/skills/elevenlabs-remotion-skill/generate.js \
  --scenes remotion/scenes.json \
  --scene scene1 \
  --output-dir public/audio/project/

# Embed a thumbnail into an MP4 video
node .claude/skills/elevenlabs-remotion-skill/generate.js \
  --embed-thumbnail public/videos/my-video.mp4 \
  --thumbnail public/videos/my-thumbnail.png \
  --output public/videos/my-video-with-thumb.mp4

该工具会自动：

• 使用前面场景的请求拼接，以保持韵律一致
• 使用新的元数据更新 info.json 文件
• 如果提供了 --new-text，则更新 scenes.json

嵌入缩略图

将缩略图嵌入 MP4 视频，让 Twitter、YouTube 等平台和视频播放器显示自定义缩略图，而不是首帧。

将缩略图嵌入视频

# Basic usage - outputs to video-thumb.mp4
node .claude/skills/elevenlabs-remotion-skill/generate.js \
  --embed-thumbnail public/videos/promo.mp4 \
  --thumbnail public/videos/thumbnail.png

# Custom output path
node .claude/skills/elevenlabs-remotion-skill/generate.js \
  --embed-thumbnail public/videos/promo.mp4 \
  --thumbnail public/videos/thumbnail.png \
  --output public/videos/promo-final.mp4

Remotion 工作流

# 1. Render your video
npx remotion render MyVideo public/videos/my-video.mp4

# 2. Render your thumbnail (use Still composition)
npx remotion still MyVideoThumbnail public/videos/my-thumbnail.png

# 3. Embed the thumbnail
node .claude/skills/elevenlabs-remotion-skill/generate.js \
  --embed-thumbnail public/videos/my-video.mp4 \
  --thumbnail public/videos/my-thumbnail.png \
  --output public/videos/my-video-final.mp4

支持的格式

• 视频：MP4 (H.264/H.265)
• 缩略图：PNG、JPG、JPEG

嵌入操作会使用 ffmpeg 的 -disposition:v:1 attached_pic 标志，将缩略图设为附加图片，大多数视频播放器和平台都能识别这种格式。

时序验证

该技能会在生成后使用 ffprobe 自动验证时序：

检查内容

检查项	阈值	描述
时长不匹配	>15%	如果实际时长与预期时长不同，则发出警告
开头静音	>200ms	音频开始较晚（配音延迟）
结尾静音	>500ms	结尾存在不必要的静音
语速	2-4.5 wps	最佳值约为每秒 3 个词

验证现有音频

# Validate all scenes in a project
node .claude/skills/elevenlabs-remotion-skill/generate.js --validate public/audio/product-demo/

输出示例：

🔍 Validating product-demo (6 scenes)

❌ scene1: 3.00s (expected: 4.5s)
   ❌ Audio 1.50s shorter than expected
   👍 8 words @ 3.1 words/sec
⚠️ scene2: 6.35s (expected: 5.5s)
   ⚠️ Leading silence: 235ms (may start late)
   🐢 10 words @ 1.8 words/sec
✅ scene4: 4.36s (expected: 4s)
   👍 9 words @ 2.3 words/sec

📊 Total duration: 30.80s (expected: 30.00s)

更新后的 info.json

验证后，info.json 会包含实际测量值：

{
  "scenes": [
    {
      "id": "scene1",
      "duration": 4.5,
      "actualDuration": 3.0,
      "leadingSilence": 0.05,
      "wordsPerSecond": 3.1
    }
  ]
}

在 Remotion 合成中使用 actualDuration，实现精确同步。

选项

选项	描述	默认值
--text、-t	要转换为语音的文本	必需（或使用 --file/--scenes）
--file、-f	从文件读取文本	-
--output、-o	输出文件路径	output.mp3
--output-dir	场景输出目录	public/audio
--voice、-v	声音名称或 ID	George
--model、-m	模型 ID	eleven_multilingual_v2
--character、-c	角色预设	literal
--scenes	包含场景的 JSON 文件	-
--scene	要重新生成的单个场景 ID	-
--new-text	重新生成场景时使用的新文本	-
--validate	验证现有音频目录	-
--skip-validation	跳过自动验证	false
--embed-thumbnail	要嵌入缩略图的视频文件	-
--thumbnail	缩略图文件（PNG/JPG）	-
--stability	声音稳定性（0-1）	因角色而异
--similarity	声音相似度（0-1）	因角色而异
--style	风格夸张度（0-1）	因角色而异
--no-combined	跳过合并文件	false

推荐的声音

声音	风格	适用场景
George	温暖、引人入胜的英式风格	旁白、讲解视频
Antoni	专业、温暖	法律内容、教程
Arnold	权威、深沉	企业内容、严肃话题
Josh	友好、自然随和	营销、轻松内容

与 Remotion 集成

生成场景配音后，可在合成中使用：

import { Audio, Sequence, staticFile } from "remotion";

// Use individual scene audio files for precise sync
const SCENE_DURATIONS = {
  scene1: 4.5,  // From info.json
  scene2: 5.5,
  scene3: 8.0,
};

export const VideoWithVoiceover: React.FC = () => {
  const { fps } = useVideoConfig();

  const scene1Frames = Math.round(SCENE_DURATIONS.scene1 * fps);
  const scene2Frames = Math.round(SCENE_DURATIONS.scene2 * fps);

  return (
    <>
      <Sequence from={0} durationInFrames={scene1Frames}>
        <Audio src={staticFile("audio/project/project-scene1.mp3")} />
        <Scene1Visual />
      </Sequence>

      <Sequence from={scene1Frames} durationInFrames={scene2Frames}>
        <Audio src={staticFile("audio/project/project-scene2.mp3")} />
        <Scene2Visual />
      </Sequence>
    </>
  );
};

获得最佳效果的技巧

1. 使用角色预设：不要照着屏幕文字逐字朗读——使用 narrator 或 expert，让表达更自然
2. 标点很重要：用句号表示停顿，用逗号表示短暂停顿
3. 数字：将数字写成单词（例如，写「五百」，而不是「500」），让语音更自然
4. 缩写：写出完整词语（例如，写「二十四小时」，而不是「24h」）
5. 逐个场景处理：不同场景可以使用不同角色（戏剧性的开场、平静的行动号召）
6. 微调：使用 --scene 重新生成单个场景，无需重做所有内容
7. 请求拼接：确保所有场景中的声音保持一致

工作流示例

# 1. Create scenes.json with your script
# 2. Generate all scenes with narrator style
node .claude/skills/elevenlabs-remotion-skill/generate.js \
  --scenes remotion/my-video-scenes.json \
  --character narrator \
  --output-dir public/audio/my-video/

# 3. Preview in Remotion, notice scene2 starts too early
# 4. Regenerate just scene2 with updated text
node .claude/skills/elevenlabs-remotion-skill/generate.js \
  --scenes remotion/my-video-scenes.json \
  --scene scene2 \
  --new-text "Slightly longer text to fill the visual timing" \
  --output-dir public/audio/my-video/

# 5. Update video composition with new duration from info.json
# 6. Repeat until timing is perfect