不再是“写代码”，而是“定义完成”。

最近，VibeCoding（氛围编码/意识流编码） 在程序员圈子里引发了热议。此外，自4月份以来，OpenAI 的 Codex 迎来了史诗级进化，完全坐稳了 AI 开发工具的头把交椅。通过将这两者结合，我们进行了一场实验：跳过传统“设计 $\rightarrow$ 实现 $\rightarrow$ 测试”的繁重流程，纯靠跟 AI“对电波（Vibe）”，以爆表的速度把产品做出来。

今天，我将完整公开使用 VibeCoding 开发媒体处理工具 《MediaSplitter AI》 的全过程记录。从递交 PRD（产品需求文档） 和手绘原型图开始，到编译出内置 AI（Whisper）的桌面应用，Codex 实际上仅用了约 1 小时半就完成了整套应用的开发👍。

1. 项目概述：什么是 MediaSplitter AI？

这是一款为了解决日常痛点而生的工具。很多时候我们懒得打开沉重的视频剪辑软件，只是想“把这段到那段剪出来”，或者“顺便转个文字”。

• 核心功能： 极速视频切片（FFmpeg）、AI 语音转文字（Whisper）、音频提取。
• 技术栈： Tauri (Rust) + SvelteKit + Tailwind CSS。

2. 开发日志：极速时间线

STEP 1: 从 PRD 直接生成 MVP Codex 耗时：8分钟

首先，我把 Markdown 格式的 PRD 和原型图打包扔给了 AI。

AI 仅仅用了 8 分钟，就构建出了一个具备以下功能的 Web 端原型：

• 成果： 专业感十足的暗黑模式 UI、预览播放、利用 FFmpeg 实现的流复制（无须重新编码的极速处理）。
• Vibe 亮点： 面对“先做个能动的出来”这一指令，AI 瞬间就提议了 Node.js 服务端加前端的架构。

STEP 2: 追求 UI/UX 的“丝滑感” Codex 耗时：10分钟

开始调整直接影响用户体验的细节，例如“希望能用按钮打入 Start 和 End 点”、“希望能直观看到选择范围”。

• 新增功能： 时间线上显示时间轴竖线、选定区域高亮。
• 感悟： 在 VibeCoding 中，像“再帮我调得感觉对一点”这种模糊的表达，AI 也能心领神会并转化为代码，这让微调的闭环变得极快。

STEP 3: 基于 Tauri 的桌面化迁移 Codex 耗时：15分钟

将已经完善的 Web 应用，迁移为可在 Mac/Windows 上运行的桌面端应用（Tauri）。

• 技术突破： 将浏览器难以做到的“直接操作本地文件”切换为 Rust 侧的后端处理。甚至连 GitHub Actions 的自动打包配置也一并生成了。

STEP 4: 整合 AI 语音转文字与解决“便携性问题” 人类与 Codex 多次对话：1小时

这是整个过程中戏剧性最高的一幕。起初我们使用的是 Python 版的 Whisper，但分发应用时，用户环境的依赖（必须安装 Python 和各种库）成了一个硬伤。

• 解决方案： AI 建议切换为 whisper.cpp（Rust 绑定）。
• 最终形态： 完美搞定了将 FFmpeg 二进制文件和 Whisper 已训练好的模型直接“内嵌”到应用中的配置。
• 成果： 诞生了一款真正的便携式应用——“解压即用，在任何电脑上都能直接本地跑 AI 语音转文字”。

3. 玩转 VibeCoding 的 3 个秘诀

通过这次开发，我总结了以下几个 AI 驱动开发的窍门：

① 给出扎实的 PRD（需求定义）

AI 不是魔法师。在最开始通过清晰的文档（PRD.md）明确“想做什么”和“目标用户是谁”，AI 输出的精准度（Vibe）就会呈指数级提升。

② 容许“推倒重来”的思维

就像我在中途提出“帮我写个纯 HTML 版看看”一样，在 VibeCoding 中尝试不同架构的成本极低。不要死磕某一个正确答案，而是要站在“统筹者（Orchestrator）”的视角，让 AI 生成多种方案并从中择优。

③ 遇上配置坑？拉着 AI 一起踩

像这次遇到的“Python 环境报错”，通常是程序员最讨厌的环境配置问题。但只要把错误日志原封不动贴上去，AI 就会帮你搞定虚拟环境（venv），或者干脆提供替代方案（比如迁移到 C++ 版本）。

4. 结论：只要有“兴趣”，谁都能玩转 VibeCoding

