这个 Skill 帮你和企业员工用自然语言描述业务需求,自动生成可用的网页应用 Demo,用于快速验证业务想法或交付给同事使用。
在 Codex 对话框中,用一句话描述你的业务问题。例如:
我要做一个销售拜访纪要管理工具,销售员输入客户名称、拜访时间、跟进结论,按月份查看,能新建/编辑/删除。
我们公司 HR 经常要做招聘管理,需要发布招聘需求、跟踪候选人进度(简历筛选/HR 面试/业务面试/管理终面/已发 offer)、记录每轮面试评价、统计入职满意度。
我们团队每周开周会、月会、复盘,需要一个会议纪要管理工具,可以写会议笔记,自动整理出每个会议的行动项,按状态(待开始/进行中/已完成)看板跟踪。
Skill 会基于你的描述生成产品文档(类似 PRD),包含:
请你逐项审阅,有不对的地方直接说"修改 XX 部分"。
确认 PRD 后,Skill 会生成单文件 HTML Demo(双击即可在浏览器打开),无需任何安装。
数据保存在浏览器 localStorage,刷新页面不丢失。
重点:这步是双向往返,不是单向交付。
Demo 出来后,你可以:
- 改 PRD 后重生成(场景 A) - 加字段、改功能
- 把对话里说过的新需求合并到 PRD(场景 B) - 让 PRD 持续完善
- 重大改动重生成(场景 C) - 流程推翻时,自动冻结老版本、迁移数据
- 视觉微调(场景 D) - 直接改代码,跳过 PRD
详细的 4 场景规则,读 walkthrough-hr-recruitment.md 看完整演练。
你看到 Demo 后,可以继续提具体改进建议:
加一个搜索框,能按客户名搜
这个状态颜色换一下
增加导出 Excel 功能
改成深色模式
Skill 会基于现有 Demo 迭代,而不是重新生成。
在 outputs 目录下,Skill 已经为你准备了 3 个完整可用的 Demo,作为参照基线:
每个 Demo 都包含:
很多公司有大量"业务专用"的小工具需求(招聘、客户跟进、订单管理、合同审批),用 Excel 管理、用微信群沟通,效率低又没有数据沉淀。你可以用这个 Skill 让员工自己描述需求,10 分钟生成一个原型,自己试用一周,确认有效后再考虑正式开发。
新业务想法要不要做?做个原型跑 2 周,看用户行为,决定要不要投入正式开发。Skill 生成的 Demo 单文件 HTML,可以直接发邮件给同事用,完全够用做早期验证。
在 Codex 培训中,你可以让学员按自己的业务部门(HR、销售、运营、客服)各做一个 Demo,作为实战作业。Skill 本身已经准备好模板,学员只需要专注于业务理解和需求描述。
生成的 Demo 都是单文件 HTML,使用以下技术栈(全部通过 CDN 加载,无需安装):
学员不需要懂任何代码。如果你想看懂实现,所有 HTML 文件都可以在浏览器"查看源代码"看到完整结构。
Q:生成出来的 Demo 可以上线给真实用户用吗?
A:Skill 生成的 Demo 是单文件 HTML + localStorage,适合内部试用和原型验证。给真实用户用需要:后端 API(数据存服务器而不是浏览器)、用户登录鉴权、HTTPS 部署。但作为"业务可行性验证"工具,完全够用。
Q:数据存在哪里?会丢吗?
A:存在你浏览器的 localStorage 里,Key 是 "<产品名>__data_v1"。除非你手动清空浏览器数据,不会丢。每个 Demo 的"设置"页都有"导出数据"按钮,可以把数据导出成 JSON 文件备份。
Q:可以多人协作吗?
A:当前版本是单浏览器版本,不支持多人实时协作。如果需要多人用,可以让每个人在浏览器里独立用,然后定期汇总数据(用"导出数据"按钮)。后续可以考虑做后端版本。
Q:能改成英文界面吗?
A:可以。告诉 Skill "把界面改成英文",它会重写。
Q:怎么部署给团队用?
A:把生成的 index.html 文件发到公司内网(Confluence / 钉钉 / 飞书),或者扔到公司内部静态网站托管(Vercel / Netlify / 阿里云 OSS),同事打开链接就能用。
把上面的"快速开始"流程跑一遍,你会发现真正难的是 Demo 出来之后的反复修改。 我们准备了一份完整演练,模拟一个真实学员(HR 专员小王)用本 Skill 跑 4 个场景的全过程:
walkthrough-hr-recruitment.md - HR 招聘后台,从 0 到 v1.0,完整跑 4 个场景student-checklist.md - 学员作业 checklist,142 项可勾选,边做边填walkthrough 是「老师讲你看」,checklist 是「你自己做」,两份配合用。
checklist 包含:10 节(基本信息 / 阶段一二三 / 场景 ABCD / 最终交付 / 自评打分 / 提交物),142 个可勾选项,每节带「判定标准」「反模式自检」「实地验证」,最后有 100 分制自评 + 常见挂科 10 项。
用法:复制到 outputs/checklist-<产品名>.md,边做边勾,做完后这份文件作为过程文档一并提交给讲师。
建议学习路径:玩 demo(10 分钟)→ 读 walkthrough(15 分钟)→ 拷 checklist 开始自己做。