用 AI 制作专业科普视频:remotion-video skill 八格实战

6 阅读12分钟

用 AI 制作专业科普视频:remotion-video skill 八格实战手册 场景故事

周二下午三点,产品经理把一份 40 页的技术方案扔给你:

"这个太难懂了,能不能做成一个 5 分钟的讲解视频?下周客户演示用。"

你打开了剪映……又关上了。你没有素材,没有旁白,更没有时间。

然后你打开了 Claude Code,输入了一行话:

"帮我把这份技术方案做成 5 分钟的科普视频,需要配音和字幕。"

90 分钟后,一个带 AI 克隆配音、动态字幕、数据动画的 MP4 文件出现在你的桌面。

这就是 remotion-video skill 能做的事。

本文所有技巧均来自真实项目实战——用这套工具制作的《马斯克硅基帝国》科普视频,已发布在视频号,可扫码或点击预览效果:

🎬 点击观看实际成品视频

图:深夜的工作站,左侧是代码,右侧是渲染中的视频——这就是 remotion-video skill 的工作方式

八格表单

  1. 什么时候用?(触发时刻)

当你遇到以下任何一种情况,就该用这套工具:

内容类触发

有一篇文章/报告/方案,想变成"能讲给人听"的视频

需要解释一个抽象概念(算法、架构、商业逻辑)

想做一个 LinkedIn/B 站的知识型短视频

效率类触发

没时间/没预算请配音演员和剪辑师

需要批量生产同一模板的系列视频

视频内容经常更新,想要"改文字就能重新渲染"

质量类触发

对自己做的视频"总感觉差点意思"

想要和 Kurzgesagt / 3Blue1Brown 那种讲解风格靠近

一句话判断:只要你有"内容"但缺"视频执行力",这套工具就值得用。

  1. 做出来是什么?给谁?(目标产出)

产出物清单

文件 规格 说明 out/video.mp4 1920×1080,H.264 可直接上传的成品视频 public/audio/ .mp3 32kbps,克隆声音 每个场景的配音音频 public/subtitles.srt 标准字幕格式 自动同步的字幕文件 src/scenes/ .tsx React 组件 可复用、可修改的场景代码

目标受众

内容创作者:做知识科普、行业解读视频

产品/技术人员:做方案讲解、功能演示视频

教育工作者:做课程讲解、概念可视化视频

营销团队:做产品宣传、案例故事视频

不适合的场景:需要真人出镜的 Vlog、需要精细剪辑的综艺片段、时效性极强的新闻速报。

  1. 需要准备什么?(输入清单)

必须有

✅ 内容来源(三选一)   - Markdown 文章(.md 文件)   - PDF 文档   - 一段文字描述(200 字以上) ​ ✅ MiniMax 账号   - MINIMAX_API_KEY   - MINIMAX_VOICE_ID(克隆声音 ID)   - 👉 注册地址:www.minimax.io   - 费用参考:100 字 ≈ ¥0.01,一个 5 分钟视频约 ¥1-3 ​ ✅ 本地环境   - Node.js 18+(npx remotion 需要)   - Python 3.8+(音频生成脚本)   - ffmpeg(brew install ffmpeg)

推荐有

⭐ 豆包/ARK API Key(AI 生成配图,更好看)   - ARK_API_KEY   - 注册:ark.cn-beijing.volces.com ​ ⭐ Pexels API Key(获取免费素材图)   - PEXELS_API_KEY   - 注册:www.pexels.com/api

克隆声音怎么录

录制一段 20-30 秒的音频,注意:

安静的环境,无背景噪音

正常语速,口齿清晰

任何内容都行(读一段文章即可)

上传到 MiniMax Audio → 等待 2-3 分钟 → 复制生成的 voice_id。

  1. 怎么跟 AI 说?(系统提示词配置)

最简触发(推荐新手)

/remotion-video

Claude 会主动问你:主题、时长、内容来源。你只需要回答就好。

带内容触发(推荐效率党)

帮我把这篇文章做成 5 分钟的科普视频:[粘贴文章内容或文件路径] ​ 要求:

  • 风格:教育科普(Kurzgesagt 风格)
  • 时长:5 分钟左右
  • 需要配音和字幕

精准控制触发(推荐有经验的用户)

用 remotion-video skill 制作视频,参数如下: ​ 内容:[文件路径 or 文字描述] 时长:90 秒 风格:Educational(教育科普) 场景数量:6 个场景 配音:是(使用我的克隆声音) 字幕:是 配图:豆包 AI 生成概念图 ​ 特别注意:

  • 每个场景聚焦一个核心概念
  • 开场 15 秒内给出核心结论
  • 数据用动画图表展示

触发后 AI 会做什么

Claude 收到指令后,会自动走完这个流程:

