独立开发WebGPU浏览器剪辑工具!我给AI写了一套操作规范,让Agent全自动剪辑自测
雾中见真
2026年07月22日 07:21

现在市面上绝大多数AI剪辑工具,本质都是调用云端接口生成视频,根本不会真实操作编辑器界面。

一旦碰到弹窗、短片段误触、素材上传失败这类前端常见问题,自动化流程直接崩盘,更别说主动找Bug迭代产品。

我一个人完整开发了开源离线AI剪辑项目 Timeline Studio,专门定制了一套专属 Agent Skill 操作规范。

不用复杂脚本,一行命令就能让AI严格按照我制定的规则完整剪辑、自动做回归测试,反向优化编辑器稳定性。

npx skills run edit-timeline-studio

一、市面上AI自动化剪辑的通病

1. 只会调用后台接口,无法操作真实前端UI,处理不了浏览器上传、弹窗拦截场景

2. 没有异常降级逻辑,遇到边界场景直接中断流程

3. AI操作无约束,会私自修改本地配置、误删轨道素材,破坏剪辑工程

简单说:普通AI只是跑固定脚本,我的Skill是让AI拥有和人类一样的实操、排错、复盘能力。

二、自研Skill全套核心规则

这套规则是我项目最大亮点,完整覆盖剪辑全流程约束:

1. 双环境识别:区分开发/线上环境,两套操作逻辑

2. 素材上传容错链路,解决网页文件选择器不稳定问题

3. 弹窗权限管控:禁止AI私自关闭新手引导,不篡改用户本地缓存

4. 时间线精准操作:短片段禁用工具栏删除,强制右键操作防误删

5. 工程真实保存判定:页面自动保存不作数,导出 .timeline 工程才算存档

6. 导出多层校验:自动检查编码、帧数、音频完整性,杜绝损坏成片

三、AI实操真实落地案例

用1080P标准测试视频,AI依靠这套Skill独立完成完整剪辑,解决了普通脚本搞不定的前端交互陷阱:

1. 多层校验稳定导入素材,规避网页上传失败问题

2. 不随意关闭新手引导,完整保留用户初始配置

3. 裁切后的极短片段不会误删主视频轨道

4. 识别浏览器假保存,强制导出工程防止工程丢失

5. 渲染完成后自动校验音视频完整性,保证成片可用

四、独家创新:AI与产品双向迭代闭环

这是和所有同类剪辑工具最大的区别,形成自动化测试闭环:

AI按Skill规则完整剪辑 → 报错完整记录问题类型 → 修复代码/更新Skill规则 → AI复测验证

目前已经沉淀14套完整端到端剪辑测试场景,大量隐藏UI缺陷靠AI提前发现。

五、未来规划:摆脱模拟点击,原生Agent指令层

目前AI是模拟鼠标点击页面操作,后续会重构内核:

1. 轨道、片段分配唯一ID

2. 项目状态完整序列化

3. 事务化、幂等剪辑指令

4. 支持后台无头批量渲染

最终做到:UI只给人操作,AI直接调用编辑器底层指令剪辑。

六、开源项目分享

项目完全开源,海外Reddit发布收获15000+浏览,多语言端侧离线WebGPU剪辑方案受到很多海外开发者认可。

仓库包含全套Skill规则、测试用例、WebGPU渲染源码,感兴趣可以本地部署学习:

GitHub仓库:网页链接​

一个人从零开发前端音视频+AI Agent自动化工具踩了超多坑,如果你对WebGPU、前端自动化测试、AI剪辑感兴趣,欢迎仓库点star一起交流!

你们觉得AI自动化剪辑未来会替代大部分人工剪辑吗?评论区聊聊你的看法~