如何用 Agent Skill 构建一套可编辑、可验证的 AI 视频生产流水线

从一句话需求出发，自动完成素材分析、剪辑规划、字幕配音、时间线修改和结果验证，最后同时交付成片与可编辑工程。

项目地址

1. 效果与案例仓库：建议先看

Timeline Studio Skills Handbook

Handbook 提供了参考视频复刻、产品宣传片、多语言本地化、叙事推广片和知识科普等案例。每个案例尽量包含提示词、结果视频和可编辑 .timeline 工程。

想先看效果、复制案例或理解剪辑决策，可以直接从 Handbook 开始。

2. Timeline Studio 主仓库

MartinDelophy/ai-video-editor

主仓库包含：

• 浏览器 AI 视频编辑器；
• edit-timeline-studio Agent Skill；
• .timeline 工程协议；
• Agent 命令执行器；
• 浏览器本地 AI 模型；
• WebCodecs 导出能力；
• 项目构建和部署配置。

安装 Skill：

npx skills add MartinDelophy/ai-video-editor –skill edit-timeline-studio

前言

现在，人人都可以成为自媒体人。

真正的问题已经不是“能不能拍视频”，而是“能不能持续生产视频”。

一条几十秒的短视频，背后往往包含大量工作：

• 整理原始素材；
• 筛选有效镜头；
• 删除废话和重复内容；
• 设计叙事结构；
• 生成配音；
• 识别并校对字幕；
• 调整字幕和声音时间；
• 添加音乐、画中画和转场；
• 适配横屏和竖屏；
• 检查并导出视频；
• 保存一份以后还能修改的工程。

虽然现在有大量 AI 工具，但大多数只解决其中一个环节。

Timeline Studio Skill 想做的是另一件事：把这些能力组织成一条完整、可编辑、可验证的 AI 视频生产流水线。

一、Timeline Studio Skill 是什么？

Timeline Studio 是一个本地优先、运行在浏览器中的开源 AI 视频编辑器。

edit-timeline-studio 则是建立在编辑器之上的 Agent Skill。

用户不需要逐步描述按钮操作，只需要说出目标，例如：

把这几段产品演示素材剪成一条40秒左右的竖屏宣传片，保留真实操作过程，加入中文配音和字幕，最后输出视频和可编辑工程。

Agent 会在 Skill 的约束下完成：

整个过程可以概括为：

#mermaid-svg-GnJ4afWIeothZdZ1{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-GnJ4afWIeothZdZ1 .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-GnJ4afWIeothZdZ1 .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-GnJ4afWIeothZdZ1 .error-icon{fill:#552222;}#mermaid-svg-GnJ4afWIeothZdZ1 .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-GnJ4afWIeothZdZ1 .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-GnJ4afWIeothZdZ1 .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-GnJ4afWIeothZdZ1 .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-GnJ4afWIeothZdZ1 .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-GnJ4afWIeothZdZ1 .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-GnJ4afWIeothZdZ1 .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-GnJ4afWIeothZdZ1 .marker{fill:#333333;stroke:#333333;}#mermaid-svg-GnJ4afWIeothZdZ1 .marker.cross{stroke:#333333;}#mermaid-svg-GnJ4afWIeothZdZ1 svg{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-GnJ4afWIeothZdZ1 p{margin:0;}#mermaid-svg-GnJ4afWIeothZdZ1 .label{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;color:#333;}#mermaid-svg-GnJ4afWIeothZdZ1 .cluster-label text{fill:#333;}#mermaid-svg-GnJ4afWIeothZdZ1 .cluster-label span{color:#333;}#mermaid-svg-GnJ4afWIeothZdZ1 .cluster-label span p{background-color:transparent;}#mermaid-svg-GnJ4afWIeothZdZ1 .label text,#mermaid-svg-GnJ4afWIeothZdZ1 span{fill:#333;color:#333;}#mermaid-svg-GnJ4afWIeothZdZ1 .node rect,#mermaid-svg-GnJ4afWIeothZdZ1 .node circle,#mermaid-svg-GnJ4afWIeothZdZ1 .node ellipse,#mermaid-svg-GnJ4afWIeothZdZ1 .node polygon,#mermaid-svg-GnJ4afWIeothZdZ1 .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-GnJ4afWIeothZdZ1 .rough-node .label text,#mermaid-svg-GnJ4afWIeothZdZ1 .node .label text,#mermaid-svg-GnJ4afWIeothZdZ1 .image-shape .label,#mermaid-svg-GnJ4afWIeothZdZ1 .icon-shape .label{text-anchor:middle;}#mermaid-svg-GnJ4afWIeothZdZ1 .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-GnJ4afWIeothZdZ1 .rough-node .label,#mermaid-svg-GnJ4afWIeothZdZ1 .node .label,#mermaid-svg-GnJ4afWIeothZdZ1 .image-shape .label,#mermaid-svg-GnJ4afWIeothZdZ1 .icon-shape .label{text-align:center;}#mermaid-svg-GnJ4afWIeothZdZ1 .node.clickable{cursor:pointer;}#mermaid-svg-GnJ4afWIeothZdZ1 .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-GnJ4afWIeothZdZ1 .arrowheadPath{fill:#333333;}#mermaid-svg-GnJ4afWIeothZdZ1 .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-GnJ4afWIeothZdZ1 .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-GnJ4afWIeothZdZ1 .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-GnJ4afWIeothZdZ1 .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-GnJ4afWIeothZdZ1 .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-GnJ4afWIeothZdZ1 .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-GnJ4afWIeothZdZ1 .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-GnJ4afWIeothZdZ1 .cluster text{fill:#333;}#mermaid-svg-GnJ4afWIeothZdZ1 .cluster span{color:#333;}#mermaid-svg-GnJ4afWIeothZdZ1 div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-GnJ4afWIeothZdZ1 .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-GnJ4afWIeothZdZ1 rect.text{fill:none;stroke-width:0;}#mermaid-svg-GnJ4afWIeothZdZ1 .icon-shape,#mermaid-svg-GnJ4afWIeothZdZ1 .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-GnJ4afWIeothZdZ1 .icon-shape p,#mermaid-svg-GnJ4afWIeothZdZ1 .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-GnJ4afWIeothZdZ1 .icon-shape .label rect,#mermaid-svg-GnJ4afWIeothZdZ1 .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-GnJ4afWIeothZdZ1 .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-GnJ4afWIeothZdZ1 .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-GnJ4afWIeothZdZ1 :root{–mermaid-font-family:\”trebuchet ms\”,verdana,arial,sans-serif;}

