req-fn-app-system-context-diagram

Generate system context diagrams in draw.io format with Markdown documentation.

Updated May 18, 2026

Search Tags:#data flow #requirements #MCP #documentation generation #draw.io #system context diagram #interface mapping

Ready to run

npx skills add https://github.com/ABLER-Digital-Services/ai-guild --skill req-fn-app-system-context-diagram

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: req-fn-app-system-context-diagram
Source: https://github.com/ABLER-Digital-Services/ai-guild/tree/main/skills/req-fn-app-system-context-diagram
Command: npx skills add https://github.com/ABLER-Digital-Services/ai-guild --skill req-fn-app-system-context-diagram

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill solves the problem of turning unclear system relationships into a consistent, reviewable system context diagram that shows external interfaces and data flows.

Core Features & Use Cases

draw.io XML generation: Uses the draw.io MCP to produce a system context diagram from a predefined template while substituting real system names, sub-functions, and arrow labels.
Standardized diagram conventions: Applies layout and color rules (central blue “target system”, gray external systems) to make diagrams comparable and easy to review.
Markdown wrapper creation: Creates a companion Markdown file that links to the generated draw.io file and includes scoped notes and check-ready content.

Quick Start

Ask an AI to create the system context diagram for your target system and include external systems, interface directions (send/receive), and data-type labels using the Skill’s draw.io template and Markdown wrapper.

Frequently Asked Questions about req-fn-app-system-context-diagram

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

FAQPage Schema

How do I generate a system context diagram with draw.io from existing requirements?▼

The Skill generates a system context diagram by using the draw.io MCP to map your requirements into an XML template, substituting real system names and data flows to produce a standardized visual artifact.

What is the standard layout for a system context diagram showing external interfaces?▼

A standard system context diagram uses a central blue target system block surrounded by gray external systems, with labeled arrows representing interface directions and data flows to ensure visual consistency.

How do I document system boundaries and data flows in Markdown?▼

You document system boundaries in Markdown by creating a companion wrapper file that links to the draw.io diagram, recording scoped notes and review-relevant details to contextualize the visual output.

Does the draw.io MCP support automated interface mapping for external systems?▼

Yes, the draw.io MCP supports automated interface mapping by taking your specified external systems, interface directions, and data-type labels to generate the diagram XML directly.

Can I update an existing system boundary diagram without breaking layout conventions?▼

Yes, you can update an existing system boundary diagram while maintaining consistent conventions, as the Skill applies predefined layout and color rules to ensure updated external systems remain comparable.

SSiertsema

context-diagramming

Create Mermaid-compatible system context diagrams with labeled data flows.

Community

Intermediate

markacianfrani

drawio

Generates native draw.io XML diagrams for technical documentation and visual modeling, with optional export to PNG, and SVG/PDF via installed desktop app.

Community

Intermediate