Zum Hauptinhalt springen
KI & Engineering•9 Min. Lesezeit

KI-Agenten das Sehen geben: Open-Source-MCP-Server-Architektur und lokales Ollama-Setup

Coding-Agenten sind stark im Text, aber blind für Screenshots, UI-Mockups und Diagramme. Wie das Model Context Protocol (MCP) Sehen in Cursor und Claude Code bringt – mit lokaler Privatsphäre.

#Model Context Protocol#Cursor-Vision-MCP#Claude-Code-Agent#Lokales Ollama-Vision#Vom Screenshot zum Code

Der blinde Fleck von Coding-Agenten: „Ich kann keine Bilder sehen“

Im vergangenen Jahr haben KI-Coding-Umgebungen wie Cursor, Claude Code und Codex die Entwickler-Workflows revolutioniert.

Doch Entwicklerinnen und Entwickler stoßen regelmäßig auf dieses ärgerliche Hindernis:

Du fängst einen subtilen CSS-Rendering-Fehler oder ein visuelles Design-Mockup ein, ziehst den Screenshot in deine Coding-Session – und bekommst diese entmutigende Antwort:

„Ich kann in dieser Terminal-Umgebung keine Bilder sehen. Bitte stelle den Text direkt bereit.“

Sprachmodelle zeigen beeindruckendes Schlussfolgern, doch in entkoppelten Entwickler-CLI-Umgebungen bleiben sie visuell blind.


Die Lösung: Sehen standardisieren mit dem Model Context Protocol (MCP)

Um Integrationsgrenzen zu überwinden, führte Anthropic das Model Context Protocol (MCP) ein – ein universelles Protokoll, vergleichbar mit USB-C für KI-Fähigkeiten.

Wir haben Shadow Vision entwickelt, einen quelloffenen MCP-Vision-Dienst, der speziell für Entwickler-Agenten gebaut ist.

Mit einer einzigen Server-Definition erhält dein Coding-Agent Zugriff auf 6 strukturierte visuelle Werkzeuge:

  1. vision_ocr: Hochpräzise Extraktion von Text und Tabellendaten aus Terminal- und UI-Aufnahmen.
  2. vision_inspect: Visuelle Diagnose zur Erkennung von CSS-Fehlern und Interpretation von Diagrammen.
  3. vision_annotate: Erkennt Entwickler-Markierungen: rote Rahmen, Pfeile und Hervorhebungen.
  4. vision_layout: Zerlegt visuelle Designs in hierarchische Layout-Bäume und Spacing-Tokens.
  5. vision_reconstruct: Die Flaggschiff-Fähigkeit – rekonstruiert visuelle UI-Aufnahmen direkt in saubere React-, HTML- und Tailwind-Code-Entwürfe.
  6. vision_compare: Pixelgenaue visuelle Regressionsprüfung zwischen Iterationen.

Local-First-Datenschutz: austauschbare Backends und Offline-Ollama

Unternehmen können es sich nicht leisten, dass proprietäre Screenshots an Drittanbieter-APIs gelangen.

Shadow Vision setzt auf modulare, austauschbare Backends:

  • Local-First-Datenschutz: Orchestriert nativ lokale Ollama-Instanzen (z. B. Qwen2-VL, LLaVA). Bild-Inferenzen bleiben zu 100 % vor Ort, ohne ausgehende Anfragen.
  • Cloud-Treue: Leitet komplexe Schlussfolgerungen mühelos an Anthropic Claude 3.5 Sonnet oder multimodale APIs von Google Gemini weiter.
  • OpenAI-Kompatibilität: Interoperabel mit LM Studio, vLLM oder proprietären Unternehmens-Gateways.

Konfiguration (Claude Desktop / Cursor):

json
{
  "mcpServers": {
    "shadow-vision": {
      "command": "uv",
      "args": ["run", "shadow-vision"],
      "env": {
        "VISION_BACKEND": "ollama",
        "OLLAMA_MODEL": "qwen2-vl:7b"
      }
    }
  }
}

Wenn KI-Agenten Bildschirme wahrnehmen können, wird Terminal-Interaktion zu echter multimodaler Zusammenarbeit.

Alle Praxisnotizen →