自然语言需求

素材分析

剪辑决策

编辑计划

时间线执行

AI 配音、字幕与效果

视听验证

MP4 + .timeline

Skill 并不是一段简单的提示词，而是一套完整的任务执行规范。

它既告诉 Agent 应该做什么，也规定了如何验证，以及在什么情况下不能声称任务已经完成。

二、自动剪辑之前，先理解素材

很多所谓的自动剪辑，实际上只是根据静音、时长或者固定模板切割视频。

这种方法对简单口播可能有效，但遇到产品演示、知识科普、剧情内容或参考视频复刻，就容易出现问题。

例如：

• 一段安静画面可能是在展示产品结果；
• 人物停顿可能是刻意设计的节奏；
• 动作最快的镜头不一定是最重要的镜头；
• 字幕内容可能来自原声，不应该重复生成旁白；
• 产品宣传片不能只靠快速转场完成叙事。

Timeline Studio Skill 要求 Agent 在剪辑前先检查素材。

基础信息包括：

• 文件类型；
• 视频时长；
• 分辨率；
• 宽高比；
• 帧率；
• 是否存在音频；
• 音频声道；
• 素材能否正常解码。

根据任务需要，还可以继续分析：

• 代表性视频帧；
• 语音识别结果；
• OCR 文字；
• 镜头变化；
• 主体位置；
• 主体运动；
• 光流变化；
• 音频能量；
• 画面清晰度；
• 人物表情变化。

随后，Agent 会为素材建立“源时间决策记录”。

{
"assetId": "product-demo-01",
"sourceStart": 12.8,
"sourceEnd": 19.4,
"decision": "shorten",
"keepStart": 14.1,
"keepEnd": 18.2,
"reason": "保留完整操作过程，删除操作前的重复说明",
"confidence": 0.92,
"protectSourceAudio": true
}

每一次保留、删除、缩短或重排，都应该有明确原因。

这使自动剪辑从“套规则”升级成了“根据内容做判断”。

三、自然语言如何变成时间线操作？

完成素材分析后，Agent 会生成声明式编辑计划。

它不会直接依赖鼠标坐标去点击界面，而是尽量使用稳定的工程 ID、轨道 ID 和片段 ID 描述修改。

常用命令如下：

npm run agent — project.inspect /absolute/path/project.timeline
npm run agent — project.diff /absolute/path/edit-plan.json
npm run agent — project.run /absolute/path/edit-plan.json

project.inspect

读取工程信息，包括：