分析内容 → 拆解场景 → 生成脚本 → TTS 配音 → 检测时长 → 编写 React 组件 → 生成字幕 → 预览确认 → 渲染输出 MP4

你只需要在「预览确认」环节看一眼,给个 OK。

图:触发 skill 后,Claude 内部自动执行的 9 步流水线——你只需要在"预览确认"节点介入一次

  1. 具体怎么操作?(步骤拆解)

第一步:环境配置(一次性,5 分钟)

设置环境变量(加入 ~/.zshrc)

export MINIMAX_API_KEY="your_key" export MINIMAX_VOICE_ID="your_voice_id" export ARK_API_KEY="your_ark_key"  # 可选 ​

安装系统依赖

brew install ffmpeg

第二步:触发 Skill(1 分钟)

在 Claude Code 中输入 /remotion-video,或者直接说明需求。

Claude 会询问:

视频主题/内容来源

期望时长

视频风格

第三步:确认脚本(5-10 分钟)

Claude 会生成视频脚本,类似这样:

场景1:开场钩子(0-15 秒)

[画面] 数据图表动画:从 0 增长到 1.25 万亿美元 [旁白] 2026 年 2 月,一笔史无前例的并购震动了科技界... ​

场景2:背景介绍(15-35 秒)

[画面] SpaceX 和 xAI 的 Logo 并排出现,连接线动画 [旁白] SpaceX 和 xAI,一个造火箭,一个造智能...

你需要做的:检查内容准确性,确认场景数量合适,然后说"确认"或提出修改意见。

第四步:等待生成(10-20 分钟)

Claude 自动完成:

TTS 配音生成(每个场景独立 MP3)

音频时长检测(ffprobe 精确到毫秒)

React 场景组件编写

字幕文件生成

你只需要等待,可以去喝杯咖啡。

第五步:启动预览(可选,5 分钟)

cd ~/remotion-projects/your-video npm run dev

浏览器打开 http://localhost:3000

拖动时间轴预览效果

第六步:渲染输出(10-30 分钟)

npx remotion render MyVideo out/video.mp4

渲染时间取决于视频长度。5 分钟视频大约需要 15-25 分钟渲染。

图:用户视角的 6 步操作流程——全程只有"确认脚本"这一个人工节点,其余全自动

  1. 怎么算做完?(验收标准)

最低合格线(必须达到)

out/video.mp4 文件存在,可以正常播放 音频有声音,不是静音 字幕与旁白基本同步(误差 < 0.5 秒) 没有黑屏或白屏超过 2 秒的段落

优秀标准(应该达到)

开场 15 秒内出现核心信息 每个场景只讲一件事,信息不拥挤 画面与旁白内容一致(不打架) 数据有图表动画,不是只说数字 视觉风格统一(颜色、字体一致)

加分项(精品标准)

使用了克隆声音(自然度明显优于预设声音) 图片有 Ken Burns 动效(而非静止图片) 场景过渡有淡入淡出(不生硬切换) 结尾有总结 + 行动号召

快速自查方法:把视频静音看一遍(检查视觉),再只听声音不看画面(检查旁白)。两遍都觉得"讲清楚了",就算合格。

  1. 出错了怎么办?(失败排查)

最常见的 5 个问题

图:左侧红区是最常踩的坑,右侧绿区是对应的正确写法——渲染黑图问题 90% 源自这里

❌ 问题1:音频生成失败,报错 "invalid api key"

原因:使用了错误的 MiniMax API 域名。

❌ 错误(api.minimax.chat 是无效域名)

curl api.minimax.chat/... ​

✅ 正确

国际版:api.minimax.io

国内版:api.minimaxi.com

解决:检查 scripts/generate_audio.py 中的 API URL。

❌ 问题2:视频渲染后图片全是黑色/不显示

原因:使用了 CSS background-image 或 zIndex: -1。

// ❌ 错误:Remotion 渲染时无法等待 CSS 背景图加载

​ // ❌ 错误:zIndex: -1 会让图片渲染到背景层后面   ​ // ✅ 正确:用 Remotion 的 组件,不设 zIndex: -1  

❌ 问题3:字幕和音频不同步

原因:audioConfig.ts 中的帧数是手动输入的,与实际音频长度不符。

解决:重新运行时长检测脚本:

python3 scripts/detect_durations.py

脚本会用 ffprobe 精确检测每个 MP3 的时长

并自动更新 src/audioConfig.ts

❌ 问题4:3D 场景渲染出来是空白

原因:使用了 WebGL 但没有指定 OpenGL 引擎。

✅ 3D 视频渲染必须加 --gl=angle

npx remotion render MyVideo out/video.mp4 --gl=angle

❌ 问题5:渲染速度极慢,一帧要好几秒

可能原因:

图片文件太大(单张超过 1MB)

多个 3D 场景同时渲染导致 WebGL 上下文溢出

每帧都在做重复计算

解决方向:

1. 压缩图片到 300KB 以内

python3 -c " from PIL import Image img = Image.open('public/images/bg.jpg') img.thumbnail((1920, 1080), Image.LANCZOS) img.save('public/images/bg.jpg', quality=82) " ​

2. 增加并发数(适当加速)

npx remotion render MyVideo out/video.mp4 --concurrency=4

遇到问题的通用排查思路

  1. 先检查报错信息(终端输出的最后几行)
  2. 用 npm run dev 在 Studio 里单独检查出问题的场景
  3. 看 public/audio/ 里的 MP3 是否都生成了
  4. 检查 src/audioConfig.ts 里的帧数是否合理(和音频时长对应)
  5. 以后能自动吗?(升级路径)

当前能力(Level 1):半自动化

你提供内容 → Claude 一步步执行 → 你确认脚本 → 自动渲染

适合偶尔制作,质量优先

近期可实现(Level 2):模板化批量生产

如果你经常制作同类视频(比如每周做行业周报视频),可以建立自己的模板库:

把成功项目的场景组件保存为模板

cp src/scenes/DataScene.tsx ~/.claude/skills/remotion-video/templates/ ​

下次告诉 Claude:"用 DataScene 模板,替换数据"

制作时间从 90 分钟压缩到 30 分钟

中期可实现(Level 3):脚本驱动全自动

结合 Claude Code hooks,可以实现:

监听文件夹,新文章自动触发视频制作

fswatch ~/articles/ | xargs -I{} claude "把{}做成视频"

远期方向(Level 4):Agent 流水线

内容源(RSS/爬虫)→ 自动提取 → 脚本生成 → TTS 配音 → 视频渲染 → 自动上传 B 站/YouTube → 发布通知

目前这个方向技术上完全可行,只需要:

一个内容获取脚本(Python)

Claude API 调用(替代手动触发)

平台上传 API(B 站/YouTube 都有)

预计完整实现需要 2-3 天的工程工作。

图:自动化升级路径——当前处于 Level 1,Level 4 的完全 Agent 化在技术上已经可行

Agent 化潜力评估 维度 评分 说明 输入标准化 ★★★★☆ Markdown/文字输入格式固定,易于自动化 执行可预测 ★★★★☆ 7 步流程清晰,失败点已知且可处理 输出可验证 ★★★☆☆ MP4 存在可验证,内容质量需人工判断 错误可恢复 ★★★★☆ 断点续作设计,单步失败不影响其他步骤 成本可控 ★★★★★ 5 分钟视频总成本 < ¥5(TTS + 图片生成) 综合 Agent 化潜力 ★★★★☆ 适合作为 Content Pipeline 的核心节点

结论:当前 70% 的工作已经自动化,剩余 30% 是"脚本确认"这类需要人工判断的环节。如果对质量要求不那么苛刻,完全可以直接去掉这个人工环节,实现全自动。

💡 高手心法

心法一:音频是灵魂,不要省这一步

很多人嫌配置克隆声音麻烦,直接用预设声音。结果视频做出来总感觉是"机器人在讲"。20 分钟配置克隆声音,能让所有后续视频都更专业。这个投入比值非常高。

心法二:脚本比代码更重要

90% 的视频质量差距来自脚本,不是动画。好的脚本特征:

开场 5 秒给出结论(不是铺垫)

每句话 ≤ 25 个字(TTS 断句自然)

用具体数字代替抽象描述

花在脚本上的时间,比花在调代码动画上更值。

心法三:先跑通,再打磨

第一次做视频,不要追求完美。先用最简单的方式跑通全流程(哪怕动画很简陋),确认音画同步、字幕正常之后,再逐步优化每个场景的视觉效果。

很多人在第一个场景上卡太久,结果整个视频没做完。

心法四:图片问题用"侧边面板"逃课

图片背景透明度、遮罩层次总是调不好?有个简单方法:把图片放在画面左侧 40%,文字内容放在右侧 60%。图片 90% 不透明,内容 100% 可见,两者互不干扰。这个布局在大多数情况下比"透明背景"更好看。

心法五:渲染是最后一步,不是验证步骤

不要每改一点代码就跑一次渲染(每次 20 分钟)。正确流程:

改代码 → npm run dev → Studio 里逐帧检查 → 满意了 → 一次渲染

Studio 预览和最终渲染效果 99% 一致。养成"Studio 先确认"的习惯,能节省大量时间。

心法六:保存提示词,建立自己的素材库

每次生成效果好的 AI 图片,把提示词保存下来。建立自己的"提示词库":

~/prompts/ ├── tech-background.txt     # 深蓝科技感背景 ├── data-visualization.txt # 数据可视化风格 └── minimalist-concept.txt # 极简概念图

下次做视频直接复用,图片质量和风格一致性会大幅提升。

remotion-video skill 见知识星球 [AI创世记 ]