原始标题: Claude Code Let’s Build: AI Video Editor

发布日期: 2026-01-17 | 来源频道: @AllAboutAI

📝 深度摘要

1. 对话背景与核心主题

本视频为 AllAboutAI 频道的实战演示，由技术博主展示如何利用 Claude Code 从零构建一个半自主式 AI 视频编辑器。核心元问题在于：如何通过自然语言指令让 AI 代理自动完成视频编辑任务，包括视频上传、剪切、合并以及基于语义理解的智能剪辑。博主采用 “Vibe Coding” 范式——通过口头描述需求而非手写代码，实现整个项目的搭建与迭代。

2. 核心干货概览 (Agentic Stack & Assets)

类别 名称 核心用途 / 技术意义
核心 AI 代理 Claude Code 作为主控代理，理解用户需求并驱动整个开发流程，包括代码生成、项目结构规划和迭代修改
视频处理引擎 FFmpeg 开源视频处理工具，负责视频的剪切、合并、格式转换等底层操作
语音转文本模型 Whisper (OpenAI) 本地运行的语音识别模型，将视频音频转录为文字，用于语义理解剪辑
大语言模型 API Gemini 3.5 Flash 负责函数调用（Function Calling），解析用户的自然语言编辑指令并转化为具体的剪辑操作
前端框架 Next.js + JavaScript 构建视频编辑器的 Web UI，提供拖拽上传、时间轴可视化、剪辑预览等交互界面
环境配置 .env 文件 存储 Gemini API Key 等敏感凭证

3. 智能体架构与 SOP (Architecture & Implementation Deep Dive)

环境搭建与初始化

项目目录创建：首先创建项目目录 ai-video-editor，使用 Cursor IDE 打开该目录进行开发。

依赖准备：

  • FFmpeg：从 ffmpeg.org 下载安装，支持 Linux、Windows、Mac OS
  • Whisper 模型：使用 OpenAI 的 Whisper 进行本地音频转录，博主选择 small 模型以平衡准确率与资源消耗
  • Gemini API：访问 Google Gemini 文档页面，获取 gemini-3-flash 模型文档和 Function Calling 文档，保存为 gemini-tree.md 和 function-call.md
  • API Key 配置：在 .env 文件中设置 GEMINI_API_KEY

项目初始化：选择 Vercel Tech Stack（Next.js + JavaScript）作为前端框架，博主认为这套技术栈成熟稳定，适合快速原型开发。

自主运行逻辑链 (The Loop)

Plan Mode 启动：将 Claude Code 切换至 Plan 模式，描述项目需求。Claude Code 会分析需求并生成详细的开发计划，包含以下阶段：

  1. 上传组件：支持文件拖拽上传视频
  2. 视频播放器组件：预览上传的视频
  3. 时间轴组件：可视化展示视频片段，支持点击定位
  4. 剪辑编辑器：支持剪切、删除、拖拽重排视频片段
  5. FFmpeg 集成：后端处理视频的实际剪切与合并
  6. 音频提取：将视频转为 MP3 格式，为转录做准备
  7. Whisper 转录管道：调用本地 Whisper 模型进行语音转文字
  8. AI 剪辑模式：利用 Gemini 模型理解用户指令，自动识别需要保留的视频片段

迭代式开发：Claude Code 在 Plan Mode 下运行约 6 分钟生成完整计划。确认计划后，代理开始执行 npm install 和 npm run dev，启动开发服务器（端口 3001）。

实战案例还原

手动剪辑演示：

  • 演示拖拽上传视频功能成功
  • 点击时间轴定位到特定位置
  • 按 C 键在播放头位置剪切视频
  • 选中片段后按 Delete 删除不需要的内容
  • 剩余片段自动吸附拼接，形成连续视频
  • 导出功能成功生成最终视频文件

AI 智能剪辑演示：

  • 开启 AI Edit 模式
  • 点击 “Start Transcription” 调用 Whisper 将视频音频转录为 74 个文本片段
  • 输入自然语言指令：“Keep only the parts where Claude goes off the rail”（只保留 Claude 失控发狂的片段）
  • Gemini 模型解析指令，识别转录文本中相关的片段
  • 系统自动生成新的时间轴，仅包含符合条件且时长超过 10 秒的片段
  • 导出后的视频仅包含目标内容

