分享一套最低成本完整可用的Vibe coding流程

在互联网和编程领域，效率和创新是关键。下面将分享一套低成本且完整的Vibe coding流程，帮助开发者提高工作效率和代码质量。

需求阶段：使用Gemini工具进行需求沟通，确保需求清晰，通过CDR（需求确认报告）和PDR（项目需求文档）来规范流程。

前端设计：前端设计可以采用以下三种思路：

1. 使用Nanoorbanana直接生成设计稿，再通过FigmaMCP工具将设计稿转换为代码。推荐使用一套高质量的提示词，以提高设计稿的准确性和效率。
2. 寻找对标网站截图，利用FrontendDesignSkill指导Claude生成代码，这样可以显著降低代码的通用模板感，使设计更具个性化和创新性。
3. 使用pixso、Google Stitch等原型图一键生成器，快速生成原型图，提高开发效率。

开发流程：

1. 框架设计：首先使用Claude 4.6o或Gemini 3pro的Plan模式来梳理整体架构，然后交给Codex来补充细节。
2. 项目基础架构：回到Claude生成项目的基础架构，在细节填充阶段使用4.6o来跑通基础底座，然后使用AIide的Claude模型来完善细节，最后用Codex来查找并修复bug。
3. 测试阶段：当项目完成到七八成时，开始进行单元测试，进行点对点的验证，然后按照真实用户流程进行集成测试。这两个步骤的侧重点不同，缺少任何一个都可能导致项目失败。

编程工具：目前主要的编程工具包括ClaudeCode（中转站）、Codex（团队共享资源），以及Cursor、Antigravity、Kiro等辅助工具。这些工具都是基于开源项目，可以免费使用，非常适合个人或团队的开发需求。

通过这套Vibe coding流程，开发者可以更高效地完成项目，同时保证代码的质量和创新性。