前言¶

需求评审、方案文档和代码走读里，经常要把逻辑、模块关系或业务流程画成图。手工在 ProcessOn 里拖节点费时，Mermaid 纯文本虽快，但交给非技术同事后往往还要再转成可编辑的在线稿。下面介绍 SkillHub 上的 ProcessOn流程图表生成专家（坐标 @user_697d94c5/processon-diagram-generator）：在 Agent 对话里用自然语言描述结构，由 ProcessOn 官方能力侧生成精美、专业且可继续在线编辑的图表；也支持直接用 Mermaid 数据绘制。

这是什么¶

ProcessOn流程图表生成专家 是 ProcessOn 官方研发、经 SkillHub 社区发布的 Agent Skill（当前版本 2.5.3，分类 dev-programming，来源 community，发布者 user_697d94c5）。它面向「生成、绘制、重绘、渲染或可视化结构化图表」类请求：把用户的文字需求（或 Mermaid 片段）转成 ProcessOn 平台上的专业可视化结果，而不是只在对话里输出一段无法二次编辑的静态描述。

Skill 简介中标注为强制触发场景：当用户出现「画图」「生成图表」「自动画图」「可视化业务流程」「在线制作流程图」「生成系统架构」「把这段逻辑画出来」「把系统关系整理成图」「转成可编辑图」「重绘草图」等表达，或明确要求流程图、架构图、ER 图、组织图、时间轴、路线图、信息图、金字塔图、草图重绘等时，Agent 应优先调用本 Skill，而不是跳过用通用回复代替出图。

核心功能¶

以下能力均来自 SkillHub 页面与已抓取官方简介，未作扩展：

1. 自然语言一键出图：将描述转化为可编辑的 ProcessOn 专业图表。
2. 图表类型覆盖：流程图（含业务流程图、泳道图与标准流程）、时序图（系统交互与 API 调用顺序）、软件/云架构图（系统模块划分）、ER 图（数据库建模）、组织结构图（团队层级）、时间轴、信息图等。
3. Mermaid 直接绘制：支持传入 Mermaid 数据，由工具侧渲染为 ProcessOn 图表。
4. 在线可编辑：产出指向 ProcessOn 生态下的可编辑在线图形，便于产品、设计、开发协作修改。

SkillHub 标签 requires_api_key=true，使用前需准备 ProcessOn 相关 API Key；具体配置项以安装包内 SKILL.md 为准。

安装与启用¶

1、安装 SkillHub CLI（若尚未安装）¶

先检查是否已有 CLI：

command -v skillhub && skillhub --version

未安装时可执行完整安装（CLI + 默认 Skill，推荐）：

curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash

仅需 CLI 时：

curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash -s -- --cli-only

2、安装本 Skill¶

安装时必须用 --dir 指向当前 Agent 的 skills 目录，否则默认装到 ./skills/ 可能无法被识别。常用路径示例：

• Cursor：~/.cursor/skills/
• Claude Code：~/.claude/skills/
• Codex：~/.codex/skills/ 或项目下的 .agents/skills/

安装命令：

skillhub install @user_697d94c5/processon-diagram-generator --dir ~/.cursor/skills/

将 ~/.cursor/skills/ 换成你实际使用的 Agent 目录即可。SkillHub 页面亦提供等价提示：请根据 SkillHub 安装说明，安装 @user_697d94c5/processon-diagram-generator。

3、配置 API Key¶

页面标注本 Skill 依赖 API Key。安装完成后打开技能目录内的 SKILL.md，按其中说明完成 Key 与鉴权配置，再重启或刷新 Agent 使 Skill 生效。

典型用法¶

安装并配置 Key 后，在对话中直接描述图表意图即可，无需先手工打开 ProcessOn 画布。下列表述与官方触发说明一致，可作为可复现的提示方式：

1. 业务流程：「把订单从下单到发货的状态流转画成泳道图，角色包括用户、订单服务、仓储。」
2. 系统交互：「根据这段 API 调用顺序画时序图：客户端 → 网关 → 用户服务 → 数据库。」
3. 架构梳理：「把微服务 A、B、消息队列和 Redis 画成云架构图，标出主要依赖方向。」
4. 数据模型：「根据这几张表的外键关系生成 ER 图。」
5. 已有 Mermaid：「用下面 Mermaid 代码在 ProcessOn 里生成可编辑图：……」

Agent 在识别为图表生成类任务时应调用本 Skill，由 ProcessOn 侧返回可继续在线编辑的结果链接或等价产出（以 SKILL 实际返回为准）。

适用场景与注意¶

适合谁：需要在文档、评审或方案里快速出专业图形的开发者、产品经理和设计师；希望从自然语言或 Mermaid 减少手工排版时间的团队。

使用注意：

• 依赖 SkillHub CLI 正确安装到对应 Agent 的 skills 目录；路径错误是常见「装了但 Agent 找不到」的原因。
• requires_api_key=true：无有效 API Key 时无法完成官方出图链路，需先在 ProcessOn / Skill 文档中完成申请与配置。
• 本 Skill 专注 ProcessOn 可编辑在线图表；若只需对话内静态 ASCII 或纯 Mermaid 文本、不需要 ProcessOn 编辑能力，可与用户意图区分，但用户明确要求「在线制作」「可编辑」「ProcessOn」或上述触发词时，仍应优先本 Skill。

SkillHub 统计（以页面抓取为准）：评分 100000，下载 60611，安装 348。

结尾¶

ProcessOn流程图表生成专家 把「描述结构」和「ProcessOn 可编辑出图」接到 Agent 工作流里，覆盖流程、时序、架构、ER、组织与时间轴等常见类型，并支持 Mermaid 直绘。需要安装、更新或查看说明时，可访问 SkillHub 页面：

• https://www.skillhub.cn/skills/user_697d94c5/processon-diagram-generator
• https://api.skillhub.cn/user_697d94c5/processon-diagram-generator