Drawio Reconstruction
Reconstructs reference images into high-fidelity, editable Draw.io files with rendered...
Install
npx skills add HKUSTDial/Supervisor-Skills --skill drawio-reconstruction -g -a claude-code -y- Repository
- HKUSTDial/Supervisor-Skills11.3k
- Category
- Design
- Updated
- 20d ago
- License
- See repository
- Context cost
- Mediumabout 3,000 tokens
- Runs scripts
- Yes, review before use
What it does
Reconstructs reference images into high-fidelity, editable Draw.io files with rendered previews: native Draw.io elements carry text and structure, SVG covers simple icons that match the reference, and cropped or transparent PNGs preserve complex visuals. Use when the user wants a diagram image, research figure, architecture diagram, slide, UI screenshot, or image folder turned into `.drawio` XML; batch requests use a manifest with bounded parallelism when available and a full-fidelity serial fallback otherwise.
Draw.io Reconstruction
Use this skill for high-quality reconstruction of diagram images into .drawio files.
Helper Script Location
Resolve SKILL_DIR to the absolute directory containing this SKILL.md before running any bundled helper. Use the resolved skill location provided by the runtime; never assume the skill is installed under ~/.codex, ~/.agents, or any other fixed directory.
All commands below use $SKILL_DIR to mean that resolved absolute directory.
Fidelity Contract
The primary goal is visual fidelity to the reference image. Editability is secondary.
Do not treat semantic equivalence as success. A generic icon, generic curve, generic font size, approximate panel, or approximate background is a defect when the reference has a specific visual style.
Script checks only prove technical validity. A diagram is not complete merely because .drawio opens, exports, or passes check_drawio.py / batch_verify.py. Completion requires visual comparison against the reference at full size.
Work only in the target directory or target files named by the user. Do not repair, overwrite, or improve neighboring diagrams because they look related. If the requested target is ambiguous, inspect and report the ambiguity before editing.
Never silently rewrite the user's content. If the user asks for larger fonts or a more professional PPT style, first distinguish:
- Layout-only refinement: increase font size, resize boxes, improve spacing, align elements, adjust line breaks without changing words.
- Content compression: shorten sentences, remove details, rewrite labels. Ask permission before doing this.
Batch Folder Workflow
Use this workflow when the user provides a directory of images or asks for batch reconstruction.
Batch Intent And Scheduling
Before opening images for detailed visual analysis, decide whether the request is a batch reconstruction task:
