video-creator

star 23

创作完整的数字人解说视频。支持剧本生成、IP形象生成、TTS语音、背景音乐、数字人视频、Remotion合成。

Leoyishou By Leoyishou schedule Updated 3/31/2026

name: video-creator description: 创作完整的数字人解说视频。支持剧本生成、IP形象生成、TTS语音、背景音乐、数字人视频、Remotion合成。 allowed-tools: Bash(), Bash(playwright-cli:), Read, Write, Edit, Glob, Grep, WebSearch, WebFetch, AskUserQuestion, Task(nanobanana-draw), Task(volcengine-tts), Task(supabase-upload), Task(digital-human), Task(bgm-search)

数字人解说视频创作工具

创作完整的数字人解说视频,从剧本到最终成片的全流程自动化。

重要原则

  1. 实时数据优先:涉及股价、新闻、时事等内容,必须用 playwright-cli 获取实时数据,不依赖 WebSearch 缓存
  2. 剧本必须用户确认:生成剧本后必须展示给用户确认(含数据来源+获取时间),用户同意后才能继续下一步
  3. 数据真实性:不可编造数据,必须标注数据来源和时间
  4. 字幕与音频同步:必须使用Whisper语音识别获取精确时间戳,不可手动估算
  5. 绿幕背景:IP形象必须使用绿幕背景,便于后期抠图合成
  6. 背景音乐音量:BGM音量控制在解说音量的15-20%,不能盖过解说声音

视频风格规范

画面布局(竖屏 9:16,1080×1920)

┌────────────────────────────────────────┐
│                                        │
│        【内容插图区域】                  │
│         (占画面 50%)                    │
│         宽度与视频一致                   │
│         完整显示不裁剪                   │
│                                        │
├────────────────────────────────────────┤
│                                        │
│        【数字人形象区域】                │
│         (占画面 50%)                    │
│         透明背景叠加在深蓝科技背景上      │
│         带网格线装饰                     │
│                                        │
│    ┌──────────────────────────────┐    │
│    │      字幕文字(白色居中)      │    │ ← 底部字幕
│    └──────────────────────────────┘    │
└────────────────────────────────────────┘

分辨率与编码

参数 规格
分辨率 1080×1920 (竖屏 9:16)
帧率 30fps
编码 H.264
音频 AAC, 44100Hz

字幕样式

  • 位置: 视频底部(bottom: 60px)
  • 对齐: 居中
  • 字体: 白色,36-38px,PingFang SC / Microsoft YaHei
  • 阴影: 黑色阴影增强可读性
  • 同步: 必须与音频精确同步

完整工作流程

Step 1: 了解需求

与用户确认以下信息:

  • 主题方向: 科技解说/产品介绍/知识分享/新闻解读/财经分析
  • 视频时长: 30秒/60秒/90秒(建议不超过90秒)
  • 语言风格: 专业严谨/轻松幽默/通俗易懂

Step 2: 获取实时数据(关键步骤)

⚠️ 重要:如果主题涉及股价、新闻、财经、时事等内容,必须使用 playwright-cli 获取实时数据,不要依赖 WebSearch 的缓存结果!

使用 playwright-cli 获取实时数据

股票/财经数据:

# 打开股票页面获取实时股价
playwright-cli open "https://finance.yahoo.com/quote/HOOD"
playwright-cli snapshot
# 截图保存(可选)
playwright-cli screenshot --filename=stock_data.png

新闻热点:

playwright-cli open "https://news.google.com/search?q=关键词"
playwright-cli snapshot

科技资讯:

playwright-cli open "https://www.theverge.com"
playwright-cli snapshot

通用搜索:

playwright-cli open "https://www.google.com"
playwright-cli snapshot
playwright-cli fill e1 "搜索关键词"
playwright-cli press Enter
playwright-cli snapshot

数据提取要点

  1. 从 snapshot 中提取关键数据(价格、日期、百分比等)
  2. 记录数据获取时间(精确到分钟)
  3. 记录数据来源URL
  4. 将提取的数据整理成结构化信息,供 Step 3 使用

补充搜索(可选)

如需更多背景信息,可补充使用 WebSearch:

WebSearch: "小米股票 2026年 分析师评级 目标价"

Step 3: 生成解说剧本(需用户确认)

基于 Step 2 获取的实时数据生成剧本:

{
  "title": "视频标题",
  "duration_seconds": 60,
  "data_source": {
    "url": "https://finance.yahoo.com/quote/HOOD",
    "fetch_time": "2026-02-05 21:30",
    "key_data": {
      "current_price": "$76.25",
      "day_change": "-3.2%"
    }
  },
  "segments": [
    {
      "id": 1,
      "text": "这段解说词内容...",
      "illustration_prompt": "对应的插图描述"
    }
  ],
  "full_script": "完整的解说词文本..."
}

