make-diagram
This skill contains shell command directives (!`command`) that may execute system commands. Review carefully before installing.
make-diagram
You write one JSON file, diagram.json: a title, a type, nodes with edges (or participants with messages), and usually one or two stories: named chapters of beats, each beat one hop along an edge with a title and a caption. Scripts lay it out with ELK, check the geometry and build one offline HTML page with a story player, an Explore panel and full screen. You never write coordinates, CSS, SVG or HTML.
Run every command from the project folder (where diagram.json lives), using the full path to the scripts. If the request is empty, ask what to draw.
Run every step yourself (or hand off as the Cheaper model section says), in this same turn. Do not end your reply after showing the JSON: keep going until validate prints valid and the HTML exists.
Cheaper model
Skip this section if you are running in Claude Code (it already runs this skill on the model named in the frontmatter), or if artifact-builder is not in your list of available agents. Otherwise, if you can start another agent, start the artifact-builder agent to do the work, unless you are already artifact-builder. If you are already artifact-builder, skip the rest of this section and do the work yourself.
Give it a self-contained brief. It has no memory of this conversation, so the brief must say:
- What to build, and every fact and choice from this conversation that affects it (data, names, wording, theme, what the user asked for and what they ruled out).
- This skill directory: the full path of the folder that holds this SKILL.md.
- The spec path: where it should write the JSON spec.
- Optionally, an output folder for the build (it passes this to the build script as
--out).