• 工程版本；
• 时间线比例；
• 轨道结构；
• 片段顺序；
• 字幕内容；
• 音频关系；
• 归档媒体。

project.diff

在不修改工程的情况下预览变化。

它可以提前发现：

• 片段不存在；
• 时间范围不合法；
• 轨道类型错误；
• 工程版本已经变化；
• 素材缺失；
• 请求的操作尚未被命令层支持。

project.run

当检查通过后，事务性执行编辑计划，并输出新的 .timeline 工程。

一个简化的编辑计划可能是：

{
"version": 1,
"projectRevision": 8,
"operationId": "update-product-intro-v2",
"operations": [
{
"type": "timed.move",
"clipId": "voice-intro",
"start": 2.5
},
{
"type": "caption.update",
"clipId": "caption-intro",
"text": "让重复剪辑交给 AI。",
"start": 2.5,
"end": 5.8
}
]
}

四、为什么需要事务、版本和幂等？

很多 Agent Demo 看起来很智能，但并不适合真实项目。

例如，同一个操作被重复执行两次，可能会插入两份字幕；工程修改到一半失败，可能出现画面已经移动、声音却没有移动的情况。

Timeline Studio 命令层加入了几项重要机制。

1. 工程版本检查

编辑计划基于指定版本生成。

如果用户在计划生成后手动修改了工程，旧计划不会继续覆盖新内容。

2. 前置条件

每个操作可以检查片段是否仍在预期轨道、时间位置是否一致，以及素材是否存在。

3. 事务执行

一个用户意图中的多个修改作为整体执行。

如果关键步骤失败，则停止整组操作，避免留下半成品工程。

4. 幂等操作

计划携带稳定的 operationId。

同一个计划被意外重复提交时，不会再次插入相同素材、语音或字幕。

这些能力看起来更接近数据库和后端系统，但对于可靠的视频自动化同样重要。

五、命令层与浏览器编辑器双路径执行

Timeline Studio 当前采用两条执行路径。

命令路径

适合已经结构化的确定性操作，例如：

• 工程、轨道和片段检查；
• 本地图片、视频和音频导入；
• 素材探测和哈希记录；
• 时间调整；
• 字幕修改；
• 画面拆分和重排；
• Voiceover、Music 和 Visuals 操作；
• 输出新的 .timeline；
• 渲染已经支持的可移植子集。

浏览器编辑路径

适合编辑器中的复杂能力，例如：

• AI 配音；
• 自动字幕；
• 数字人；
• 复杂效果；
• 高级合成；
• 完整预览；
• 最终浏览器导出。

这种设计没有强行把所有功能包装成已经成熟的无头 API。

能够稳定自动化的操作进入命令协议，复杂能力继续通过浏览器执行。任务结束后，再重新检查工程和输出视频。

六、为什么一定要交付 .timeline 工程？

大多数 AI 视频工具只输出一个 MP4 文件。

但 MP4 是不可逆的最终结果。

如果用户想修改一句字幕、替换一个镜头或者调整背景音乐，通常只能重新生成。

Timeline Studio 把 .timeline 作为主要工程格式。

它是一个可移植的项目包，内部包含结构化工程数据和项目媒体：

project.timeline
├── project.json
└── media/
├── visual-001.mp4
├── visual-002.png
├── voice-001.wav
└── music-001.wav

工程可以保存：

• 主画面轨道；
• 画中画和 Overlay；
• 字幕；
• 贴纸；
• 配音；
• 原声；
• 背景音乐；
• 变换、遮罩和滤镜；
• 动画和关键帧；
• 素材与源时间映射；
• 工程比例和轨道状态。

这意味着 Agent 做完初剪后，人类可以继续在可视化时间线中修改。

AI 没有夺走编辑权，而是减少了大量重复劳动。

七、字幕必须对应真实语音

自动视频中一个非常常见的问题是：画面有字幕，但字幕并没有对应的声音。

Timeline Studio Skill 使用了一条明确约束：

如果工程启用了字幕，每一段可见字幕都必须在完整显示时间内对应一段可听见的语音。

如果原视频已经包含人物说话，字幕应该绑定原声，而不是再次叠加 AI 配音。

如果字幕是 Agent 新写的宣传语、解说或旁白，则必须先生成对应语音。

{
"captionId": "caption-result",
"audioClipId": "voice-result",
"start": 18.4,
"end": 22.8,
"text": "一句话，就能生成一份可继续编辑的视频工程。"
}

为了方便后续调整，旁白可以按句保存成多个独立音频文件，而不是一整段不可拆分的长音频。

导出前还会检查：

• 字幕是否绑定音频；
• 音频是否真实可听；
• 字幕是否超出语音时间；
• 是否同时播放原声和重复旁白；
• 不同语句的响度是否一致；
• 左右声道是否发生异常错位。

八、浏览器本地 AI 能力

Timeline Studio 采用本地优先架构。

多项 AI 能力可以在浏览器中通过 WebGPU、ONNX Runtime Web 和 Web Worker 执行，尽量避免把用户素材上传到编辑后端。

当前涉及的能力包括：

• Whisper Small Q8 ONNX 自动字幕；
• 中文 Piper/VITS 配音；
• 英文 Kokoro 配音；
• 多语言浏览器 TTS；
• Stable Audio 3 Small Q4 ONNX 音乐生成；
• YOLOS Tiny 主体检测；
• MODNet 人像抠图；
• MI-GAN 水印与物体移除；
• NanoVSR 图片和视频修复；
• 人声与伴奏分离；
• JoyVASA 与 LivePortrait 数字人生成。

模型按需下载，而不是页面打开后一次性加载全部模型。

下载完成后，模型会进入浏览器缓存，后续生成可以复用。

模型资源可以通过 Hugging Face 和 ModelScope 的自有镜像提供，并固定到明确版本。不同镜像尽量共享同一个缓存身份，避免用户设备保存重复模型。

九、视频如何在浏览器中导出？

播放预览和最终导出是两条不同的媒体路径。

预览主要使用浏览器原生媒体能力，保证播放流畅。

最终导出使用离线合成路径，将时间线逐帧转换为结果视频。

WebCodecs 导出路径可以负责：

• 解码原始视频；
• 按时间线合成主画面；
• 添加画中画；
• 应用画面变换；
• 绘制字幕；
• 混合配音、原声和音乐；
• 编码并生成 MP4 或 WebM。

对于不支持完整 WebCodecs 的环境，还可以提供 MediaRecorder 兼容回退。

真正困难的不是“能够导出文件”，而是保证预览与导出遵循相同的时间和合成规则。

十、怎样判断一条 AI 视频真正完成了？

Timeline Studio Skill 不会把“导出按钮执行成功”当作任务完成。

完整任务需要同时交付：

output/
├── result.mp4
└── result.timeline

然后执行两类验证。

工程验证

• 主画面轨道是否连续；
• 片段顺序是否正确；
• 字幕是否绑定对应语音；
• Overlay 是否位于正确时间；
• 媒体是否已经归档；
• .timeline 能否重新打开；
• 第一帧能否正常预览。

成片验证

• 视频容器是否正确；
• 分辨率和时长是否符合要求；
• 是否可以完整解码；
• 音频轨道是否真实存在；
• 字幕和画中画是否可见；
• 转场边界是否出现停顿；
• 是否发生尾帧重复；
• 是否出现异常静音或声道错位。

只有视频和工程同时通过检查，才算真正完成。

十一、它解决了自媒体人的哪些问题？

十二、当前能力边界

目前，Timeline Studio 的浏览器编辑器已经提供多轨剪辑、AI 字幕、配音、音乐和多种画面处理能力。

命令层已经能够检查和修改 .timeline 工程，并渲染 Visuals、Voiceover 和 Music 等受支持的子集。

字幕渲染、贴纸、复杂 Overlay、部分转场和效果，以及 AI 生成能力，仍可能通过浏览器编辑路径完成。

也就是说，当前架构是：

稳定命令层 + 浏览器兼容层

而不是所有功能都已经成为完全无头的 API。

这种渐进式架构能够保证已经进入命令协议的能力足够可靠，同时不阻塞复杂编辑功能的实际使用。

总结

Timeline Studio Skill 的重点，不是让 Agent 模拟用户点击视频编辑器，而是建立一套面向真实工程的视频生产协议。

这套协议包括：

• 素材检查；
• 多模态分析；
• 剪辑决策记录；
• 声明式时间线命令；
• 工程版本检查；
• 事务和幂等执行；
• 浏览器本地 AI 推理；
• 可移植 .timeline；
• 成片与工程双重验证。

对于自媒体人来说，它减少了素材整理、字幕、配音、时间线操作、多语言制作和成片检查中的重复劳动。

对于开发者来说，它提供了一种新的 Agent 落地方向：Agent 不只调用模型生成内容，还可以成为专业创作软件的工作流执行者。

效果与案例：

Timeline Studio Skills Handbook

代码、安装与部署：

Timeline Studio 主仓库