源码到架构 (Source to Architecture)
从代码/模块 → 模块关系 → 组件架构 → 部署架构的全链路可视化、可追溯、可版本化技能。
技能核心能力 - 五层DrawIO架构模板（优化版）
接入层 (浅蓝色 #ADD8E6)
物理组件: API Gateway、Client、Web前端、移动App
逻辑组件: 用户入口、外部接口、协议转换
输出: 接入层架构图、外部接口清单
路由/控制层 (浅绿色 #90EE90)
物理组件: Controller、Service、Manager、路由组件
逻辑组件: 业务协调、流程控制、权限验证
输出: 控制层拓扑图、服务协调流程图
逻辑层 (浅黄色 #FFFFE0)
物理组件: Core模块、Logic处理器、Executor执行器
逻辑组件: 核心业务规则、领域逻辑、算法实现
输出: 逻辑层架构图、业务规则映射表
数据访问层 (浅紫色 #E6E6FA)
物理组件: DAO、Repository、Cache、数据适配器
逻辑组件: 数据抽象、查询优化、缓存策略
输出: 数据访问层图、数据契约清单
存储/外部层 (灰色 #D3D3D3)
物理组件: DB、MQ、Redis、第三方服务、文件存储
逻辑组件: 外部依赖、数据持久化、异步通信
输出: 存储层拓扑图、外部依赖清单
🎯 优化后的排版规范（严格遵循）
一、整体布局规则
- 强制分层布局: Top-to-Bottom方向（后端/微服务推荐）
- 全局网格对齐: 20px网格，所有节点严格吸附
- 同层级统一尺寸: 高度60px，宽度120px
- 固定间距: 水平间距80px，垂直间距60px，节点间距≥60px
- 模块位置: 大组件（网关、DB）靠边缘，业务逻辑居中
二、层级划分规则
- 标准五层结构: 接入层 → 路由/控制层 → 逻辑层 → 数据访问层 → 存储/外部层
- 层间隔离: 层与层之间用空白区域隔开，禁止跨层穿插
- 分组框约束: 微服务一个服务一个分组框，分组框内节点不能超出边界
三、节点样式规则
- 形状统一:
- 业务模块: 矩形
- 数据/存储: 圆柱体
- 外部系统: 斜角矩形
- 消息队列: 六边形
- 函数/方法: 圆角矩形
- 颜色体系固定:
- 接入层: 浅蓝 (#ADD8E6)
- 路由/控制层: 浅绿 (#90EE90)
- 逻辑层: 浅黄 (#FFFFE0)
- 数据访问层: 浅紫 (#E6E6FA)
- 存储/外部层: 灰色 (#D3D3D3)
- 字体统一: Arial 12px常规，标题14px，文字居中不换行
四、连线规则
- 箭头样式:
- 数据流: 实心箭头 →
- 调用: 虚线箭头 ⇢
- 依赖: 简单直线
- 正交连线: 只允许水平/垂直，禁止斜线
- 减少交叉: 同层连线走外侧，跨层连线走固定通道
- 标签位置: 连线文字固定在线上方或中间
五、自动美化约束
- 连线交叉数量 ≤ 5处（复杂图智能路由）
- 所有文字完整可见，不被遮挡
- 分组框必须包裹完整模块
- 层与层之间必须有明显空白区
- 不允许孤立节点（除非是独立外部系统）
逻辑架构专属规范
- 视觉区分: 逻辑层元素加虚线边框、虚线箭头，与物理层用灰色虚线关联标注映射
- 分层控制: 每层新增逻辑子层，支持单独显隐
- 命名规范: 逻辑层用业务语言命名，剔除纯技术细节
标准化绘制规范
统一形状库
- 矩形: 业务模块（标名称+路径）
- 圆角矩形: 函数/方法（标名称+参数）
- 圆柱体: 数据/存储（标名称+类型）
- 斜角矩形: 外部系统（标名称+协议）
- 六边形: 消息队列（标名称+主题）
- 菱形: 决策节点
- 箭头: 依赖（标接口名+调用协议）
精准标注
- 元素标识: 唯一标识+路径+更新时间
- 连接标注: 接口名+调用协议
智能组织
- 文件结构: 单项目单文件
- 图层管理: Layers分层管理（物理层/逻辑层）
- 场景分栏: Tabs按场景分栏（总览/详图/时序）
- 版本控制: 支持Git版本控制和协作
自动化同步机制
PR/Commit集成
- 自动标注变更影响模块
- 敏感模块变更告警
- 配套变更日志生成
持续维护
- Git友好，.drawio文件直接纳入版本控制
- 每周自动同步代码变更
- 输出架构-代码一致性报告
多场景交付
- 文档嵌入: PNG/SVG格式（标版本+时间戳）
- 评审会议: PDF格式（带书签导航）
- 团队协作: 在线链接（权限分级管理）
🔧 工具链配置
核心工具集成
- 代码分析: ripgrep、tree、静态代码分析工具
- 图表生成: draw.io CLI、Graphviz
- 环境固化: Docker容器化工具版本
- CI/CD集成: 支持自动化流水线集成
自动化脚本
- 源码扫描脚本
- 架构图生成脚本
- 一致性验证脚本
- 同步更新脚本
核心输出物清单
架构图表
- 五层架构图（.drawio源文件）
- 多格式导出（PNG/SVG/PDF）
分析清单
- 各类依赖关系清单
- 接口契约清单
- 资源映射清单
- 逻辑-物理映射表
使用示例
用户: 为我的GitHub项目生成五层架构图
用户: 分析OpenClaw的接入层到存储层映射
用户: 创建微服务系统的五层架构图和限界上下文图
用户: 生成部署架构图并标注逻辑环境边界
工作流程
- 源码分析: 扫描项目目录，提取物理结构和依赖关系
- 逻辑抽象: 基于业务域和DDD原则创建逻辑层映射
- 图表生成: 按五层模板生成DrawIO架构图（严格遵循排版规范）
- 标注完善: 添加唯一标识、路径、接口协议等元数据
- 多格式输出: 生成PNG/SVG/PDF等多种交付格式
- 同步配置: 设置Git钩子和定期更新机制