“不会编程就做不出应用”的时代已经结束了。这次的 MediaSplitter AI，我没有亲手写过一行复杂的 Rust 代码或 FFmpeg 命令，完全是通过与 Codex 的对话完成的。

总作业时间： 95分钟

手写代码： 0行（全部由 Codex 生成和调整）

如果你的电脑桌面里也躺着某个“迟早想把它做出来的点子笔记”，别等了，现在就把那份笔记扔给 Codex 吧。就在那一瞬间，你的 VibeCoding 之旅就已经开始了。

技术栈总结（本次使用）

• Frontend: HTML5, CSS3 (Tailwind), JavaScript
• Backend: Node.js (初期), Rust / Tauri (最终)
• AI: OpenAI Whisper (whisper-rs)
• Engine: FFmpeg (Stream Copy)

作者独白：

一个小时前还在浏览器里跑着的东西，一眨眼就已经变成 Mac 的 .app 文件在桌面上流畅运行了。这种无所不能的掌控感，正是 Codex 的魅力所在。

源代码已开源：https://github.com/perfact-tang/mediaeditor

另外，PRD（产品需求文档）的内容如下。

🛠️ MediaSplitter AI：产品需求文档 PRD

1. 项目概述

• 产品名称： MediaSplitter AI (暂定)
• 产品理念： “裁剪、导出、转录”一步到位。内置 AI（Whisper）与高性能引擎（FFmpeg），完美兼容 Mac/Win 的轻量级媒体处理工具。
• 核心价值： 用几次点击，搞定那些不值得大动干戈打开重型剪辑软件的“片段截取、音频提取、语音转文字”工作。

2. 功能需求

2.1 输入与媒体管理

2.2 剪辑与预览（UI 核心）

• 高性能播放器： 支持 $0.5\times \sim 5.0\times$ 的倍速调节播放。
• 波形显示时间线： 声音振幅可视化，方便用户精准判断裁剪点。
• 片段（Segment）管理： * 允许通过“＋”按钮或快捷键，将当前播放位置标记为分割点。
• 列表化呈现各片段的开始与结束时间，支持单独删除与微调。

2.3 分割与提取逻辑

• 极速分割（Stream Copy）： 不进行重新编码，无损画质，瞬间完成片段裁剪（基于 FFmpeg）。
• 自动检测（选填/高级功能）： * 静音检测： 自动识别无声片段并自动打上裁剪点。
• 场景检测： 自动感知画面转场切换（未来扩展）。

2.4 AI 语音转文字 Transcription

• 引擎： 采用 OpenAI Whisper（优先考虑本地离线运行）。
• 导出： 支持纯文本（.txt）及纯字幕（.srt）格式。
• 语言： 支持日语、中文、韩语、英语以及自动语言识别。

2.5 导出设置 Output

• 批量处理： 1键批量导出列表里的所有选定片段。
• 多功能导出勾选： 针对单个片段，可分别勾选“视频、音频、文本”实现同步独立导出。

3. 界面设计原型

采用手绘图中所展示的直观布局。

4. 技术栈（推荐）

• Framework: Tauri (轻量、高效、完美兼容 Mac/Win)
• Frontend: SvelteKit + Tailwind CSS * Backend (Rust):
• ffmpeg-next: 用于视频和音频的极速裁剪。
• whisper-rs: 用于本地离线 AI 语音转文字。

• Build/Distribution: 通过 GitHub Actions 自动编译输出 .dmg (Mac) 和 .msi (Win) 安装包。

5. 路线图：3 阶段开发步骤

【Phase 1】MVP（最小可行性产品）

“先做出能跑起来的东西”

• 实现视频、音频的加载与播放。
• 支持手动指定片段 $\rightarrow$ 结合 FFmpeg 进行视频无损分割（不重编解码）。
• 确保在 Mac/Win 双端编译成功。

【Phase 2】AI 与高阶功能整合

“全面实现原型图上的所有需求”

• 集成 Whisper 语音转文字功能。
• 实现音频波形的可视化渲染。
• 完成导出勾选框（视频/音频/文字）的联动逻辑。

【Phase 3】打磨至专业级体验

“让工具更好用”

• 加入静音自动检测功能。
• 加入字幕烧录（硬字幕/Hardsub）功能。
• 适配 GPU 加速（大幅提升处理速度）。

📝 给开发者（你）的话

本套整合方案的核心在于兼顾“轻便”与“多功能”。通过使用 Tauri 和 Rust，我们一定能把用户从“为了剪个小视频不得不打开重型剪辑软件”的痛苦中解救出来！