메뉴
从音频文件自动生成竖屏短视频。使用 Whisper 语音识别提取字幕时间轴，AI 分析内容结构规划场景，Remotion 渲染带动画的视频。 当用户提到以下场景时触发：音频转视频、语音生成视频、把录音/播客/音频做成短视频、Whisper+Remotion、给音频配画面、音频可视化视频、 自动生成字幕视频、批量制作短视频、根据音频内容生成动画。即使用户只是说"把这段音频做成视频"也应该触发。
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
| name | audio-to-video |
| description | 从音频文件自动生成竖屏短视频。使用 Whisper 语音识别提取字幕时间轴，AI 分析内容结构规划场景，Remotion 渲染带动画的视频。 当用户提到以下场景时触发：音频转视频、语音生成视频、把录音/播客/音频做成短视频、Whisper+Remotion、给音频配画面、音频可视化视频、 自动生成字幕视频、批量制作短视频、根据音频内容生成动画。即使用户只是说"把这段音频做成视频"也应该触发。 |
将一段音频文件转化为带动画、字幕、场景切换的竖屏短视频(1080×1920)。整个流程自动化：语音识别 → 内容分析 → 场景设计 → 动画开发 → 视频渲染。
检查必要工具是否安装，然后用 Whisper 转录音频：
# 检查 ffmpeg
which ffmpeg || brew install ffmpeg
# 检查 whisper
python3 -c "import whisper" 2>/dev/null || pip3 install openai-whisper
转录代码（保存为临时脚本执行）：
import whisper, json
model = whisper.load_model("base")
result = model.transcribe("音频路径", language="zh", word_timestamps=True, verbose=False)
segments = []
for seg in result["segments"]:
segments.append({
"id": seg["id"],
"start": round(seg["start"], 2),
"end": round(seg["end"], 2),
"text": seg["text"].strip()
})
with open("/tmp/whisper_result.json", "w", encoding="utf-8") as f:
json.dump({"text": result["text"], "segments": segments}, f, ensure_ascii=False, indent=2)
拿到 Whisper 转录结果后：
输出为结构化数据 src/data/subtitles.ts，格式参见 references/subtitles-template.ts。
在工作目录中初始化项目：
# package.json（name 不能含中文）
cat > package.json << 'EOF'
{
"name": "remotion-video",
"version": "1.0.0",
"private": true,
"scripts": {
"start": "npx remotion studio",
"render": "npx remotion render src/index.ts MainVideo out/video.mp4"
}
}
EOF
npm install remotion @remotion/cli @remotion/player react react-dom typescript @types/react @types/react-dom
mkdir -p src/components src/data public out
cp 用户音频路径 public/audio.mp3
创建 tsconfig.json、src/index.ts、src/Root.tsx，格式参见 references/project-template.md。
为每个场景创建独立 React 组件。每个场景组件应该：
useCurrentFrame() 和 spring()/interpolate() 做动画常见场景类型和视觉设计模式参见 references/scene-patterns.md。
字幕组件固定在底部（bottom: 140px），功能：
实现参见 references/subtitle-template.tsx。
MainVideo.tsx 负责把所有部分组装：
<Audio> 组件播放音频<Sequence> 按时间轴排列实现参见 references/main-template.md。
# 预览
npx remotion studio src/index.ts
# 渲染关键帧检查
npx remotion still src/index.ts MainVideo /tmp/preview.png --frame=100
# 最终渲染
npx remotion render src/index.ts MainVideo out/video.mp4 --codec h264
渲染后用 open out/video.mp4 播放检查。
这套设计语言借鉴 Trae (trae.cn) 的极简科技风格，核心原则是单一强调色 + 高对比度。
| 角色 | 色值 | 用途 |
|---|---|---|
| 背景 | #0D0D0D | 全局背景，纯黑 |
| 主强调色 | #00D47E | 高亮、编号、分隔线、进度条、字幕关键词——唯一的彩色 |
| 警告色 | #FF4D4D | 仅在负面/警告语义时使用（如骗局、淘汰） |
| 标题 | #FFFFFF | 场景标题、核心文字 |
| 正文 | #A0A0A0 | 副标题、说明文字 |
| 弱化 | #666666 | 辅助信息、次要标签 |
| 卡片背景 | #1A1A1A | 所有卡片、容器 |
| 卡片边框 | rgba(255,255,255,0.08) | 细微边框 |
[01] [02] 等宽字体(monospace)，绿色 40pxpaddingBottom: 180px 给字幕空间spring({ damping: 12, stiffness: 120 })interpolate(frame % N, ...)package.json 的 name 字段不能包含中文，否则 npm init 会报错fps × 秒数