首页 作品 关于 下载简历

作品 / AI 产品工具链 · 需求到原型

req2proto 需求原型流水线

需求文档写不清、原型排不上、设计稿与前端各说各话 —— 把「一句话想法」到「可点击原型」这条路做成一条流水线:AI 顾问收敛需求,品牌设计语言定风格,最后交付一个能直接点开的单文件 HTML。

我的角色
全栈独立开发(需求 / 架构 / 编码 / 测试 / 文档)
能力域
流程与接口定义 / 原型 DSL 与校验契约 / 全栈独立交付
成果
一句话需求到单文件交互 HTML,六阶段流水线已跑通「展厅预约系统」
localhost:9999/r2p/ · 真实项目(完整样例在线可点)
📱 手机上看桌面版太挤 —— 点这里全屏打开 req2proto >

👆 上面是运行中的真实项目(localhost:9999/r2p/)· 首页的「展厅预约系统」跑完了整条流水线,点开可逐阶段回看 PRD、设计契约、原型与三张架构图,右上角可下载交付物;新建项目需要自备大模型 Key,看现成产物不受影响

01

业务背景

做 AI 产品最容易卡在两处:需求方一句话就想要「能跑的东西」,研发拿到这句话就开工,返工成本全压在联调阶段。req2proto 把这段距离做成一条流水线:输入一句口语化的想法,输出 PRD、设计契约、结构化原型、交互规格、三张架构图,以及一个双击就能点开的单文件 HTML。

02

我的角色

从产品形态到落地全部独立负责:六阶段状态机与接口定义、服务端编排与文件存储、Web 端项目工作台与分阶段确认界面、Prompt 契约与自动重试。仓库里保留跑完整条流水线的真实样例「展厅预约系统」,评审时可以直接点开看真实产物。

03

关键决策

澄清阶段设硬预算:每轮最多 3 问、总轮次上限 5。开放式聊天会把「AI 帮我写需求」变成互相试探;这里改成先给判断(做「下单 + 接单进度」两条链路的轻工具,不是带调度算法的平台),再问三个最能改变方案的问题,答完即出 PRD。示例项目 5 条消息收敛,PRD 明确写了「本期只解决」与「明确不做」两节 —— 砍掉什么,比罗列什么更能防返工。

风格不靠形容词,落到 74 套品牌设计语言与一份设计契约。AI 先按业务气质推荐布局变异度、动效强度、信息密度三个拨盘并说明理由,再从库里选 3–5 套候选;选定后产出设计契约,后续原型、交互规格、HTML 三个阶段都只读这一份,风格漂移在源头就被掐住了。

原型走结构化 DSL,最后一步才合成单文件 HTML。中间产物不是截图也不是自由 HTML,而是带屏幕、层级与坐标的 FRAME 节点树:能逐项校验,能标出 6 屏里哪一屏不合规重跑,也能被交互规格与架构图引用。终态合成自包含 HTML(示例 29KB),脱离服务也能投屏演示,评审完直接发群里。

模型密钥 BYOK,状态就是一份 JSON 文件。接口按请求头透传用户自己的 Key,前端只写 localStorage,服务端日志与文件库里都不出现凭据;没有数据库,六阶段状态机在一台机器上一个 npm start 跑通。

一条流水线,五步到位

STEP 1一句话需求
STEP 2澄清 + PRD
STEP 3风格 + 设计契约
STEP 4原型 + 交互规格
STEP 5交互 HTML + 架构图
6 阶段
澄清 → 风格 → 原型 → 交互 → 架构图 → 单文件 HTML
74 套
逐条拆解过的品牌设计语言,按业务气质选型
1 个文件
29KB 自包含 HTML 双击即演示,可导出 .fig 进 Figma

下一个案例

学校 AI 心理助手

继续阅读 >