KI-Integration (MCP-Server)

Diagrammix enthält einen integrierten MCP-Server (Model Context Protocol), der KI-Assistenten wie Claude und Codex ermöglicht, Ihre Diagramme direkt zu lesen und zu bearbeiten. Beschreiben Sie in natürlicher Sprache, was Sie benötigen, und die KI platziert Symbole, Verbindungslinien und Layouts auf dem Canvas für Sie.

Was kann die KI?

  • Diagramme aus einer Beschreibung erstellen — fragen Sie nach einem Flussdiagramm, einer Netzwerktopologie oder einem Organigramm und erhalten Sie es sofort auf dem Canvas
  • Mindmaps erstellen — beschreiben Sie ein Thema und erhalten Sie eine strukturierte Mindmap
  • Ihr Dokument lesen — die KI sieht Ihre aktuellen Formen, Verbindungslinien, Ebenen und Stile
  • Vorhandene Elemente ändern — Text, Farben, Positionen oder Verbindungslinienrouting aktualisieren
  • Stapeloperationen — ganze Diagramme mit Symbolen und Verbindungslinien in einem Schritt erstellen
  • Auto-Layout und Ausrichtung — Elemente mit natürlichsprachlichen Befehlen organisieren
  • Ein Aussehen aus einem Bild replizieren — geben Sie der KI ein Referenzbild, und sie erstellt eine passende benutzerdefinierte Vorlage und einen passenden Stil
  • Exportieren — SVG-Ausgabe auf Abruf erzeugen

Voraussetzungen

  • Diagrammix PRO (Einmalkauf)
  • Diagrammix muss mit aktiviertem MCP-Server laufen
  • Mindestens ein Diagrammdokument muss geöffnet sein
  • KI-Client und Diagrammix müssen auf demselben Rechner sein (localhost)

Es werden kein Node.js, npx oder mcp-remote benötigt — Diagrammix enthält einen nativen Helfer für Clients, die einen solchen erfordern.

Einrichtung

1. MCP-Server aktivieren

  1. Öffnen Sie Diagrammix
  2. Gehen Sie zu Diagrammix → Einstellungen (oder drücken Sie Cmd+,)
  3. Wechseln Sie zum Tab KI-Integration
  4. Schalten Sie KI-Integration aktivieren (MCP-Server) ein

Der Server startet unter http://localhost:8420/mcp.

2. Claude Desktop konfigurieren

Claude Desktop verbindet sich über stdio. Diagrammix liefert einen nativen stdio-Helfer im App-Bundle mit, sodass kein Node.js, npx oder mcp-remote erforderlich ist.

  1. Klicken Sie auf Konfiguration kopieren in den Diagrammix-Einstellungen — dadurch wird der genaue Pfad zum mitgelieferten Helfer für Ihre Installation eingetragen
  2. Öffnen Sie die Claude Desktop-Konfigurationsdatei: ~/Library/Application Support/Claude/claude_desktop_config.json
  3. Fügen Sie die Konfiguration ein. Sie sieht so aus — der command-Pfad verweist auf den Helfer innerhalb des Ordners, in dem Diagrammix.app installiert ist:
{
  "mcpServers": {
    "diagrammix": {
      "command": "/Applications/Diagrammix.app/Contents/MacOS/diagrammix-mcp-stdio",
      "args": ["--url", "http://localhost:8420/mcp"]
    }
  }
}

Hinweis: Verwenden Sie Konfiguration kopieren, anstatt den Pfad von Hand einzugeben — er verweist auf den Helfer innerhalb Ihres tatsächlichen App-Bundles, das Diagrammix signiert und aktuell hält.

  1. Starten Sie Claude Desktop neu. Diagrammix-Werkzeuge erscheinen im Chat.

3. Claude Code (CLI) konfigurieren

Fügen Sie zur .mcp.json Ihres Projekts oder global in ~/.claude/mcp.json hinzu:

{
  "mcpServers": {
    "diagrammix": {
      "type": "url",
      "url": "http://localhost:8420/mcp"
    }
  }
}

Claude Code unterstützt Streamable HTTP nativ — keine Brücke erforderlich.

4. Codex konfigurieren

Codex (App, CLI und IDE-Erweiterung teilen sich eine MCP-Konfiguration) verbindet sich über Streamable HTTP. Konfigurieren Sie es auf eine der beiden Arten:

Option A — config.toml. Klicken Sie auf Konfiguration kopieren im Codex-Bereich der Diagrammix-Einstellungen und fügen Sie sie in ~/.codex/config.toml ein:

[mcp_servers.diagrammix]
url = "http://localhost:8420/mcp"
enabled = true
default_tools_approval_mode = "prompt"
startup_timeout_sec = 20
tool_timeout_sec = 60

Option B — CLI. Klicken Sie auf Befehl kopieren in den Diagrammix-Einstellungen oder führen Sie aus:

codex mcp add diagrammix --url http://localhost:8420/mcp

5. Andere MCP-Clients

Jeder MCP-kompatible Client kann sich verbinden über:

  • Transport: Streamable HTTP
  • Endpunkt: http://localhost:8420/mcp
  • Protokoll: JSON-RPC 2.0 über HTTP POST

Hinweis: ChatGPT Desktop erfordert HTTPS und unterstützt keine direkten localhost-Verbindungen.

Anwendungsbeispiele

Ein Flussdiagramm erstellen

„Erstelle ein Flussdiagramm mit Start, Entscheidung, Prozess A, Prozess B und Ende. Verbinde Start mit Entscheidung, Entscheidung mit Prozess A (Ja) und Prozess B (Nein), und beide Prozesse mit Ende."

Die KI verwendet batch_create, um alle Symbole und Verbindungslinien in einem einzigen Rückgängig-Schritt zu platzieren.

Vorhandenes Diagramm ändern

„Ändere die Füllfarbe aller Rechtecke zu Blau und mache den Text fett."

Die KI liest Ihre Elemente mit get_elements und aktualisiert dann jedes mit update_element.

Auto-Layout

„Wende ein Layout von oben nach unten mit 60px Abstand zwischen den Zeilen an."

Die KI ruft apply_layout mit Ihrer bevorzugten Richtung und Abstand auf.

Ein Aussehen aus einem Bild replizieren

„Hier ist ein Screenshot des Diagrammstils unserer Marke. Reproduziere diese Formen und Farben als benutzerdefinierte Vorlage und einen Stil, den ich wiederverwenden kann."

Geben Sie dem Assistenten ein Referenzbild, und er kann passende SVG-Formen und Pfeilspitzen generieren, sie zu einer benutzerdefinierten Vorlage zusammenstellen und einen passenden benutzerdefinierten Stil definieren. Es werden Werkzeuge wie create_custom_template, add_custom_shape, add_custom_arrowhead und create_style verwendet, sodass das Ergebnis ein wiederverwendbares Paket ist — keine einmalige Zeichnung.

Tipps

  • Beginnen Sie mit einer Beschreibung — je genauer Sie sind, desto besser das Ergebnis
  • Iterieren Sie — bitten Sie die KI, Farben, Beschriftungen oder das Layout nach der ersten Erstellung anzupassen
  • Rückgängig machen — alle KI-Änderungen unterstützen Cmd+Z
  • Notationssymbole verwenden — bitten Sie die KI, bestimmte Notationspakete für einheitliche Gestaltung zu verwenden
  • Stapelverarbeitung ist besser — für neue Diagramme erstellt die KI alles in einem Schritt, sodass Rückgängig das Gesamte zurücksetzt