Use when user provides a topic and wants an automated video podcast created - handles research, script writing, TTS audio synthesis, Remotion video creation, and final MP4 output with background music
REQUIRED: Load Remotion Best Practices First
This skill depends on
remotion-best-practices(official Remotion best practices). You MUST invoke it before proceeding:Skill tool: skill="remotion-best-practices"
打开 Claude Code,直接说:"帮我制作一个关于 [你的主题] 的 B站视频播客"
Claude behavior: 每次 skill 被调用时,自动检查是否有新版本:
git -C ~/.claude/skills/video-podcast-maker fetch --quiet 2>/dev/null
LOCAL=$(git -C ~/.claude/skills/video-podcast-maker rev-parse HEAD 2>/dev/null)
REMOTE=$(git -C ~/.claude/skills/video-podcast-maker rev-parse origin/main 2>/dev/null)
if [ -n "$LOCAL" ] && [ -n "$REMOTE" ] && [ "$LOCAL" != "$REMOTE" ]; then
echo "UPDATE_AVAILABLE"
else
echo "UP_TO_DATE"
fi
git -C ~/.claude/skills/video-podcast-maker pull| 工具 | 检查命令 | 安装 (macOS) |
|---|---|---|
| Node.js 18+ | node -v | brew install node |
| Python 3.8+ | python3 --version | brew install python3 |
| FFmpeg | ffmpeg -version | brew install ffmpeg |
# Azure Speech (必需) - 添加到 ~/.zshrc
export AZURE_SPEECH_KEY="your-azure-speech-key"
export AZURE_SPEECH_REGION="eastasia"
# 验证
echo $AZURE_SPEECH_KEY # 应显示你的密钥
获取方式:Azure 门户 → 创建"语音服务"资源
pip install azure-cognitiveservices-speech requests
# 创建 Remotion 项目(如已有则跳过)
npx create-video@latest my-video-project
cd my-video-project
npm i # 安装依赖
# 验证
npx remotion studio # 应打开浏览器预览
# 一键检查所有依赖
echo "=== 环境检查 ===" && \
node -v && \
python3 --version && \
ffmpeg -version 2>&1 | head -1 && \
[ -n "$AZURE_SPEECH_KEY" ] && echo "✓ AZURE_SPEECH_KEY 已设置" || echo "✗ AZURE_SPEECH_KEY 未设置"
Automated pipeline to create professional Bilibili (B站) 横屏知识视频 from a topic.
目标平台:B站横屏视频 (16:9)
- 分辨率:3840×2160 (4K) 或 1920×1080 (1080p)
- 风格:简约纯白(默认)
技术栈: Claude + Azure TTS + Remotion + FFmpeg
| 适合 | 不适合 |
|---|---|
| 知识科普视频 | 竖屏短视频 |
| 产品对比评测 | 直播录像 |
| 教程讲解 | 真人出镜 |
| 新闻资讯解读 | Vlog |
| 技术深度分析 | 音乐 MV |
| 参数 | 值 |
|---|---|
| 分辨率 | 3840×2160 (4K) |
| 帧率 | 30 fps |
| 编码 | H.264, 16Mbps |
| 音频 | AAC, 192kbps |
| 时长 | 1-15 分钟 |
以下是视频制作的技术硬约束,其他视觉设计和布局由 Claude 根据内容自由发挥:
| Rule | Requirement |
|---|---|
| 4K Output | 3840×2160, use scale(2) wrapper over 1920×1080 design space |
| Content Width | ≥85% of screen width, no tiny centered boxes |
| Bottom Safe Zone | Bottom 100px reserved for subtitles |
| Audio Sync | All animations driven by timing.json timestamps |
| Thumbnail | Must generate both 16:9 (1920×1080) AND 4:3 (1200×900) |
| Font | PingFang SC / Noto Sans SC for Chinese text |
以下是防止文字过小、布局过空的硬约束(1080p 设计空间):
| Constraint | Minimum |
|---|---|
| Any text | ≥ 18px |
| Hero title | ≥ 72px |
| Section title | ≥ 60px |
| Card / body text | ≥ 24px |
| Section padding | ≥ 40px |
| Card padding | ≥ 24px |
以下尺寸来自已验证的生产视频,作为推荐参考。Claude 可根据内容需要灵活调整,但不得低于上方 Minimums。
| Element | Recommended Size | Weight | When to Use |
|---|---|---|---|
| Hero Title | 72–120px | 800 | Opening section, brand moment |
| Section Title | 72–80px | 700–800 | Each section's main heading |
| Large Emphasis | 40–68px | 600–700 | Key statements, conclusions, quotes |
| Subtitle / Description | 30–40px | 500–600 | Under section titles, subheadings |
| Card Title | 34–38px | 700 | Feature cards, list group headers |
| Body Text | 26–34px | 500–600 | Paragraphs, list items, descriptions |
| Tags / Pills | 20–26px | 600 | Labels, badges, categories |
| Pattern | Recommended |
|---|---|
| Card | borderRadius: 20–28px, padding: 28–44px, subtle border + shadow |
| Section Padding | 40–80px content, 60–100px hero |
| Grid Gap | 20–40px |
| Hero / Impact | Full viewport centered, no excessive whitespace |
| Content Max Width | 800–950px for centered blocks, or full width with padding |
Principle: 这些是经过验证的参考值,不是强制规格。不同视频风格(科技/教育/新闻)可以有不同的视觉表现,只要不低于 Minimums。
project-root/ # Remotion 项目根目录
├── src/remotion/ # Remotion 源码
│ ├── compositions/ # 视频 Composition 定义
│ ├── Root.tsx # Remotion 入口
│ └── index.ts # 导出
│
├── public/media/{video-name}/ # 素材目录 (Remotion staticFile() 可访问)
│ ├── {section}_{index}.{ext} # 通用素材
│ ├── {section}_screenshot.png # 网页截图
│ ├── {section}_logo.png # Logo
│ ├── {section}_web_{index}.{ext} # 网络图片
│ └── {section}_ai.png # AI 生成图片
│
├── videos/{video-name}/ # 视频项目资产 (非 Remotion 代码)
│ ├── topic_definition.md # Step 1: 主题定义
│ ├── topic_research.md # Step 2: 研究资料
│ ├── podcast.txt # Step 4: 旁白脚本
│ ├── media_manifest.json # Step 5: 素材清单
│ ├── publish_info.md # Step 6+13: 发布信息
│ ├── podcast_audio.wav # Step 8: TTS 音频
│ ├── podcast_audio.srt # Step 8: 字幕文件
│ ├── timing.json # Step 8: 时间轴
│ ├── thumbnail_*.png # Step 7: 封面
│ ├── output.mp4 # Step 10: Remotion 输出
│ ├── video_with_bgm.mp4 # Step 11: 添加 BGM
│ ├── final_video.mp4 # Step 12: 最终输出
│ └── bgm.mp3 # 背景音乐
│
└── remotion.config.ts # Remotion 配置
⚠️ 重要: Remotion 渲染时必须指定完整输出路径,否则默认输出到
out/:npx remotion render src/remotion/index.ts CompositionId videos/{name}/output.mp4
视频名称 {video-name}: 全小写英文,连字符分隔(如 reference-manager-comparison)
章节名称 {section}: 全小写英文,下划线分隔,与 [SECTION:xxx] 一致
缩略图命名 (⚠️ 16:9 和 4:3 都是必须的,B站不同位置使用不同比例):
| 类型 | 16:9 (播放页横版) | 4:3 (推荐流/动态竖版) |
|---|---|---|
| Remotion | thumbnail_remotion_16x9.png | thumbnail_remotion_4x3.png |
| AI | thumbnail_ai_16x9.png | thumbnail_ai_4x3.png |
# 渲染前
cp videos/{name}/podcast_audio.wav videos/{name}/timing.json public/
[ -f videos/{name}/media_manifest.json ] && cp videos/{name}/media_manifest.json public/
# 渲染后清理
rm -f public/podcast_audio.wav public/timing.json public/media_manifest.json
rm -rf public/media/{name}
在 Step 1 开始时,使用 TaskCreate 按以下列表逐条创建 tasks(不要合并或省略),每步开始时 TaskUpdate 为 in_progress,完成后标记 completed:
1. Define topic direction (brainstorming) → topic_definition.md
2. Research topic → topic_research.md
3. Design video sections (5-7 chapters)
4. Write narration script → podcast.txt
5. Collect media assets → media_manifest.json
6. Generate publish info (Part 1) → publish_info.md
7. Generate thumbnails (16:9 + 4:3) → thumbnail_*.png
8. Generate TTS audio → podcast_audio.wav, timing.json
9. Create Remotion composition + Studio preview
10. Render 4K video → output.mp4
11. Mix background music → video_with_bgm.mp4
12. Add subtitles (optional) → final_video.mp4
13. Complete publish info (Part 2) → chapter timestamps
14. Verify output (resolution, sync, files)
15. Cleanup temp files (optional)
After Step 8 (TTS):
podcast_audio.wav exists and plays correctlytiming.json has all sections with correct timestampspodcast_audio.srt encoding is UTF-8After Step 10 (Render):
output.mp4 resolution is 3840x2160After Step 12 (Final):
final_video.mp4 resolution is 3840x2160使用 brainstorming skill 确认:
保存为 videos/{name}/topic_definition.md
Use WebSearch and WebFetch. Save to videos/{name}/topic_research.md.
Design 5-7 sections:
Before designing, assign each section a density tier based on content volume:
| Tier | Items | Best For |
|---|---|---|
| Impact | 1 | Hook, hero, CTA, brand moment — largest text |
| Standard | 2-3 | Features, comparison, demo |
| Compact | 4-6 | Feature grid, ecosystem |
| Dense | 6+ | Data tables, detailed comparisons — smallest text |
Example section plan with tiers: