Vibe GuideBETA
VIBE CODING ROADMAP

从想法到作品,完整路线图

6 个阶段、18 个节点、31 个动作。进入当前节点,按顺序完成操作、核对结果,再继续下一节点。

沿彩色路线,从想法走到交付。18 个关键节点串起 31 个教学动作,点击节点开始这一段。

阶段 1

把想法说清楚

→
  1. 01

    记录项目想法

    先写给谁用、解决什么问题,再写怎样试用才算做好。

  2. 02

    整理项目描述

    项目描述就是告诉别人:我要做什么,给谁用,怎样使用。

阶段 2

准备协作空间

←
  1. 03

    选择 AI 工具

    这里的 AI 工具需要能帮助你保存文件和运行项目;先确认入口,再开始做。

  2. 04

    创建项目文件夹

    文件夹就是项目文件的存放位置;路径是找到它的地址。

  3. 05

    在工具中打开项目

    同一个工具可以打开不同项目;开始前要检查现在打开的是哪一个。

  4. 06

    准备 Git 与项目规则

    初始化 Git 是建立保存修改历史的地方;提交才是保存一个版本。AGENTS.md 写明工具做事时要遵守什么。

阶段 3

把需求变成计划

→
  1. 07

    澄清需求与第一版范围

    不用一次回答所有问题;问一个,答一个,不知道就说还没决定。

  2. 08

    形成需求与用户故事

    需求文档记录填什么、做什么、应该得到什么结果。

  3. 09

    确认界面与技术方案

    页面草稿也叫原型,可以演示样子和顺序,但里面的保存按钮可能还不能真正保存。

  4. 10

    制定开发计划与测试标准

    任务表告诉你下一项做什么、需要什么、怎样判断做完了。

阶段 4

制作并验证功能

←
  1. 11

    检查环境并初始化项目

    运行环境就是让程序在电脑上运行所需的软件;依赖是项目要用的现成程序包。

  2. 12

    按计划分步开发并测试

    预览是打开正在开发的作品,看看真实页面和功能是什么样。

阶段 5

验收与修复

→
  1. 13

    亲自测试完整使用过程

    验收就是你按照先前约定的方法试用,再决定是否达到了目标。

阶段 6

交付与持续维护

←
  1. 14

    选择交付方式

    交付就是让预期使用者能打开并使用作品,不一定需要公开网址。

  2. 15

    评估上线与交付条件

    这一项是准备检查;还没打开试过的安装包或网站,要留作待测试。

  3. 16

    准备部署脚本或安装包

    安装包、静态网页和需要后端的网站,使用方法不同;让工具按你的项目准备。

  4. 17

    交付上线,检查实际入口

    本机使用检查本机入口;公开网站检查真实网址,两者按自己的选择来。

  5. 18

    记录维护与下一次迭代

    备份是另存一份资料;恢复是用那份资料重新打开并确认能用。

没通过?沿这条路修好再继续

人工验收或上线评估发现问题时:

↶ 回到人工验收 · ↶ 回到上线评估

选择适合项目的交付方式

静态网站可参考 GitHub Pages ↗

交付后仍需检查实际入口,有问题就返回反馈与修复。

Git 与项目规则在第一次改文件前准备;进入节点后,按具体动作顺序操作。

寻找起点

板块快捷入口

大家在做什么 · AI收益调研 · 50个方向 · GitHub项目完整路线图 · 从想法到上线先记下自己的想法只有“想做一个网站”,不知道写什么整理成可以交给 AI 的项目描述不知道第一版的流程怎么写打开一个能制作文件的 AI 工具无法安装、登录,或界面不一样给项目建一个自己的文件夹侧栏没有“文稿”或找不到文件夹让 AI 打开刚才的文件夹AI 说的是另一个项目建立 Git 仓库,写好项目说明和规则提交失败或要求填写姓名邮箱亲手核对 AI 创建的文件找不到上一步的文件一次回答一个问题AI 问的技术词看不懂确认这版只做哪几件事删减以后只剩外观把约定留成看得懂的说明说明太长,不知道该确认哪句把用户怎样使用写清楚AI 只列功能名,没有使用过程先看关键页面,再决定怎么开发原型看起来能用,但不清楚哪些是假数据把实际条件交给 AI 选做法我不知道“本机”和“共享”怎么选让 AI 列出下一小步第一项只有“完成前端”检查运行环境,启动最小项目安装或启动失败,不知道停在哪里打开第一张属于自己的页面地址打不开或一直加载只调整眼前这一页改外观后其他功能也变了让“保存”真正留下内容保存不了,或刷新后记录不见了从开始到结束走通一次按钮能点,但没有结果试试空白和连续点击出现空记录或重复记录关掉以后,还能重新打开第二天地址打不开对照最初想法,确认真的能用AI 说全部完成,但我仍不会用把试用结果记录成反馈问题偶尔出现,不能稳定重现先确定怎么修、怎样算修好AI 没给计划就开始修改按计划修复,再交给本人复测AI 说修好了,同样的操作仍失败先决定:自己用,还是分享发给别人后打不开检查是否具备交付条件评估说可上线,却没有证据准备交付物,并实际试运行安装包打不开或部署后启动失败确认交付,再检查实际入口自己的电脑能开,其他人打不开可选:把简单网页放到 GitHub Pages正式网址显示 404下次继续时,不用从头讲换对话后 AI 要重新做选择工具 · Codex Claude Cursor Qoder TRAE Kimi 价格首页项目分类和 Agent 沟通 · 提示词与排查技术栈选择前端与 UI · 组件词典术语库 · AI与项目开发 · 生活例子与图解打开工具,确认能操作项目把项目、版本记录和 AI 规则准备好把想要的界面风格说清楚只修改一个地方,让 AI 找准目标后端:保存资料与访问规则测试:亲手检查是否能用部署上线:交付一个真实入口运维:让产品继续可用Web 网站与应用 · 把想法变成一个网址。小程序 · 在用户熟悉的地方,做一个小工具。手机 App · 让一个好想法,成为日常习惯。桌面 App · 把重复的电脑工作,交给自己的工具。

一个面向零基础的实践指南

这是面向零基础的双语实践指南,按 6 个阶段、18 个节点、31 个动作组织。页面中的应用画面是示意图;项目完成情况由使用者核对。