第二次测试指令：“Keep only the parts where Claude talks about money”（只保留讨论金钱的片段），同样成功筛选出相关片段并导出。

细节支撑

迭代修正：首次手动剪辑演示中发现 Delete 按钮无法正常工作，博主截图记录问题后返回 Claude Code 反馈，代理自动修复了删除功能，实现选中片段后自动移除并拼接剩余内容。

API 灵活性：博主提到可使用 OpenAI、Anthropic 或 XAI 模型，通过 OpenRouter 配置环境变量即可切换。

4. 核心执行资产 (CLI Commands & Prompts)

指令集还原

# 创建项目目录
mkdir ai-video-editor
cd ai-video-editor

# 使用 Cursor 打开项目（博主使用 Claude Code 内置的 Cursor IDE 集成）

# 安装项目依赖
npm install

# 启动开发服务器
npm run dev

开发服务器访问地址：http://localhost:3001

系统提示词策略

博主向 Claude Code 发送的完整提示词包含以下关键要素：

  • 明确项目目标：构建一个 AI 视频编辑器
  • 指定技术栈：Next.js + JavaScript + FFmpeg
  • 核心功能需求：视频上传、拖拽、剪切、删除、时间轴可视化、AI 语义剪辑
  • Whisper 模型选择：small 或 base
  • UI 要求：简洁时间轴、支持文件拖拽上传

博主的开发风格是将详细需求一次性输入，由 Claude Code 全权负责计划生成与代码实现，实现"说需求即开发"的体验。

5. 开发者进阶洞察 (Vibe Coding 心法与边界)

Vibe Coding 核心心法

博主在视频中践行的是真正的"说比写多"开发范式。整个项目从需求描述到代码实现，完全通过自然语言与 Claude Code 对话完成。博主的核心观点是：“写指令而非写代码”——开发者只需描述想要什么（what），而不是具体怎么实现（how）。这种范式转移将编程行为从"编写代码"转变为"描述需求"，极大降低了技术实现门槛。

博主强调跟随工作流（workflow）的重要性：先让 AI 生成计划，再确认计划，最后观察执行。这种人机协作模式让 AI 处理繁琐的代码细节，人类专注于产品创意与需求定义。

自主性风险预警

潜在风险点：

  • API 成本：Gemini 3.5 Flash 和 Whisper 本地运行均产生费用，需监控使用量
  • 模型理解偏差：AI 剪辑依赖模型对自然语言指令的理解，复杂指令可能产生非预期结果（如博主第一次输入"10 秒以上"时模型误解意图）
  • 自动执行环路：若 AI 代理获得文件系统或执行权限，需设置操作边界防止意外修改

实战陷阱

博主提到的坑点：

  • Delete 按钮功能失效需手动反馈给代理修复
  • Whisper 转录耗时取决于视频长度，需等待处理完成
  • AI 剪辑对指令敏感，模糊指令可能导致筛选结果不符合预期

6. 金句

  • “这基本上就是一个云代码视频，你可以跟随我的工作流，看到使用云代码是如何成功的。”
  • “我们基本上只要动动嘴皮子，说出我们想要什么——只保留谈论金钱的部分——然后就得到了正确的结果。”
  • “所以基本上我们可以通过嘴巴完成所有操作，只需要说出指令，AI 就会帮我们处理。”
  • “我认为这个项目是成功的，我们成功地创建了一个具有简单功能的 AI 视频编辑器。”
  • “希望这能给你一些灵感，让你了解可以用云代码构建什么东西。”

技术验证结论：该 AI 视频编辑器成功实现了手动剪辑（拖拽、剪切、删除、导出）与 AI 智能剪辑（语音转写、语义筛选）两大核心功能。FFmpeg 处理底层视频操作，Whisper 实现音频到文本的转换，Gemini 3.5 Flash 通过函数调用理解自然语言指令并转化为具体的片段选择。整个系统展示了"自然语言驱动开发 + 自然语言驱动执行"的完整智能体工作流。

📺 视频原片

视频ID: dMpaPgLYj_U