{"id":49531493,"url":"https://github.com/laolin5564/openclaw-collab-dev","last_synced_at":"2026-05-02T08:10:08.626Z","repository":{"id":343012231,"uuid":"1175946326","full_name":"laolin5564/openclaw-collab-dev","owner":"laolin5564","description":"Multi-agent collaborative development skill for OpenClaw — Gemini(design) + Claude Code(logic) + Codex(review) | 多Agent协作开发，7轮双盲测试验证","archived":false,"fork":false,"pushed_at":"2026-03-17T03:54:50.000Z","size":1448,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2026-03-17T17:29:04.803Z","etag":null,"topics":["ai-agents","claude","codex","collaborative-development","developer-tools","gemini","multi-agent","openclaw"],"latest_commit_sha":null,"homepage":"https://github.com/openclaw/openclaw","language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/laolin5564.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-03-08T12:03:12.000Z","updated_at":"2026-03-17T03:54:53.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/laolin5564/openclaw-collab-dev","commit_stats":null,"previous_names":["laolin5564/collab-dev","laolin5564/openclaw-collab-dev"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/laolin5564/openclaw-collab-dev","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/laolin5564%2Fopenclaw-collab-dev","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/laolin5564%2Fopenclaw-collab-dev/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/laolin5564%2Fopenclaw-collab-dev/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/laolin5564%2Fopenclaw-collab-dev/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/laolin5564","download_url":"https://codeload.github.com/laolin5564/openclaw-collab-dev/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/laolin5564%2Fopenclaw-collab-dev/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32527149,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-02T01:12:54.858Z","status":"online","status_checked_at":"2026-05-02T02:00:05.923Z","response_time":132,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ai-agents","claude","codex","collaborative-development","developer-tools","gemini","multi-agent","openclaw"],"created_at":"2026-05-02T08:10:07.905Z","updated_at":"2026-05-02T08:10:08.614Z","avatar_url":"https://github.com/laolin5564.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ch1 align=\"center\"\u003e🤝 OpenClaw Collab Dev\u003c/h1\u003e\n  \u003cp align=\"center\"\u003e\n    Multi-agent collaborative development skill for \u003ca href=\"https://github.com/openclaw/openclaw\"\u003eOpenClaw\u003c/a\u003e\u003cbr/\u003e\n    \u003cem\u003e七轮 A/B 双盲测试验证 · 9 个版本迭代 · 每条规则都来自真实 bug\u003c/em\u003e\n  \u003c/p\u003e\n\u003c/p\u003e\n\n\u003e [!IMPORTANT]\n\u003e **使用前请确保已安装并登录以下 CLI 工具：**\n\u003e \n\u003e | 工具 | 安装 | 登录 |\n\u003e |------|------|------|\n\u003e | [Gemini CLI](https://github.com/google-gemini/gemini-cli) | `npm i -g @google/gemini-cli` | 运行 `gemini`，按提示登录 Google 账号 |\n\u003e | [Claude Code](https://docs.anthropic.com/en/docs/claude-code) | `npm i -g @anthropic-ai/claude-code` | 运行 `claude`，按提示完成浏览器 OAuth |\n\u003e | [Codex CLI](https://github.com/openai/codex) | `npm i -g @openai/codex` | 运行 `codex`，按提示登录 OpenAI 账号 |\n\u003e \n\u003e 安装遇到问题？→ 查看 [troubleshooting.md](references/troubleshooting.md)\n\n---\n\n## 为什么不让一个 Agent 全做？\n\n单 Agent 开发就像一个人同时当设计师、架构师、程序员和 QA——什么都能做，但每个维度都达不到专家水平。\n\ncollab-dev 让 **4 个 Agent 各司其职**：\n\n### Solo（左）vs 协作（右）实际对比\n\n**桌面端**：协作版双栏布局 + 渐变色系统，Solo 版单栏朴素布局\n![桌面端对比](assets/comparison-desktop.jpg)\n\n**移动端**：协作版保持双栏自适应，Solo 版线性堆叠\n![移动端对比](assets/comparison-mobile.jpg)\n\n**登录页**：Solo 版全屏沉浸式，协作版模态弹窗 + 背景可见\n![登录页对比](assets/comparison-login.jpg)\n\n\u003e 以上截图来自第 7 轮双盲测试（Pomodoro 番茄钟），左侧 Solo 版由 Claude Code 独立完成，右侧协作版由 Gemini + Claude Code + Codex 协作完成。\n\n```\n🎨 Gemini ── 设计规范 + UI 代码（配色、动效、响应式）\n     ↓\n🏗️ OpenClaw ── 架构 + 安全模板 + 逻辑骨架\n     ↓\n⚡ Claude Code ── 填充业务逻辑（只改 TODO 函数体）\n     ↓\n🔍 Codex ── 代码审查（找 bug，不改代码）\n```\n\n## 七轮双盲测试\n\n每轮生成「协作版」和「Solo 版」，**随机分配端口，用户不知道哪个是哪个**。\n\n| # | 项目 | 类型 | 用户选 | Codex 评分 | Claude Code 评分 |\n|:-:|------|:----:|:------:|:---------:|:---------------:|\n| 1 | TaskFlow 任务看板 | 标准 | — | 39 vs 40 | — |\n| 2 | PollBox 在线投票 | 🎨视觉 | ✅ 协作 | 6.0 vs 7.3 | — |\n| 3 | ChatRoom 聊天室 | 标准 | Solo | 36 vs 44 | — |\n| 4 | ChatRoom v2 | 标准 | ✅ 协作 | **42** vs 38 | — |\n| 5 | NoteBoard 便签板 | 标准 | ✅ 协作 | **36** vs 33 | — |\n| 6 | LinkBox 书签收藏 | 标准 | ✅ 协作 | 37 vs 39 | 26 vs 26 |\n| 7 | Pomodoro 番茄钟 | 🎨视觉 | ✅ 协作 | **42** vs 31 | **49** vs 35 |\n\n**用户选协作版 5/6 次。** 第 7 轮（视觉型）三方一致选协作版。\n\n### 核心发现\n\n| 发现 | 数据支撑 |\n|------|---------|\n| 视觉密集型项目协作版完胜 | Pomodoro 轮：Codex 42 vs 31，Claude Code 49 vs 35 |\n| 设计一致性是关键指标 | 从 v1 的 4/10 提升到 v9 的 9/10 |\n| Phase 1 拆两步是最大突破 | 先写 design.md 再写 HTML，设计一致性翻倍 |\n| Codex Review 最稳定 | 每轮都发现真实 bug |\n| 标准 CRUD 项目差距不大 | 协作版小幅领先，但不值得额外复杂度 |\n\n## 工作流（10-17 分钟）\n\n```\nPhase -1  OpenClaw 根据描述生成 PRD（用户故事 + 功能清单 + 验收标准）\n            └── 用户确认后继续\n              ↓\nPhase 0   OpenClaw 从 PRD 提取 spec.md\n            ├── 数据模型 · 功能优先级 · API 设计 · 验收标准\n            └── ⚠️ 不写 UI 风格提示（留给 Gemini）\n              ↓\nPhase 1a  Gemini 写 design.md\n            └── CSS 变量 · class 命名 · 动效规范 · 响应式\nPhase 1b  Gemini 写 index.html\n            └── 纯表现层代码，不含 JS 逻辑\n              ↓\nPhase 2   OpenClaw 写后端骨架 + 注入 JS 骨架\n            ├── 安全原则（认证密钥 · 异步哈希 · 白名单 · 参数化查询）\n            ├── 实时连接（唯一 ID · 排除当前连接 · 心跳）\n            └── // TODO 标记（含步骤说明）\n              ↓\nPhase 3   Claude Code 填 TODO ←同时→ Codex 预审骨架\n              ↓\nPhase 4   OpenClaw 自动化验证\n            ├── 语法 · TODO=0 · 设计命名一致\n            ├── CSS/JS class 交叉检查\n            ├── 安全 · DOM 结构 · Spec 覆盖率\n              ↓\nPhase 5   OpenClaw diff 自审 + 修复\nPhase 6   Codex 终审 → review.md\nPhase 7   修 Critical/High\nPhase 8   验收交付\n```\n\n## 从踩坑中学到的规则\n\n每条规则都来自真实的双盲测试 bug，不是理论推导。\n\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003ePhase 0: Spec 怎么写\u003c/b\u003e\u003c/summary\u003e\n\n| 规则 | 踩过的坑 |\n|------|---------|\n| 不写 UI 风格提示 | 第 6 轮：写了\"类似 Raindrop\"导致两版 UI 趋同，Gemini 无法差异化 |\n| 明确数据模型 | 第 5 轮：没写共享/私有，导致协作语义混乱 |\n| 功能标 P0/P1/P2 | 第 5 轮：spec 写了拖拽排序但两版都没实现 |\n| 字段命名统一 | 第 6 轮：API 用 `desc`，DB 用 `description`，前后端对不上 |\n| 搜索策略二选一 | 第 6 轮：server + client 双重搜索，逻辑冲突 |\n\n\u003c/details\u003e\n\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003ePhase 1: Gemini 设计\u003c/b\u003e\u003c/summary\u003e\n\n| 规则 | 踩过的坑 |\n|------|---------|\n| 拆两步（先规范再代码）| v1-v4 设计一致性只有 4 分，拆两步后飙到 9 分 |\n| 统一 `.hidden` 显隐 | 第 5 轮：Gemini CSS 用 `display:none`，JS 用 `.hidden`，弹窗打不开 |\n| 移动端保留 P0 功能 | 第 6 轮：侧边栏被 `display:none` 直接隐藏，标签筛选手机上不能用 |\n\n\u003c/details\u003e\n\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003ePhase 2: OpenClaw 骨架\u003c/b\u003e\u003c/summary\u003e\n\n| 规则 | 踩过的坑 |\n|------|---------|\n| bcrypt 必须异步 | 第 6 轮：`hashSync` 阻塞事件循环 |\n| JWT 密钥支持 env var | 第 5、6 轮：Solo 版硬编码密钥，致命漏洞 |\n| SSE 排除当前连接 | 第 6 轮：当前页收到自己的事件，双重刷新 |\n| 空状态放 grid 外 | 第 6 轮：`innerHTML` 覆盖 grid 时把空状态也删了 |\n| 事件委托替代 onclick | 第 6 轮：内联 onclick 拼接有 XSS 风险 |\n| DB 用 `path.join(__dirname)` | 第 6 轮：相对路径导致不同目录启动数据库位置不同 |\n| 枚举字段白名单 | 第 5 轮：color 无校验直接拼入 HTML class → XSS |\n\n\u003c/details\u003e\n\n## 版本演进\n\n```\nv1 ❌ Gemini ACP 从未成功\nv2 ⚠️ 设计参数在传递中丢失\nv3 ⚠️ Claude 不遵守设计规范\nv4 🚀 Gemini 直接写 UI 代码 → 用户首次选协作版\nv7 ✅ Phase 1 拆两步 → 设计一致性 4→9 分\nv8 ✅ 安全模板 + CSS/JS 集成检查\nv9 ✅ 双 Review 驱动 → 异步安全 + 移动端铁律\n```\n\n## 适用场景\n\n| 场景 | 推荐 | 说明 |\n|------|:----:|------|\n| Dashboard / 数据可视化 | ⭐⭐⭐ | Gemini 设计系统价值最大 |\n| 动画交互型应用 | ⭐⭐⭐ | 渐变、SVG 动画、主题切换 |\n| 需要设计系统的中大型项目 | ⭐⭐⭐ | design.md 确保全局一致性 |\n| 标准 CRUD 工具 | ⭐⭐ | 可用但 Solo 差距不大 |\n| 简单单页应用 | ⭐ | 协作开销不值得，直接 Solo |\n\n## 安装\n\n```bash\n# OpenClaw CLI\nopenclaw skills install laolin5564/collab-dev\n\n# 手动\nmkdir -p ~/.openclaw/skills/collab-dev\ncurl -o ~/.openclaw/skills/collab-dev/SKILL.md \\\n  https://raw.githubusercontent.com/laolin5564/collab-dev/master/SKILL.md\n```\n\n## 💡 想先看实际效果？\n\n[examples/](examples/) 里有第 7 轮双盲测试的**完整源码**，可以直接运行对比：\n\n```bash\ngit clone https://github.com/laolin5564/collab-dev.git\ncd collab-dev/examples/pomodoro-collab \u0026\u0026 npm install \u0026\u0026 PORT=3001 node server.js\n# 另一个终端\ncd collab-dev/examples/pomodoro-solo \u0026\u0026 npm install \u0026\u0026 PORT=3002 node server.js\n```\n\n打开 `localhost:3001`（协作版）和 `localhost:3002`（Solo 版），自己看、自己判断。\n\n详细评分 → [examples/README.md](examples/README.md)\n\n## 使用指南\n\n### 前提条件\n\n确保你已经：\n1. 安装了 [OpenClaw](https://github.com/openclaw/openclaw) 并正常运行\n2. 安装并登录了 Gemini CLI、Claude Code、Codex CLI（见顶部表格）\n3. OpenClaw 的 ACP 配置已就绪（首次触发 skill 时会自动检查）\n\n### 触发方式\n\n对 OpenClaw 说以下任意一句即可触发协作开发流程：\n\n```\n协作开发一个番茄钟应用\ncollab dev a dashboard\nmulti-agent build 一个投票系统\n```\n\n### 完整使用流程\n\n```\n1. 你告诉 OpenClaw 要做什么项目\n   └── \"协作开发一个在线投票系统\"\n\n2. OpenClaw 自动写 spec.md（需求规格）\n   └── 你可以检查并修改，满意后继续\n\n3. Gemini 自动生成设计规范 + UI 代码（约 2-3 分钟）\n   ├── design.md — CSS 变量、配色、命名规范\n   └── index.html — 纯 UI 代码，不含逻辑\n\n4. OpenClaw 自动写后端骨架 + 注入 JS 框架\n   ├── server/backend code — 认证、数据库、API、实时连接\n   └── frontend code — 补充 JS 骨架，标记 // TODO\n\n5. Claude Code 自动填充业务逻辑（约 3-5 分钟）\n   └── 只改 // TODO 标记的函数体，不动 UI\n\n6. OpenClaw 自动验证\n   ├── 语法检查 + TODO 残留 = 0\n   ├── 设计一致性 + CSS/JS 交叉检查\n   ├── 安全审查 + DOM 结构检查\n   └── Spec 覆盖率（P0 全绿）\n\n7. Codex 自动做代码审查 → 生成 review.md\n\n8. OpenClaw 根据 review 修复问题 → 交付\n```\n\n**全程自动，预计 10-17 分钟。** 你只需要描述需求（一句话就行），OpenClaw 会先生成 PRD 确认，再自动走完全流程。\n\n### 输出文件\n\n完成后项目目录结构：\n\n```\nyour-project/\n├── spec.md              ← 需求规格\n├── design.md            ← Gemini 设计规范\n├── server/backend code  ← 后端（语言/框架由 spec.md 决定）\n├── frontend code        ← 前端（Gemini UI + Claude 逻辑）\n├── package.json         ← (如适用)\n└── review.md            ← Codex 代码审查报告\n```\n\n### 配置要求（OpenClaw）\n\n如果 Claude Code / Codex 通过 ACP 调用失败，检查 `openclaw.json`：\n\n```json\n{\n  \"plugins\": {\n    \"acpx\": {\n      \"config\": {\n        \"permissionMode\": \"approve-all\"\n      }\n    }\n  }\n}\n```\n\n更多排查 → [references/troubleshooting.md](references/troubleshooting.md)\n\n## 相关\n\n- [OpenClaw](https://github.com/openclaw/openclaw) — AI Agent 运行时\n- [ClawHub](https://clawhub.com) — Skill 市场\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flaolin5564%2Fopenclaw-collab-dev","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flaolin5564%2Fopenclaw-collab-dev","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flaolin5564%2Fopenclaw-collab-dev/lists"}