Menu
生成和编辑 draw.io（diagrams.net）XML 格式的架构图、流程图、时序图、ER 图、类图等，支持创建新图、修改现有图、添加/删除元素，输出可直接在 draw.io 中打开的 .drawio 文件。
Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.
Basé sur la classification professionnelle SOC
| name | drawio-designer |
| description | 生成和编辑 draw.io（diagrams.net）XML 格式的架构图、流程图、时序图、ER 图、类图等，支持创建新图、修改现有图、添加/删除元素，输出可直接在 draw.io 中打开的 .drawio 文件。 |
生成和编辑 draw.io XML 格式的各类技术图表，输出 .drawio 文件可直接在 draw.io 桌面版或 VS Code Draw.io 插件中打开编辑。
使用方式：在聊天中输入 #drawio-designer 并描述你需要的图表内容。
#drawio-designer
帮我画一个订单系统的架构图，包含 Controller、Service、Repository、数据库 四层
#drawio-designer
根据 order-server 的代码结构，生成一个类图
#drawio-designer
画一个订单创建的流程图：用户下单 → 参数校验 → 费用计算 → 创建订单 → 推送消息
#drawio-designer
帮我画一个 ER 图，包含 tb_order、tb_order_fees_record、tb_order_fill_detail 三张表的关系
#drawio-designer
修改 doc/design/order-flow.drawio，在"费用计算"节点后面增加一个"风控检查"节点
#drawio-designer
画一个订单消息处理的时序图：OrderController → OrderService → FeeCalculationService → KafkaProducer
| 图表类型 | 说明 | 适用场景 |
|---|---|---|
| 架构图 | 系统分层、模块关系 | 系统设计、技术方案 |
| 流程图 | 业务流程、审批流程 | 需求分析、流程梳理 |
| 时序图 | 模块间调用时序 | 接口设计、问题排查 |
| ER 图 | 数据库表关系 | 数据库设计 |
| 类图 | 类继承、依赖关系 | 代码设计、重构 |
| 部署图 | 服务部署拓扑 | 运维部署 |
| 思维导图 | 知识梳理、方案对比 | 头脑风暴、文档整理 |
生成的 draw.io XML 必须遵循以下结构：
<mxfile host="app.diagrams.net" modified="2026-04-27T00:00:00.000Z" agent="Kiro" version="24.0.0" type="device">
<diagram id="diagram-id" name="图表名称">
<mxGraphModel dx="1422" dy="762" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
<root>
<mxCell id="0" />
<mxCell id="1" parent="0" />
<!-- 图表元素从这里开始 -->
</root>
</mxGraphModel>
</diagram>
</mxfile>
mxCell 必须有唯一的 idnode-controller、edge-ctrl-to-svc0，第一层 parent 固定为 1<mxCell id="node-1" value="OrderController" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontSize=14;fontStyle=1;" vertex="1" parent="1">
<mxGeometry x="100" y="100" width="200" height="60" as="geometry" />
</mxCell>
<mxCell id="node-db" value="MySQL" style="shape=cylinder3;whiteSpace=wrap;html=1;boundedLbl=1;backgroundOutline=1;size=15;fillColor=#f5f5f5;strokeColor=#666666;fontSize=14;" vertex="1" parent="1">
<mxGeometry x="100" y="400" width="120" height="80" as="geometry" />
</mxCell>
<mxCell id="edge-1" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;exitX=0.5;exitY=1;exitDx=0;exitDy=0;entryX=0.5;entryY=0;entryDx=0;entryDy=0;" edge="1" source="node-1" target="node-2" parent="1">
<mxGeometry relative="1" as="geometry" />
</mxCell>
<mxCell id="edge-2" value="调用" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;" edge="1" source="node-1" target="node-2" parent="1">
<mxGeometry relative="1" as="geometry" />
</mxCell>
| 层级/类型 | 填充色 | 边框色 | 用途 |
|---|---|---|---|
| Controller | #dae8fc | #6c8ebf | 蓝色系，接入层 |
| Service | #d5e8d4 | #82b366 | 绿色系，业务层 |
| Repository/DAO | #fff2cc | #d6b656 | 黄色系，数据层 |
| Database | #f5f5f5 | #666666 | 灰色系，存储 |
| External/RPC | #e1d5e7 | #9673a6 | 紫色系，外部依赖 |
| MQ/Kafka | #f8cecc | #b85450 | 红色系，消息队列 |
| Config/Job | #fff2cc | #d6b656 | 黄色系，配置/任务 |
| 决策/判断 | #fff2cc | #d6b656 | 菱形，流程分支 |
| 开始/结束 | #d5e8d4 | #82b366 | 圆角，流程起止 |
edgeStyle=orthogonalEdgeStyle）<mxCell id="start" value="开始" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#d5e8d4;strokeColor=#82b366;arcSize=50;" vertex="1" parent="1">
<mxGeometry x="200" y="20" width="120" height="40" as="geometry" />
</mxCell>
<mxCell id="decision-1" value="参数校验通过？" style="rhombus;whiteSpace=wrap;html=1;fillColor=#fff2cc;strokeColor=#d6b656;" vertex="1" parent="1">
<mxGeometry x="175" y="160" width="170" height="80" as="geometry" />
</mxCell>
当用户提供现有 .drawio 文件路径时：
.drawio（不是 .xml）doc/design/ 目录下order-flow.drawio、system-architecture.drawio基于 Playwright MCP 的浏览器自动化测试，支持页面交互、录制回放、接口验证、结合后端代码做端到端测试。当用户提到浏览器测试、页面测试、UI测试、录制操作、自动化测试、playwright 时激活。
Use JADX to decompile JAR/APK/DEX/AAR files. Especially good for Android apps. Supports CLI batch decompilation and GUI browsing.
通过 Apache SkyWalking MCP Server 查询和分析应用性能指标，支持服务拓扑、链路追踪（Trace）、日志查询、MQE 指标表达式、告警查询、实例/端点分析等，帮助开发者快速定位性能瓶颈、异常链路和线上问题。当用户提到 skywalking、APM、链路追踪、trace、性能分析、慢接口、拓扑图、服务指标、P99、响应时间、吞吐量、错误率、告警 时激活。
通过 Apache SkyWalking MCP Server 查询和分析应用性能指标，支持服务拓扑、链路追踪（Trace）、日志查询、MQE 指标表达式、告警查询、实例/端点分析等，帮助开发者快速定位性能瓶颈、异常链路和线上问题。当用户提到 skywalking、APM、链路追踪、trace、性能分析、慢接口、拓扑图、服务指标、P99、响应时间、吞吐量、错误率、告警 时激活。
通过 Grafana Loki MCP Server 查询线上/测试环境日志，支持按服务名和关键词搜索、日志量统计、上下文日志获取、服务列表查询等，帮助开发者快速定位线上问题。当用户提到查日志、看日志、log、error、exception、线上报错、排查问题、Loki、Grafana 或具体服务名时激活。
基于 JProfiler 的 Java 性能与内存深度分析 Skill，支持 Heap Snapshot（.jps）、CPU Snapshot、Thread Dump、Allocation Recording 等离线分析，结合 JProfiler 命令行工具链实现自动化诊断，覆盖内存泄漏、CPU 热点、线程瓶颈、数据库慢查询、锁竞争等全方位性能问题。