insight-diagram
为任意项目生成 UML 图、架构图和流程图。分析代码库后让用户选择要生成的图表类型，使用 architecture-diagram skill 渲染为 HTML+SVG，保存到 docs/ 目录。适用于任何软件项目的文档可视化。
npx skills add smallnest/goal-workflow --skill insight-diagram --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# Insight Diagram — 项目图表生成技能 分析任意代码库，自动生成 UML 14种图 + 架构图 + 流程图，使用 `/architecture-diagram` 渲染为 HTML+SVG。 ## 图表分类与清单 ### 结构性图形 (Structural Diagrams — 静态) 描述系统的物理组成和静态结构。 | 编号 | 图表类型 | 英文标识 | 关注点 | |------|---------|---------|--------| | 1 | 系统架构图 | architecture | 组件关系、全局视角（非UML，最常用） | | 2 | 类图 | class | 定义类、属性、操作及关系 | | 3 | 对象图 | object | 特定时刻的对象实例及其关系 | | 4 | 组件图 | component | 系统组件及其依赖关系 | | 5 | 部署图 | deployment | 物理硬件、节点及软件部署 | | 6 | 包图 | package | 将模型元素分组组织 | | 7 | 复合结构图 | composite-structure | 类的内部结构 | | 8 | 剖面图 | profile | 扩展UML元模型、自定义构造型 | ### 行为性图形 (Behavioral Diagrams — 动态) 描述系统与外部参与者或系统内部的交互过程。 | 编号 | 图表类型 | 英文标识 | 关注点 | |------|---------|---------|--------| | 9 | 流程图 | flowchart | 主流程与分支（非UML，最常用） | | 10 | 用例图 | usecase | 从用户角度展示系统功能 | | 11 | 活动图 | activity | 过程的流程或步骤 | | 12 | 状态机图 | state-machine | 对象生命周期的状态变迁 | | 13 | 序列图 | sequence | 按时间顺序展示对象间交互 | | 14 | 通信图 | communication | 侧重于对象间的组织关系 | | 15 | 定时图 | timing | 侧重于状态变化的时间约束 | | 16 | 交互概览图 | interaction-overview | 结合活动图和时序图 | | 17 | 泳道图 | swimlane | 跨组件/角色职责流程（活动图变体） | ## 示例参考 本技能的 `examples/` 目录包含 13 个已完成的图表 HTML 文件，作为视觉样式和内容结构的参考模板。**生成任何图表前，必须先阅读对应的示例文件**，以确保风格一致、结构规范。 ### 示例文件清单 | 文件 | 图表类型 | 英文标识 | |------|---------
- 图表分类与清单
- 结构性图形 (Structural Diagrams — 静态)
- 行为性图形 (Behavioral Diagrams — 动态)
- 示例参考
- 示例文件清单
- 参考规则
- 执行流程
- 步骤 1：分析代码库
- 步骤 2：选择图表
- 步骤 3：逐个生成
- 步骤 3.5：几何 review（每张图生成后必做）
- 步骤 4：报告
- 各图表的内容指南
- 系统架构图 (architecture) — 非UML，最常用
python3 skills/insight-diagram/scripts/review_svg.py docs/<标识>.html --min-gap 8
What does the insight-diagram skill do?
为任意项目生成 UML 图、架构图和流程图。分析代码库后让用户选择要生成的图表类型，使用 architecture-diagram skill 渲染为 HTML+SVG，保存到 docs/ 目录。适用于任何软件项目的文档可视化。
How do I install it?
Run `npx skills add smallnest/goal-workflow --skill insight-diagram --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From smallnest/goal-workflow, a repository with 199 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.