Draw.io Diagram Generation

Problem

Hand-writing draw.io XML often breaks on small structural details: non-sequential mxCell IDs, ERD relationship arrows attached to table containers instead of row cells, missing class attribute/method dividers, incomplete sequence lifelines or activation boxes, and invalid line breaks in value attributes. This skill turns diagram requests into deliverable outputs through a repeatable workflow.

Workflow and Boundaries

• Detect the diagram type first: ERD, UML class diagram, sequence diagram, flowchart, or architecture diagram.
• Plan entities, relationships, participants, lifelines, and steps before writing XML.
• Apply type-specific templates: ERD uses table / tableRow, class diagrams use attribute blocks, divider lines, and method blocks, while sequence diagrams use lifelines, activation boxes, and arrow styles.
• Save to ./diagrams/.drawio after checking IDs, row heights, connection targets, and tag closure.
• Export PNG first, then ask whether .drawio, SVG, PDF, or all formats are needed.

It fits database ERDs, class structures, interaction sequences, process flows, and system overviews. Animated visuals, pixel-level design, or non-native draw.io shapes still require manual refinement.