一、项目介绍

1.1 一句话定位

“You think visually. AI thinks in .md. CC Workflow Studio speaks both.”
你用画布思考，AI 用 Markdown 思考，CC Workflow Studio 在两者之间做翻译。

CC Workflow Studio 是一款基于 VS Code 扩展形态发布的「AI 编码 Agent 可视化工作流编排器」。它把过去散落在 CLAUDE.md、slash commands、sub-agents、MCP tools、skills 中的"提示词工程"工作，重新组织成一张可拖拽、可导出、可执行的有向流程图。

简单一句话理解：它把 Claude Code / Copilot / Codex CLI / Cursor / Gemini CLI 等 AI 编码助手的"提示词与编排"，从"在终端里靠脑子背"变成"在画布上拖来拖去"。

1.2 它解决了什么痛点

传统 AI 编码助手痛点	CC Workflow Studio 的解法
Prompt 散落在记忆里，重复输入、不可复用	流程节点持久化为 *.json，团队可共享
多步任务靠手敲，缺乏分支/循环/审批控制	画布上原生支持条件分支、Sub-Agent、循环节点
多 Agent（Claude/Copilot/Codex/Cursor）切换上下文成本高	一份流程图，一键导出到不同 Agent 对应的目录格式
流程难以调试、难以回放	可"Run from Editor"直接在 VS Code 内回放执行
新人上手 Claude Code 门槛高（CLAUDE.md、skills、hooks……）	可视化节点 + 自然语言"Edit with AI"自动生成流程

1.3 支持的 AI 编码 Agent 矩阵

Agent	导出目录
Claude Code	.claude/agents/ .claude/commands/
GitHub Copilot Chat	.github/prompts/
GitHub Copilot CLI	.github/skills/
OpenAI Codex CLI	.codex/skills/
Roo Code	.roo/skills/
Gemini CLI	.gemini/skills/
Antigravity（Google）	.agent/skills/
Cursor	.cursor/agents/ .cursor/skills/

这意味着：一次设计、多端导出，是它最大的工程价值之一。

---

二、核心理念

2.1 三个核心抽象

• 画布（Canvas）：人类思维友好，所见即所得
• Markdown（中间产物）：AI 友好，跨 Agent 通用
• 导出格式（Slash Command / Skill / Agent）：Agent 原生可执行

2.2 关键设计哲学

1. Agentic Engineering 优先：把"Sub-Agent 编排 + Agent Skills + MCP Tools"作为三大原子能力
2. 本地优先（Local-first）：所有流程文件都是工作区内的 .vscode/workflows/*.json，可 Git 化、可 PR 化
3. AI-Native 编辑：通过内置的 MCP Server，让 Claude Code 自身能"编辑自己即将执行的工作流"，形成闭环

---

三、工作原理与架构

3.1 整体架构

3.2 "Edit with AI"闭环时序

3.3 节点体系（20+ 类型）

节点类别	代表节点	作用
入口/出口	Start / End	流程起止
提示词	Prompt	自然语言指令
智能体	Sub-Agent	调用专门角色（如 reviewer、tester）
技能	Agent Skill	条件式加载领域知识
工具	MCP Tool	调用外部能力（GitHub、DB、浏览器）
控制流	Condition / Router / Loop	分支、路由、循环
人工	Approval / Human-in-the-loop	人工审批节点
IO	File Read/Write、Shell Exec	与代码库交互

3.4 导出产物的本质

以 Claude Code 为例，画布中的一条流水线最终会被翻译为：

.claude/
├── commands/
│   └── pr-review.md            # 可在 CC 中使用 /pr-review 调起
└── agents/
    ├── code-reviewer.md         # Sub-Agent 角色卡
    └── test-writer.md

所以"工作流"在 AI 侧的真身，仍然是 Markdown——这一点决定了它能优雅地融入 Git、Code Review、CI 等既有研发体系。

---

四、工作模式

4.1 四种主要工作模式

模式一：可视化设计（Designer Mode）

• 用户从节点面板拖拽节点，连线，配置参数
• 适合：流程清晰、规则明确、有标准化诉求的团队

模式二：AI 共创（Edit-with-AI Mode）

• 用户用自然语言描述（如"做一个 PR 审查流程，先取 PR 内容，再按代码行数分流"）
• AI 通过 MCP Server 直接在画布上构建/迭代节点
• 适合：从 0 到 1、原型阶段、个人开发者快速试验

模式三：导出复用（Export Mode）

• 一键导出为 .md，提交到 Git
• 团队成员只需 git pull 即可在自己的 Claude Code 中 /workflow-name 触发
• 适合：组织级 SOP 沉淀

模式四：编辑器内执行（Run-in-Editor Mode）

• 在 VS Code 内直接点 “Run” 按钮，调用 Agent 运行整条流水线
• 实时观测执行轨迹、Token、产物
• 适合：调试、演示、单次任务自动化

4.2 与传统 Workflow 工具对比

维度	n8n / Dify	CC Workflow Studio
部署形态	在线/自建服务	VS Code 扩展，零部署
主要受众	业务自动化、低代码	AI 编码场景下的研发
输出物	在平台内执行	输出 Markdown，由 Agent 执行
灵活性	节点固定	节点是 Prompt+Skill+MCP 组合
协作方式	平台账号	Git/PR，研发友好

---

五、典型应用场景与落地案例

5.1 应用场景全景

5.2 官方/社区典型落地案例

案例 A：PR 代码审查工作流（官方示例）

来源：项目主页 README / CSDN 案例文章

业务诉求：研发提交 PR 后，希望自动完成"取 PR -> 风险评级 -> 不同深度审查 -> 生成报告 -> 通知人工审批"全过程。

画布结构：

收益：

• 大 PR 不再被一刀切的 Prompt 草草处理
• 不同体量自动匹配不同算力 / 模型层级（Haiku / Sonnet / Opus）
• 审查规则可被全团队复用

案例 B：Bug 修复闭环（社区流传度最高）

亮点：带反馈循环，测试不通过自动回到根因分析节点。

案例 C：从 PRD 到任务卡的需求拆解流水线

（受 Claude Taskmaster、claude-task-master 启发）

PRD.md → 解析与抽取 → 任务分解（Opus 规划） → 任务卡 JSON → 自动建 Issue → 生成 CLAUDE.md 任务清单

适合长沙团队场景：需求拆解 + 奖励模型、小哥智能助手、跨端重构等大模型项目的"任务化"沉淀。

案例 D：VSCode 插件本身的"自举"开发

• 仓库本身有 .claude/skills、.specify、.roo 多套配置
• 项目作者用 CC Workflow Studio 自身来开发 CC Workflow Studio
• 这是一个非常好的"Dogfooding"参考样本

---

六、可落地的设计方案（建议方案）

目标：在我们现有"小哥智能助手 / 跨端重构 / Harness Engineering"等大模型项目中，引入 CC Workflow Studio 作为统一的 AI 工作流编排层，把零散的 Prompt 与 Skill 沉淀为团队级资产。

6.1 落地总体架构

6.2 分阶段落地路线

阶段一：POC 验证（2 周）

任务	输出物	负责人
在 1 台开发机安装 cc-wf-studio	安装手册	个人
用画布复现 1 条 PR 审查流	pr-review.json + 导出 .md	1 人
评估与 JoyCode/内部 Agent 的兼容性	兼容性报告	1 人

验收标准：可在 Claude Code 中通过 /pr-review 一键执行。

阶段二：团队试点（4 周）

选 2 个核心场景进行规模化复制：

1. 小哥智能助手 - 话术生成流水线
   • 入参：用户问题 + 历史对话
   • 节点：知识库检索 → 多角色生成 → 合规审查 → 输出
2. 跨端重构 - 原生转 Flutter
   • 节点：源码分析 → 控件映射 Skill → 代码生成 Sub-Agent → 单测自动生成 → diff 报告

每条流水线必须沉淀：流程图 + json + 导出 md + README + 一条 demo 视频。

阶段三：平台对接（6 周）

关键工程项：

1. 自研内部 MCP Server，封装：
   • JIRA：拉取需求、创建任务
   • GitLab：PR、Issue、Pipeline
   • 知识库：RAG 检索接口
   • 评测平台：调用奖励模型评分
2. 统一节点库（Internal Node Pack）
   • 自定义 Skill：合规检查、敏感词、京东风格代码规范
   • 自定义 Sub-Agent：架构师 / 测试工程师 / 文档工程师 / PMO
3. CI 流水线集成
   • 提交 PR 时自动触发 .claude/commands/pr-review.md 进行预审

阶段四：组织级沉淀（持续）

• 建立 "工作流市场"内部站点：所有团队的 *.json 流程可检索、可一键克隆
• 与 Harness Engineering 思路结合：把每条流程看作一份"实验装置"，可观测、可度量、可持续优化
• 与 奖励模型 串联：每次工作流执行结果回流，反哺模型迭代

6.3 关键设计决策（建议）

决策点	建议	理由
工作流文件存放	仓库内 .vscode/workflows/ + Git 跟踪	可 Review、可回滚
Skill 与 Sub-Agent 命名规范	{域}_{动作}.md，如 flutter_refactor.md	便于检索与复用
多 Agent 兼容	默认产出 Claude Code 与 Cursor 双格式	兼顾团队不同偏好
敏感操作	强制 Approval 节点（部署、删库、对外发布）	风险可控
度量指标	工作流执行次数 / 成功率 / 节省工时 / token 成本	可量化 ROI
协议风险	AGPL-3.0，不建议直接二次分发修改版	走"使用 + 自研扩展"路线

6.4 一份示例工作流：京东研发场景"需求 -> 代码 -> 评测"全链路

6.5 风险与对策

风险	影响	对策
AGPL-3.0 协议传染	法务风险	仅作为使用方，不二次分发；自定义节点放独立私仓
与内部 IDE/JoyCode 兼容性	落地受限	POC 阶段优先验证 MCP Server 是否互通
工作流爆炸式增长难维护	管理成本	建立 owner 制 + 季度治理
模型成本失控	财务风险	节点级 token 预算 + 模型分级（Haiku 默认 / Opus 关键节点）
安全合规	信息泄漏	内网部署 MCP，禁用外网 MCP；敏感节点必须 Approval

---

七、结语

CC Workflow Studio 的本质，是把 “AI 编码 Agent 的提示词工程” 这件原本极其依赖个人经验的事，工程化、可视化、资产化了。

对长沙团队当下的几条主线（小哥智能助手 / 跨端重构 / Harness Engineering / 自动化 AI 开发）而言，它最大的价值不是"又一个工具"，而是提供了一个统一的载体——让我们把过去散落在文档、脑子里、Prompt 备忘里的"研发流水线 know-how"，凝固为团队可复用、可演进的资产。

画布是给人看的，Markdown 是给 AI 看的，而工作流，是给团队世代相传的。

---