Agent skill

umple-diagram-generator

Generate diagrams (state machines, class diagrams, ER diagrams) from natural language requirements using Umple. Use when user requests: (1) State machine diagrams (2) UML class diagrams (3) ER diagrams, entity-relationship diagrams, or database schema diagrams (4) Diagram generation from text descriptions, (5) Any mention of Umple diagram generation, (6) Visual representation of states, transitions, events, entities, classes, or relationships. Outputs SVG diagrams with organized folder structure.

View SKILL.md on GitHub Repository
Stars 2
Forks 0

Install this agent skill to your Project

npx add-skill https://github.com/umple/umple-skills/tree/main/umple-diagram-generator

SKILL.md

Umple Diagram Generator

Supported diagram types

Type language value Read first
Class diagram classDiagram references/class-diagram-syntax.md
State machine stateDiagram references/state-machine-syntax.md
ER diagram entityRelationshipDiagram references/class-diagram-syntax.md
Trait diagram traitDiagram references/class-diagram-syntax.md

Workflow

  1. Read the syntax reference for the requested diagram type.
  2. Write valid Umple code.
  3. Call the Umple Online API (see below).
  4. Extract SVG from the response and save to a .svg file.
  5. On error, read the message, fix the code, retry (up to 3 times).
  6. Render the SVG inline for the user.

API

Endpoint: POST https://cruise.umple.org/umpleonline/scripts/compiler.php Content-Type: application/x-www-form-urlencoded

Parameter Value
language See table above
languageStyle diagramUpdate
umpleCode The Umple source code
filename model.ump

Use whatever HTTP tool is available (WebFetch, curl, fetch, etc.).

Response parsing

Success: response contains two nested <svg> tags. Extract the inner SVG — the one with a viewBox attribute. Clean up any xlink:href="javascript:..." attributes.

Error: response contains <span class="umple-message-error">. Strip HTML tags to read the error.

Output

  1. State the diagram type.
  2. Show the Umple source in an umple code block.
  3. Render the SVG visually.
  4. Save files: <name>/model.ump and <name>/diagram.svg.

Guardrails

  • Always read the syntax reference before writing Umple code.
  • Prefer a smaller valid model over guessing syntax.
  • One association per class pair — never define the same relationship from both sides.
  • Never use Final as a custom state name — it is a reserved keyword in Umple. Use Done, Completed, etc. instead.

Recommended Agent Skills

Expand your agent's capabilities with these related and highly-rated skills.

umple/umple-skills

umple-code-generator

Generate production-quality code (Java, Python, PHP, Ruby, C++, SQL) from Umple models. Use when user requests: (1) Code generation from UML/class models (2) Java/Python/PHP/Ruby/C++ class generation (3) SQL schema from a domain model (4) Boilerplate-free implementation of classes with associations and state machines (5) Converting a domain model to working code. Produces complete implementations with constructors, getters/setters, association management, and state machine logic.

2 0
Explore
mattpocock/skills

scaffold-exercises

Create exercise directory structures with sections, problems, solutions, and explainers that pass linting. Use when user wants to scaffold exercises, create exercise stubs, or set up a new course section.

111,310 9,758
Explore
mattpocock/skills

setup-pre-commit

Set up Husky pre-commit hooks with lint-staged (Prettier), type checking, and tests in the current repo. Use when user wants to add pre-commit hooks, set up Husky, configure lint-staged, or add commit-time formatting/typechecking/testing.

111,310 9,758
Explore
mattpocock/skills

handoff

Compact the current conversation into a handoff document for another agent to pick up.

111,310 9,758
Explore
mattpocock/skills

edit-article

Edit and improve articles by restructuring sections, improving clarity, and tightening prose. Use when user wants to edit, revise, or improve an article draft.

111,310 9,758
Explore
mattpocock/skills

git-guardrails-claude-code

Set up Claude Code hooks to block dangerous git commands (push, reset --hard, clean, branch -D, etc.) before they execute. Use when user wants to prevent destructive git operations, add git safety hooks, or block git push/reset in Claude Code.

111,310 9,758
Explore

Didn't find tool you were looking for?

Be as detailed as possible for better results