Skill · v1.2.0 · 作者 Yishan · MIT

Saan Diagram

把业务描述、需求文档、白板截图,转成同一套规范下的中英文业务图示

统一的是约束语言,不是具体方案。

14种图示 49条校验规则 ≤3处核心色
安装

按你用的地方装

你用的是怎么装
npx(通用)npx skills add yishan/saan-diagram --skill saan-diagram
Claude Code/plugin marketplace add yishan/saan-diagram
/plugin install saan-diagram@saan-diagram
Claude.ai将仓库中的 skills/saan-diagram/ 完整目录打成 zip(顶层为 saan-diagram/),在设置里上传
怎么工作

写 spec,脚本出图

  1. 抽取阶段、节点、系统、连线
  2. 补齐必要信息缺失的业务事实、交付目标
  3. 从模板起步--init
  4. 精简表达保留业务事实与控制点
  5. --all 校验必须通过
  6. 亲眼看图看 PNG
  7. 交付HTML / PNG / 飞书画板

输出语言优先按你的明确要求,否则沿用请求的语言。英文图示使用 language: en,中文使用 language: zh-CN;模板的语言不决定交付语言。查看英文示例

视觉语法

颜色只留给"系统"和"核心"

业务节点一律中性灰,核心色全图 ≤3 处。

节点

主线节点hub 主干、汇聚点 功能模块module 默认,中性浅灰 内部系统system · internal VI 主色 外部服务system · external 主色提亮 45% 核心业务core: true 全图 ≤3 处(F1) 重点能力special 一张图只突出一类,名称自定(如"AI 能力")

连线

flow 业务主流程 data 数据、集成、推送 meta 配置依赖,必须带标签 emphasis 关键路径,全图只标一条
  • 只用正交折线,拐角半径 8,不画斜线
  • 标签放在线旁、不压线,也不压节点
  • 箭头末段 ≥ 24px,箭头前要看得到线

文字与网格

  • 节点名 ≤10 字,连线标签 ≤8 字;放不下就精简措辞,不缩字号
  • 中文最小 12px,不用等宽字体;等宽字体只给技术值(SHA-256)
  • 所有结构尺寸都落在 4px 网格上
  • 标题栏默认白底线框,不占颜色预算
  • 图例自动生成,只列图中实际用到的类型
  • 泳道不是必备的:只有列本身有含义时才画
选型速查

先问:你要表达的是什么

一段文字能说清的,就不画。

  1. 01架构视图业务能力全景:每个阶段有哪些模块,接哪些系统。arch
  2. 02主流程视图一条业务主流程怎么走,判断点在哪里分叉、回退到哪里。flow
  3. 03路径对比视图同一套阶段上,几种方式各走过哪些阶段、跳过哪些。paths
  4. 04泳道图多个角色之间谁在什么时候做什么、在哪里交接。swim
  5. 05数据流图数据从哪来、经过哪些处理、存到哪、流向谁。dfd
  6. 06审计流程图付款审批中有哪些单据、关键控制点在哪、各防什么风险。audit
  7. 07机会流程图流程里哪些环节不增值,最该砍的是哪几步。opportunity
  8. 08分层架构图平台由哪些层组成、对外接什么、受哪些体系约束。layers
  9. 09实体关系图有哪些业务对象、彼此什么关系、几对几。er
  10. 10组织架构图 + 数据隔离谁管谁之外,谁能看到谁的数据。org
  11. 11鱼骨图一个结果背后有哪些原因,哪些已经验证。fishbone
  12. 12里程碑时间线关键节点什么时候到、现在走到哪、偏了多少。timeline
  13. 13四象限图一组事项在两个维度上,该先做哪个。quadrant
  14. 14IDEF0 功能模型每个活动受什么约束、靠谁完成、产出什么。idef0

不画:时序图、状态图、物理表结构、甘特图。

示例全集
校验

排版可以改,业务发现不许改

排版问题 · 33 条

建模 R1 R3 R5 R6 · 几何 A1 B1 G1–G4 · 文字 L1–L3 T1 S1 E3 · 预算 F1 F2 D1 D2 · 分层图 V1 W1 K1 · 组织图 O3 O4 · 鱼骨 / 时间线 / 四象限 FB1 TL1–TL3 Q1 Q2 · IDEF0 ID3 ID5

改 spec 直到通过

业务发现 · 16 条

路径 P1 绕过控制点 · P2 走不到 · P3 死路 · P4 单出口判断 · P5 岗位未分离 · 流程分析 DF1–DF3 AU1 AU2 · 数据隔离 O1 O2 · 其他 ID1 ID2 Q3 C1

报告给你;确认属实后写进 accept,图例下方如实标注

--selftest:49 条规则逐条用改坏的样例验证。

流程路径验证

检查图中控制点是否存在绕过路径

column_semantics: roles    # 本例的列明确表示岗位
verify:
  end: [执行支付]
  must_pass:                 # 控制点不可绕过
    - before: 执行支付
      through: [核对合同验收, 审核发票, match]
  separate:                  # 岗位分离
    - [提交付款申请, 执行支付]
— 业务发现(不许为了通过而改图)
  [P1] 可以绕过『核对合同验收』『审核发票』
       『三单一致?』到达『执行支付』,例如:
       提交付款申请 → 执行支付
  已验证:5 个步骤都能从起点到达,也都能走到终点
  已验证:『提交付款申请』与『执行支付』
          声明了不同角色(业务部门 / 出纳)
示意输出;实际权限需单独核验
FAIL: 排版 0 条 · 发现 1 条 · 退出码 2
写入 accept 后的审计流程图:图例下方列出两条已验证结论和一条已确认的发现
交付

HTML / PNG,或写入飞书画板

写画板只通过 wb_publish.py

  • 退出码 20先导出现有画板,看过再写
  • 不覆盖覆盖须你明确同意
  • 退出码 10高风险门禁,转给你确认
  • 不新建只写你给的画板
  • 幂等目标、方式、内容生成同一 token,重试复用
  • 退出码 21写入后回读失败,只重试回读

改图就是改 spec

  • PNG 导出失败返回 4;各产物状态记录在 *.result.json
  • 换方向:--orient vertical(阶段类图示)
  • 换 VI:--brand "#RRGGBB";换标题栏:--titlebar outline|gray|brand|dark