流程图架构图生成
将以下提示词粘贴到你的 AI 对话框中:
请根据 https://skillhub.cn/install/skillhub.md,安装 @kunlungrowth/diagram-as-code。
技能介绍
要解决什么问题
架构评审、需求对齐或运维交接里,常见情况是「图在脑子里或 PPT 里」,却缺少一份可版本管理、可 diff 的图源。手写 Mermaid 或 PlantUML 往往卡在语法细节和命名上:节点该叫什么、边表示什么语义、时序里参与者有几条生命线,都会拖慢文档迭代。
本技能面向的是:你已经有业务或系统的自然语言描述,需要快速得到能在 Markdown、Wiki 或 CI 文档里直接渲染的 diagram-as-code,而不是从零查语法手册。
技能如何工作
触发后大致走四步,和文档架构师画图的思路一致:
- 图类型识别 — 在流程图、架构图、时序图、ER 图、状态机之间选定(或在你描述模糊时给出 2~3 种候选让你选)。
- 要素提取 — 从描述里抽出节点、关系、数据流向、时序参与者等,避免漏关键步骤或系统边界。
- 代码生成 — 输出严格符合 Mermaid / PlantUML 规范的片段,可直接粘贴到支持渲染的环境。
- 注释与命名 — 节点与边用业务含义命名,尽量少用内部技术黑话,方便非开发同事读图。
典型输入是「业务描述 + 期望图类型」;输出是代码块加上简短渲染说明。高频场景包括贷款/审批类全流程、微服务调用链、状态流转等。
适用边界与注意点
- 描述过于笼统、实体关系不清时,技能会先给实体清单请你确认,再生成完整图,避免猜错领域模型。
- 本技能产出的是源码级 diagram,不是 PNG/SVG 文件本身;导出位图需把代码贴到 Mermaid Live 或 PlantUML 在线渲染器再导出。
- 复杂布局(超大 ER、上百节点)可能需要你后续手工微调样式;生成侧优先保证结构与语义正确。
使用场景
- 产品或业务同学口述「从咨询到放款」等审批链路,需要落成可放进 PRD 的 Mermaid 流程图
- 架构设计评审前,要把多个服务之间的调用顺序整理成时序图并写入 Markdown 设计文档
- 新系统立项时用自然语言描述实体与关系,需要生成 ER 图草稿供数据模型评审
- 订单、工单等状态流转规则用文字说明后,需要输出状态机图供研发与测试对齐边界
适合人员
- 负责微服务或模块边界、需要在设计文档里固定调用链路的 backend 架构师
- 要把业务审批或运营流程画成图再交给研发排期的产品或业务分析同学
- 维护技术 Wiki / 开源 README、希望 diagram 以代码块形式可 diff 的技术写作者
- 领域模型或表结构尚在讨论阶段、需要先出 ER 或状态机草图的数据或建模同学