剧本要求

  • 开头3秒抓住注意力(提问/悬念/痛点)
  • 中间内容逻辑清晰,信息密度适中
  • 结尾有总结或行动号召
  • 数据必须真实准确

⚠️ 必须展示剧本给用户确认,包含以下信息:

剧本已生成,请确认以下内容:

**视频标题**: xxx

**实时数据**(通过 playwright-cli 获取):
- 数据来源: https://finance.yahoo.com/quote/HOOD
- 获取时间: 2026-02-05 21:30
- 当前股价: $76.25
- 今日涨跌: -3.2%

**完整剧本**:
1. xxx
2. xxx
...

⚠️ 股价等实时数据可能已发生变化,请确认是否需要更新。

确认后将开始生成IP形象、语音、插图等素材。

只有用户确认后,才能继续执行后续步骤!

Step 4: 确认/生成IP数字人形象

IP形象有三种获取方式:

方式一:用户直接提供

用户可以直接提供现成的IP形象图片,要求:

  • 绿幕背景(标准绿色 #00B140)
  • 3D卡通风格
  • 正面或3/4侧面
  • 嘴巴微张便于口型同步

方式二:照片 + 文字描述生成

cd .claude/skills/nanobanana-draw
uv run python scripts/nanobanana_draw.py \
  "将这张照片中的人物转换成3D皮克斯风格的卡通形象,保持人物五官特征,穿着米白色连帽卫衣,嘴巴微张便于口型同步,背景使用纯绿色(#00B140)绿幕" \
  --image user_photo.jpg \
  --save-dir output/video-creator/<project-name>

方式三:照片 + 参考图 + 描述生成

cd .claude/skills/nanobanana-draw
uv run python scripts/nanobanana_draw.py \
  "将第一张图片中的人物转换成第二张图片的3D卡通风格,保持人物五官特征和性别,服装参考第二张图片的风格,嘴巴微张便于口型同步,背景使用纯绿色(#00B140)绿幕" \
  --image user_photo.jpg \
  --style-image style_reference.png \
  --save-dir output/video-creator/<project-name>

IP形象关键要求

  • ✅ 背景必须是纯绿色幕布(#00B140)
  • ✅ 嘴巴微张(便于口型同步)
  • ✅ 保持用户五官特征
  • ✅ 分辨率至少 512x512

Step 5: 选择音色并生成TTS语音

先询问用户偏好的音色:

可用音色列表

音色代号 Voice ID 描述
female BV001_streaming 通用女声(成熟稳重)
male BV002_streaming 通用男声(成熟稳重)
yangguang BV056_streaming 阳光男声(年轻活力)
wenrou BV033_streaming 温柔小哥(温和亲切)
ruya BV102_streaming 儒雅青年(知性儒雅)
cd .claude/skills/volcengine-tts
uv run python scripts/tts.py "${full_script}" \
  --voice yangguang \
  --speed 1.1 \
  --output output/video-creator/<project-name>/audio/narration.mp3

Step 6: 搜索并下载背景音乐

使用 bgm-search skill 搜索适合视频氛围的背景音乐:

根据视频主题选择关键词

视频类型 推荐搜索词
财经分析 technology corporate, business ambient
科技解说 electronic futuristic, digital ambient
知识分享 inspiring uplifting, gentle background
新闻解读 news documentary, cinematic ambient
产品介绍 modern corporate, upbeat technology
cd .claude/skills/bgm-search

# 搜索并下载背景音乐(时长匹配视频长度)
uv run python scripts/search.py "technology corporate ambient" \
  --tag music \
  --duration 60-180 \
  --limit 3 \
  --download \
  --output ../../output/video-creator/<project-name>/bgm/

背景音乐选择原则

  • ✅ 时长应≥视频时长(Remotion会自动循环或截断)
  • ✅ 选择无歌词的纯音乐,避免干扰解说
  • ✅ 节奏平稳,不要过于激烈或突变
  • ✅ 注意许可证(CC0 或 CC BY 可商用)

Step 7: 上传素材到Supabase

cd .claude/skills/supabase-upload

# 上传IP形象
IMAGE_URL=$(uv run python scripts/upload.py upload ip_avatar.png --folder video-creator --url-only)

# 上传音频
AUDIO_URL=$(uv run python scripts/upload.py upload narration.mp3 --folder video-creator --url-only)

Step 8: 生成数字人视频

调用火山引擎 OmniHuman1.5 生成数字人说话视频:

cd .claude/skills/digital-human
uv run python scripts/digital_human.py \
  --image-url "$IMAGE_URL" \
  --audio-url "$AUDIO_URL" \
  --vertical \
  --output output/video-creator/<project-name>/digital_human/avatar.mp4 \
  --max-polls 40

关键参数说明

  • --vertical - 生成 9:16 竖屏视频 (1080x1920),避免人物被裁剪
  • 也可用 --width 1080 --height 1920 自定义尺寸

注意

  • 生成时间较长,需要耐心等待
  • 如果超时,使用任务ID继续查询直到完成
  • 使用 --vertical 可确保人物完整显示,不会被裁剪

Step 9: 绿幕抠图(关键步骤)

将绿幕视频替换为深蓝色背景的WebM格式(与Remotion背景色一致):

9.1 检测实际绿幕颜色

重要:火山引擎生成的绿幕颜色可能不是标准的 #00B140,需要先检测:

# 提取第一帧
ffmpeg -i avatar.mp4 -vf "select=eq(n\,0)" -vframes 1 -update 1 frame_sample.png -y

# 采样绿幕区域颜色(左上角)
ffmpeg -i frame_sample.png -vf "crop=1:1:20:20,format=rgb24" -f rawvideo -pix_fmt rgb24 - 2>/dev/null | xxd -p
# 输出示例:0a903e 表示颜色为 #0a903e

9.2 绿幕替换为深蓝色背景

# 获取视频尺寸和时长
VIDEO_SIZE=$(ffprobe -v error -select_streams v:0 -show_entries stream=width,height -of csv=p=0 avatar.mp4)
# 示例输出:1664,1248
DURATION=$(ffprobe -v error -show_entries format=duration -of csv=p=0 avatar.mp4)

ffmpeg -i avatar.mp4 \
  -filter_complex "[0:v]chromakey=0x0a8f3f:0.08:0.05,despill=type=green:mix=0.5[fg];color=c=0x0a1628:s=${VIDEO_SIZE}:d=${DURATION}[bg];[bg][fg]overlay=0:0:shortest=1" \
  -c:v libvpx-vp9 \
  -b:v 2M \
  avatar_transparent.webm -y

关键参数说明

  • chromakey=0x0a8f3f:0.08:0.05 - 抠除绿色背景
    • 0x0a8f3f - 实际检测到的绿幕颜色(火山引擎常用此色)
    • 0.08 - 相似度(越小越精确,减少衣服/肤色污染
    • 0.05 - 混合度(边缘柔和度)
  • despill=type=green:mix=0.5 - 必须添加,去除绿色溢出,防止肤色/衣服变色
  • color=c=0x0a1628 - 创建深蓝色背景(与Remotion背景色一致)
  • overlay=0:0:shortest=1 - 将抠图后的人物叠加到深蓝色背景上

常见绿幕颜色参考

来源 颜色值 推荐参数
火山引擎OmniHuman 0x0a8f3f chromakey=0x0a8f3f:0.08:0.05,despill=type=green:mix=0.5
标准绿幕 0x00B140 chromakey=0x00B140:0.15:0.05,despill=type=green:mix=0.5
纯绿色 0x00FF00 chromakey=green:0.2:0.08,despill=type=green:mix=0.5

⚠️ 注意

  • 不要尝试输出透明WebM(yuva420p),Windows上的VP9编码器不支持alpha通道!
  • 如果衣服/肤色仍有污染,可进一步降低相似度参数(如0.06),但可能在边缘留绿边

Step 10: 生成内容插图

使用手绘图表风格生成插图:

推荐提示词模板

Hand-drawn infographic, sketchnote style, doodle art, whiteboard style.
White background, black ink outlines, loose strokes, minimalist coloring with pastel blue and soft red accents.
Content: [具体内容描述]
Visual metaphors, arrows and diagrams, cute stick figures.
Clean composition, high resolution.
All text must be in Simplified Chinese.

示例

cd .claude/skills/nanobanana-draw

# 场景1:股价下跌
uv run python scripts/nanobanana_draw.py \
  "Hand-drawn infographic, sketchnote style, doodle art. White background, black ink outlines, loose strokes, pastel blue and soft red accents. Content: A stock chart showing dramatic decline with red downward arrow, sad stick figure investor. Chinese text labels. Clean composition. All text in Simplified Chinese." \
  --save-dir output/video-creator/<project-name>/illustrations

Step 11: 使用Whisper获取精确字幕时间戳

必须使用语音识别获取时间戳,不可手动估算

import whisper
import json

model = whisper.load_model('base')
result = model.transcribe('narration.mp3', language='zh', word_timestamps=True)

segments = []
for seg in result['segments']:
    segments.append({
        'startMs': round(seg['start'] * 1000),
        'endMs': round(seg['end'] * 1000),
        'text': seg['text'].strip()
    })

print(json.dumps(segments, ensure_ascii=False, indent=2))

根据识别结果更新Remotion组件中的字幕时间轴。

Step 12: Remotion合成最终视频

12.1 准备素材到public目录

mkdir -p public/<project-name>
cp avatar_transparent.webm public/<project-name>/
cp narration.mp3 public/<project-name>/
cp illustrations/scene_*.jpg public/<project-name>/
cp bgm/*.mp3 public/<project-name>/bgm.mp3  # 背景音乐

12.2 创建/更新Remotion组件

组件布局要点:

  • 上方50%:插图区域,width: 100%, objectFit: contain
  • 下方50%:数字人区域,深蓝科技背景+网格线
  • 底部:字幕居中,白色带阴影
  • 字幕时间轴使用Whisper识别结果
  • 音频:解说音频 + 背景音乐(需控制音量比例)
// 关键样式
// 插图区域
<div style={{ height: "50%", backgroundColor: "#0d1a2d" }}>
  <Img style={{ width: "100%", maxHeight: "100%", objectFit: "contain" }} />
</div>

// 数字人区域
<div style={{
  height: "50%",
  background: "linear-gradient(180deg, #1a2a4a 0%, #0a1628 100%)"
}}>
  <Video src={staticFile("avatar_transparent.webm")} />
</div>

// 字幕
<p style={{
  color: "#ffffff",
  textAlign: "center",
  textShadow: "0 2px 8px rgba(0,0,0,0.8)"
}}>
  {currentSubtitle.text}
</p>

// 音频 - 解说语音(主音量)
<Audio src={staticFile("<project-name>/narration.mp3")} volume={1} />

// 音频 - 背景音乐(15-20%音量,不要盖过解说)
<Audio src={staticFile("<project-name>/bgm.mp3")} volume={0.15} loop />

背景音乐音量控制说明

场景 推荐音量 说明
解说为主 0.10 - 0.15 背景音乐只做氛围,不干扰解说
情感渲染 0.20 - 0.25 需要音乐增强情感时适当提高
片头片尾 0.30 - 0.50 无解说时可提高音乐音量

动态音量控制(可选):

import { interpolate, useCurrentFrame } from "remotion";

// 片头3秒背景音乐渐入
const bgmVolume = interpolate(
  frame,
  [0, 90],  // 0-3秒
  [0, 0.15],
  { extrapolateRight: "clamp" }
);

<Audio src={staticFile("bgm.mp3")} volume={bgmVolume} loop />

12.3 渲染视频

cd project-root
npx remotion render CompositionName output/video-creator/<project-name>/final_video.mp4 --codec=h264

输出目录结构

output/video-creator/<project-name>/
├── script.json                    # 剧本文件
├── ip_avatar.png                  # IP数字人形象(绿幕)
├── audio/
│   └── narration.mp3              # TTS解说音频
├── bgm/
│   └── background.mp3             # 背景音乐
├── illustrations/
│   ├── scene_01.jpg               # 场景插图
│   ├── scene_02.jpg
│   └── ...
├── digital_human/
│   └── avatar.mp4                 # 数字人原始视频(绿幕)
├── public/                        # Remotion素材目录
│   ├── avatar_transparent.webm    # 抠图后的透明视频
│   ├── narration.mp3
│   ├── bgm.mp3                    # 背景音乐
│   └── scene_*.jpg
└── final_video.mp4                # 最终输出视频

常见问题处理

1. 数字人肤色发绿

原因:绿幕抠图时没有添加despill处理

解决:确保ffmpeg命令包含 despill=green 滤镜

ffmpeg -i input.mp4 -vf "chromakey=0x00B140:0.25:0.05,despill=green" ...

2. 字幕与音频不同步

原因:手动估算字幕时间

解决:必须使用Whisper语音识别获取精确时间戳

3. 插图被裁剪

原因:使用了 objectFit: cover

解决:改用 objectFit: contain,配合 width: 100%

4. 数字人生成超时

原因:API处理时间较长

解决:记录task_id,使用单独脚本继续查询直到完成


依赖技能

  • playwright-cli - 浏览器自动化(获取实时数据)
  • nanobanana-draw - AI绘图(支持图片参考和风格迁移)
  • volcengine-tts - 语音合成
  • bgm-search - 背景音乐搜索(基于 Freesound API)
  • supabase-upload - 文件上传
  • digital-human - 数字人视频生成
  • Remotion - 视频合成框架
  • Whisper - 语音识别(用于字幕同步)
Install via CLI
npx skills add https://github.com/Leoyishou/personal-ai-company --skill video-creator
Repository Details
star Stars 23
call_split Forks 7
navigation Branch main
article Path SKILL.md
More from Creator