Coding

klaus_sun

Try it

像搭积木一样组建你的 AI 开发团队。7 位专家角色任意勾选 + 拖拽排序 + 一键执行。PM 写需求、UI 出设计、BE 写后端、FE 写前端、QA 做验收——想用谁就用谁,想怎么排就怎么排。#AI团队

What it does

像搭积木一样组建你的 AI 开发团队。7 位专家角色任意勾选 + 拖拽排序 + 一键执行。PM 写需求、UI 出设计、BE 写后端、FE 写前端、QA 做验收——想用谁就用谁,想怎么排就怎么排。#AI团队

The skill document

Klaus Team — 你的 AI 开发团队,由你说了算

一句话

搭积木式组建 AI 开发团队。从 7 位专家中任意勾选你需要的角色,拖一拖排好顺序,点一下「执行」——剩下的交给 AI。


快速上手(3 步出产品)

第 1 步:打开 WinClaw → 点击顶部「专家团」标签
第 2 步:选择模式 → 输入需求 → 点击「执行流程」
第 3 步:等待 AI 逐个角色执行 → 预览成品 → 下载 ZIP

推荐新手先试这个:切换到「✨ 自定义」→ 点击「快速 Demo」模板 → 输入「做一个待办事项 App」→ 点执行。2 分钟拿到可用的 HTML Demo。


三种使用模式

模式一:👥 专家团(全流程 7 角色)

适合:从零构建完整产品,需要前后端 + 测试全覆盖。

PM → UI → DevOps → BE → FE → 联调 → QA

每个角色完成后自动暂停,你可以检查产出再继续。联调/QA 发现问题可一键触发修复循环(1-3 轮可配)。

模式二:✨ 自定义(任意组合 + 拖拽排序)⭐ 核心特色

适合:快速出 Demo、只做后端、纯前端、代码审查等灵活场景。

操作方式

  1. 从 7 个角色卡片中勾选你需要的角色
  2. 拖拽调整执行顺序(比如 PM 排第一、FE 排最后)
  3. 点击底部「执行流程」按钮

6 个一键模板帮你快速填充:

模板角色组合适合场景
完整项目PM→UI→DevOps→BE→FE→联调→QA从零构建完整产品
快速 DemoPM→FE5 分钟出 HTML 原型
纯后端 APIPM→BE→QA只做接口服务
全栈开发PM→BE→FE→QA前后端 + 测试
设计原型PM→UI→FE侧重视觉还原
代码审查FE→QA审查已有代码

灵活性的价值

  • 只勾选 PM + FE → 跳过 UI/DevOps/BE,直接出 HTML Demo
  • 只勾选 BE + QA → 专注后端接口质量
  • 调整顺序 → 先做后端再做前端,或先设计再规划
  • 每个角色独立对话 → 点击头像单独修改产出,不用重跑整个流程

模式三:🔧 模板工坊

适合:不想选角色,直接执行预置代码工作流。


7 位团队成员

角色核心职责关键交付物
🎯 产品经理需求分析、PRD 输出、接口规范定义PRD 文档、接口规范、验收标准
🎨 UI 设计师视觉设计、交互规范、响应式页面Design Token、组件规范、页面布局
运维工程师环境检测、端口清理、跨平台打包环境就绪报告、启动脚本、打包文件
⚙️ Go 服务端开发纯 Go 开发、RESTful API、Mock 服务Go 服务源码、可执行文件、接口文档
🖥️ Web 前端开发Web/H5 页面开发、AI 交互功能React 源码、HTML 预览页面、交互演示
🔗 联调测试全链路验证、HTML Demo 质量检查联调报告、问题修复清单
✅ 测试验收全维度测试、PRD 验收、最终交付测试用例、Bug 清单、最终成品

实际执行示例

示例 1:快速 Demo(PM + FE)

输入:「做一个 AI 问答工具,支持对话和代码高亮」

PM 产出示例

# AI 问答工具 PRD

## 功能清单
1. 对话输入框 + 发送按钮
2. AI 回复区域(支持 Markdown 渲染)
3. 代码块高亮显示
4. 对话历史记录

