diagram-export

Create, validate, and export architecture, workflow, and sequence diagrams with visual QA.

Updated Dec 1, 2025
One-click install
npx skills add https://github.com/jterratsdev/smart-deployment --skill diagram-export-jterratsdev
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: diagram-export
Source: https://github.com/jterratsdev/smart-deployment/tree/main/skills/diagram-export
Command: npx skills add https://github.com/jterratsdev/smart-deployment --skill diagram-export-jterratsdev

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Producing architecture, workflow, and sequence diagrams that are structurally correct, visually clean, and faithful to source references is error-prone, especially when recreating existing diagrams or validating Mermaid output before delivery. ## Core Features & Use Cases - Diagram Classification and Planning: Classifies each task as semantic, inspired-by-reference, or recreation, and builds a diagram contract covering nodes, groups, relationships, and connector endpoints before drawing. - Visual QA and Layout Reflow: Runs post-render checks for container sizing, text fit, connector anchors, label separation, z-order, and crossing aesthetics, with global reflow after every correction. - Mermaid Lint Validation: Validates Mermaid files with orchestra diagrams lint and attaches lint evidence to workflow tasks. - Use Case: An architect recreating a draw.io system diagram inventories every source element, renders the diagram, runs a pixel-fidelity QA pass against the reference, and delivers the editable source plus render with QA evidence. ## Quick Start Ask the assistant to create a Mermaid sequence diagram for your service authentication flow and lint it before sharing.

Frequently Asked Questions about diagram-export

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create an architecture diagram with Mermaid?

Define a diagram contract first covering purpose, node inventory, groups, relationships, and connector endpoints, then draft the Mermaid diagram and validate it with orchestra diagrams lint. Run a post-render visual QA pass to confirm text fit, connector anchors, and label placement before delivery.

How do I validate a Mermaid diagram before sharing it?

Run orchestra diagrams lint --file <diagram.mmd> for lint-only validation of Mermaid files. To attach evidence to a workflow task, add the --task <task-id> flag, and if mmdc is missing, follow the reported install guidance.

Can Mermaid recreate a draw.io diagram pixel-perfectly?

No. Mermaid outputs are accepted as semantic diagrams but not as pixel-perfect recreations when exact layout, connectors, icons, rotations, or reference styling are acceptance criteria. Those cases should be escalated to draw.io XML or Lucid.

What diagram type should I use for service API interactions?

Use a sequence diagram for service, API, or message exchange scenarios. Flowcharts or state diagrams fit user and business workflows, while C4 or component diagrams suit architecture boundaries and component ownership.

Why do diagram connectors overlap containers or labels?

Overlaps happen when connector routes, anchors, or container sizes are not re-evaluated after content changes. Fix them by adding bend points, growing parent containers, repositioning children, and rerunning a global layout reflow across the whole canvas.