导读你是否曾经有过一个很棒的项目想法却因为不会写代码而迟迟不敢开始本文将通过一个真实案例——在 NanaDraw 中集成 MinerU PDF 解析功能带你理解Vibe Coding这种全新的 AI 协作开发方式让你从想法到可演示成果一步步走完全程。 目录什么是 Vibe Coding案例背景介绍第一步先把需求说清楚Spec第二步让 AI 帮你做计划Plan第三步分轮推进开发Build第四步学会用自然语言反馈第五步遇到报错怎么办第六步测试阶段如何借助 AI第七步本地启动与演示第八步用 AI 整理 GitHub 交付总结与建议一、什么是 Vibe Coding很多人第一次听到Vibe Coding会以为就是把需求丢给 AI让它帮我把代码全写完呗❌ 这是误解。✅ 真正的 Vibe Coding 是一种项目协作推进方式角色职责你提出目标、判断结果、持续反馈AI整理思路、生成代码、修改补全、解释报错核心思想你从逐行写代码的人转变为任务定义者 结果判断者 迭代推进者。Vibe Coding 最重要的三个能力会描述问题✂️会拆分任务会给 AI 反馈二、案例背景介绍本文使用的真实案例是在 NanaDraw 中集成 MinerU实现 PDF 文档解析辅助绘图功能。NanaDraw是一个面向科研和论文写作场景的 AI 可编辑图示生成工具可以把论文方法描述、关键词或手绘草图自动转成流程图、机制图和科研插图。 在线体验https://shannon.opendatalab.com/nanadraw/ GitHubhttps://github.com/Shannon4Science/NanaDraw目标功能用户上传 PDF → 系统解析文档内容 → 用户选择关键片段 → 自动生成学术图示三、第一步先把需求说清楚Spec❌ 错误示范 —— 模糊需求希望 NanaDraw 支持上传 PDF并根据论文内容来生成图。这句话方向对但它没有回答PDF 从哪里上传解析结果怎么展示用户怎么选内容选中内容怎么接回绘图流程✅ 正确示范 —— 拆解需求将模糊需求拆分成可执行小目标1. 在 AI 助手区域提供 PDF 上传入口 2. 在设置中配置文档解析 Token 3. 后端调用 MinerU 完成 PDF 解析 4. 解析后展示完整文本 5. 用户可以选择文本片段作为绘图参考 6. 选中内容后继续驱动 NanaDraw 原有生成流程⚠️记住AI 的输出质量直接取决于你的输入质量。Spec 不是开发前的附属工作它本身就是开发的一部分。四、第二步让 AI 帮你做计划Plan为什么不能直接让 AI 写代码一上来就说帮我把这个功能完整实现出来AI 给出的内容往往 范围太大 不切合当前项目 难以检查和落地推荐的提问姿势这是一个已有项目 NanaDraw主要用于学术绘图场景我希望增加 PDF 解析功能。 用户上传 PDF 后系统通过 MinerU 解析文档再让用户从解析文本中选择片段生成图。 请你先不要写代码帮我输出 1. 功能拆分 2. 第一版最小可行方案 3. 实现顺序 4. 风险点 5. 验收标准AI 在 Plan 阶段的价值不是替你做决定而是帮你整理思路让项目从一团乱线变成一张清晰路线图。五、第三步分轮推进开发Build 最常见的错误请把这个功能完整做出来。✅ 正确方式分轮推进第 1 轮先让 AI 读懂项目看清地图当前项目里和这个功能相关的文件有哪些 前端入口可能在哪里 设置项可能在哪一层修改 后端文档解析应该接入哪里第 2 轮只做一个小目标先加 PDF 上传入口只做这一个第 3 轮推进下一步交互展示完整文本 → 支持滚动查看 → 支持选中文本 → 接回生成流程核心思路不是一次让 AI 给你最终答案而是让它一轮一轮把项目推到正确方向。六、第四步学会用自然语言反馈我不会写代码怎么判断 AI 写得对不对答案是你不需要会写但你必须会反馈✅ 以下这些都是非常有效的反馈这个按钮位置不对 解析结果被截断了 我想要完整文本不要摘要 这个按钮不要关闭要改成收起 不要在界面里体现 MinerU 这个名字这些是产品语言而 AI 最擅长的正是把这种自然语言反馈转成具体的实现修改。七、第五步遇到报错怎么办 报错不是失败是下一轮协作的起点把报错信息原样发给 AI并补充请解释这个报错是什么意思 请定位可能是前端还是后端问题 请给出最小修改方案 请修掉这个问题不要影响已有功能 这种方式把 AI 从代码生成器变成了**调试助手**而调试恰恰是项目里最消耗精力的部分。八、第六步测试阶段如何借助 AI测试不只是会写代码的人的事AI 在测试阶段同样能帮上大忙AI 能帮你做的事示例列测试清单哪些是必须成功的路径补测试代码生成对应的单元测试设计手工验收流程前端交互/后端异常分别检查什么参考提问方式这个功能已经完成请帮我列出 - 哪些是必须成功的核心路径 - 哪些是容易出错的边界情况 - 前端交互要重点检查什么 - 后端异常要重点检查什么九、第七步本地启动与演示项目功能做好了但还没跑起来这是初学者最常见的卡点。可以这样问 AI这是一个前后端项目请先不要讲上线流程先告诉我 1. 我在本地要先启动什么 2. 前端和后端分别用什么命令运行 3. 我应该怎样确认功能已经跑通 4. 如果我要录一段一分钟演示操作顺序怎么安排⚠️注意本地演示绝不是附属环节它是项目闭环中的关键一步。一个只存在于代码层面、不能顺畅演示的项目学习价值和展示价值都会大打折扣。十、第八步用 AI 整理 GitHub 交付功能完成后很多人卡在整理成果这一步。让 AI 扮演表达助手请帮我 1. 根据改动生成提交说明commit message 2. 生成适合发往 dev 分支的 PR 标题和描述 3. 整理 README 新增内容 4. 输出一段适合展示项目成果的简介产品经理实践心得用前面几步快速实验出一个 demo调到满意后再提交 PR 到 GitHub/GitLabPR 内容包括代码 feature 变更说明然后由开发统一集成。十一、总结Vibe Coding 完整路径需求 Spec → AI 做 Plan → 分轮 Build → 自然语言反馈 → 报错继续喂给 AI → 测试 → 本地演示 → GitHub 交付给初学者的三个建议① 不要怕自己不会写代码只要你能描述目标、判断结果、提出反馈你就已经可以参与项目推进。② 不要一开始就追求一步到位真正有效的方式是一轮一轮推进一次只解决一个清楚的问题。③ 不要把 AI 当成自动答案机你越会提问、越会反馈、越会判断AI 就越能帮你。 课后思考如果你只对 AI 说帮我做一个 PDF 绘图功能会有什么问题为什么把大任务拆成多轮对话会比一次提完整要求更有效在 Vibe Coding 过程中人最不可替代的能力是什么最后一句话不会写代码并不等于不能做项目关键是学会借助 AI把想法一步步推进成成果。Just Do It如果本文对你有帮助欢迎点赞收藏 也欢迎访问 mineru给项目点个 ⭐ Star