## 接口规范
POST /api/chat
请求: { "message": "用户输入" }
响应: { "code": 0, "msg": "success", "data": { "reply": "AI回复" } }

FE 产出示例

✅ React 前端源码(组件化结构)
✅ 可运行 Web 应用(npm run dev 启动)
✅ 独立 HTML Demo(双击即可打开,无依赖)

效果:5 分钟拿到可直接打开的 HTML 原型,无后端也能演示完整交互。

示例 2:完整全栈项目(7 角色全流程)

输入:「做一个英语绘本阅读 App,支持翻页和朗读」

执行流程

  1. PM → 需求分析 + 功能清单 + 接口规范
  2. UI → Design Token + 3 页面布局 + 组件规范
  3. DevOps → 环境检测 + 端口配置 + 启动脚本
  4. Backend → Go API 服务(假数据)+ 可执行文件
  5. Frontend → React 应用 + HTML Demo
  6. Integration → 全链路验证 + 问题修复
  7. QA → 测试验收 → ✅ 可上线

示例 3:纯后端 API(PM + BE + QA)

输入:「做一个用户管理 API,支持 CRUD 和分页」

BE 产出:Go 源码 + 编译好的可执行文件 + 接口文档 QA 产出:接口测试报告 + Bug 清单


核心机制

上下文传递

每个角色只接收上游产出,信息精简不冗余:

PM(起点,接收用户需求)
UI ← PM 的 PRD
DevOps ← PM 的 PRD
Backend ← DevOps 的环境配置
Frontend ← UI 设计 + DevOps 配置 + Backend 接口
Integration ← Frontend 产出 + DevOps 配置
QA ← Integration 的验证报告

独立对话

点击任意角色头像 → 打开独立对话面板 → 多轮对话修改产出 → 应用或应用并重跑下游。

修复循环

联调/QA 发现阻塞 → 点「发给 XX 修复」→ 自动重跑相关角色 → 1-3 轮可配。

疑问检测

AI 输出含「确认/请选择/请决定」等关键词 → 自动暂停 → 弹窗让你选择 → 继续执行。

预览 & 下载

三级回退:实时前端服务 → 静态 HTML Demo → 纯文档预览。支持系统浏览器打开和 ZIP 打包下载。


运行环境

  • WinClaw 已安装运行
  • Go ≥ 1.21(仅后端角色需要)
  • Gateway 服务 正常运行(右下角绿灯)
  • Node.js ≥ 22(WinClaw 内置)
  • Python 3(仅 PPT/Word/Excel 生成需要)

常见问题

Q: 可以只跑部分角色吗? A: 这就是「✨ 自定义」模式的核心功能。勾选你要的角色,拖好顺序,执行即可。比如只选 PM + FE 就能快速出 Demo。

Q: 角色顺序可以随便排吗? A: 可以。不过建议 PM 排第一位(定义需求),FE 排最后(生成预览)。其他顺序自由拖拽。

Q: Gateway 是什么? A: WinClaw 的后端 AI 服务。右下角绿灯 = 正常。意外关闭会自动重启。

Q: 怎么修改某个角色的产出? A: 点击角色头像 → 独立对话面板 → 输入修改意见 → 发送 → 应用到产出。

Q: 预览空白怎么办? A: 点「返回工作流」杀掉旧服务 → 重新点「预览」→ 系统自动启动项目前端服务。

Q: 什么时候不该用专家团? A: 如果你只需要简单对话(比如问一个问题、翻译一段文字),直接用聊天窗口更快捷。专家团适合需要多角色协作的复杂开发任务。

Q: 执行失败了怎么办? A: 1) 检查右下角 Gateway 是否绿灯 2) 点「修复」按钮让 AI 自动重试 3) 手动编辑角色产出后继续 4) 查看文档模式仔细检查各角色输出。


技术约束

  • Go 后端无数据库,纯内存假数据
  • 前端:React 19 + TypeScript + Tailwind CSS 4
  • 统一返回格式:{ code, msg, data }
  • HTML Demo 无外部 CDN 依赖,离线可用
  • 所有输出使用中文

规则

  1. 角色按流水线顺序执行,不跳过(自定义模式除外)
  2. 每个角色只接收上游产出,上下文精简
  3. 每步可暂停检查(自动模式除外)
  4. 修复循环 1-3 轮可配置
  5. AI 有疑问自动暂停等确认
  6. 所有输出必须具体真实,禁止概括描述

产地 WinClaw · 作者 klaus.sun

GitHub · 反馈

Related skills

【AI产品经理超级工作台 / AI PM Super Workbench】—— 面向AI产品经理的全栈智能工作台,覆盖12阶段、60+AI方法论框架、20+AI专业交付物。从模型选型到RAG架构、从Agent设计到安全护栏、从Prompt工程到商业化变现,一个Skill全覆盖。■ 12阶段:AI战略与机会识别→数...

2 installs

Design, audit, and evolve a personalized AI skill stack ("your own gstack") for any user. Observes the user's real context and interviews for gaps, identifies both signature strengths worth replicating and workflow breakdowns worth compensating, recruits existing skills, then designs a complementary

1 stars

AI开发工程师全流程工作流。覆盖需求分析→技术选型→数据处理→AI核心开发(Prompt/Agent/RAG/微调)→后端服务→前端交互→测试评估→部署运维→性能优化→LLMOps→安全护栏10大阶段。面向LLM应用开发全链路,提供代码模板、架构决策框架、调试排查指南。触发词: AI开发, AI工程师, AI全栈...

5 installs1 stars

编程专家综合技能套件,含17个子技能:软件项目总控、网站项目总控、API设计、Bug诊断、代码生成、代码审查、重构建议、测试用例生成、技术选型、文档生成、任务拆解与执行、Spec驱动开发、Karpathy编码规范、项目记忆管理、CMS二次开发、前端设计、MySQL数据库。按用户输入关键词路由到对应子技能模板执行。 关键词路由:软件项目总控(软件项目/API服务/后端服务/后台模块/CLI工具/数据脚本/自动化任务/插件项目/完整功能/项目交付/部署/发布/上线/回滚/运维/监控/告警/巡检);网站项目总控(做网站/建站/企业官网/营销页/CMS网站/网站上线/网站交付);API设计(RESTful/GraphQL/接口规范/AJAX防卡死/Init-Step-Poll/长任务接口/轮询接口);Bug诊断(debug/异常堆栈/报错);代码生成(写代码/实现功能);代码审查(code review/安全漏洞/代码缺陷);重构建议(重构/坏味道/代码异味/可维护性);测试用例生成(单元测试/集成测试/安全测试/性能测试/长任务测试);技术选型(技术栈/框架选型);文档生成(API文档/README/技术文档/部署说明/回滚说明/运维文档);任务拆解与执行(任务分解/Wave执行);Spec驱动开发(spec/需求对齐/需求规格);Karpathy编码规范(Karpathy/编码哲学/简洁优先);项目记忆管理(项目记忆/跨会话/上下文沉淀);CMS二次开发(CMS/帝国CMS/WordPress/ThinkPHP/PHP8兼容/二次开发/插件开发/模板开发/批量任务/导入导出/生成静态页);前端设计(UI设计/UX/交互设计/响应式/设计系统/可访问性/页面视觉/浏览器验证/品牌设计/Banner/图标/社媒图/进度条/轮询状态);MySQL数据库(MySQL/数据库设计/SQL/索引/事务/慢查询/EXPLAIN/DDL/迁移/表结构/SQL优化)。

微信小程序 AI 开发模式(beta)完整开发指南。当开发者需要将小程序改造为 AI 开发模式、封装 SKILL、编写原子接口/原子组件、编写 SKILL.md 或 mcp.json 时触发。覆盖接入流程、项目结构、Schema 设计、content 文本写法、组件约束、最佳实践、常见反例的全部规范。

1 installs

游戏AI开发指南,涵盖FSM、行为树、寻路与决策系统的代码实现。Use when 需要代码生成、编程辅助、调试测试、开发部署时使用。不适用于无明确技术栈的模糊需求。适用于独立开发者、企业团队和自动化工作流场景。支持中文交互,无需复杂配置即开即用。输出结果可直接使用,减少二次加工成本。提供结构化输出和错误处理机制。

3 installs