Open Design: Gratis Design-Workspace für Claude Code

Claude Code baut Dir auf Zuruf eine Landing Page, ein Dashboard oder ein komplettes Pitch-Deck, doch im Terminal bleibst Du dabei blind: Du bekommst HTML-Dateien auf die Festplatte und musst sie selbst im Browser öffnen, vergleichen und nachbessern. Open Design löst genau dieses Problem. Das Open-Source-Projekt spannt Deinen vorhandenen Coding-Agent als Design-Engine ein und packt eine Desktop-App mit Live-Vorschau, fertigen Design-Systemen und Export nach PDF, PPTX und MP4 darum. Hier liest Du, was Open Design kann, wie Du es mit Claude Code verbindest und wo die ehrlichen Grenzen im Vergleich zum puren Terminal-Workflow liegen.

Was ist Open Design?

Open Design ist eine lokale Desktop-App für macOS, Windows und Linux, die sich selbst als „Vibe Design Workspace” bezeichnet und unter der Apache-2.0-Lizenz steht. Auf GitHub hat das Projekt über 75.000 Sterne gesammelt und wird in kurzen Abständen weiterentwickelt, aktuell ist Version 0.13 vom Juli 2026. Der Clou: Open Design bringt selbst kein KI-Modell mit. Es erkennt stattdessen die Coding-Agent-CLIs, die Du ohnehin installiert hast, neben Claude Code auch Codex, Cursor, Gemini CLI und mehr als 20 weitere, und lässt sie die eigentliche Arbeit machen. Du zahlst also nichts extra, sondern nutzt Dein bestehendes Abo oder Deinen API-Key weiter.

In der App wählst Du einen Skill (etwa web-prototype für Klick-Prototypen), dazu ein Design-System und schreibst dann einfach, was Du haben willst. Der Agent streamt seine Antwort, Open Design parst die Artefakte heraus und rendert sie sofort in der Vorschau. Herzstück ist dabei die Datei DESIGN.md: Sie beschreibt in einem festen Schema Farben, Typografie, Abstände und Tonalität Deiner Marke, und jeder Render liest sie mit. Mehr als 140 vorbereitete Design-Systeme bekannter Marken von Linear über Stripe bis Apple liegen bei, ebenso weit über 100 fertige Skills für Prototypen, Dashboards, Präsentationen, Bilder und sogar Motion-Graphics-Videos, die über die HyperFrames-Funktion aus HTML echte MP4-Dateien rendern.

Alternative zu Claude Design, Aufsatz für Claude Code

Ein Missverständnis lohnt sich vorab auszuräumen: Open Design ist kein Konkurrent von Claude Code, sondern setzt darauf auf. Der eigentliche Gegenspieler ist Claude Design, Anthropics eigenes Design-Tool, das seit April 2026 als Research Preview für Pro-, Max-, Team- und Enterprise-Abos läuft. Claude Design ist ein reines Cloud-Produkt: Deine Entwürfe, Marken-Assets und Quelldokumente liegen bei Anthropic, und das Tool funktioniert ausschließlich mit Claude-Modellen. Open Design bildet denselben Workflow lokal nach, speichert alles als echte Dateien auf Deiner Platte und ist beim Modell nicht festgelegt. Gerade nach der Fable-5-Sperre ist das ein Argument, das man nicht mehr wegwischen kann: Wenn ein Anbieter ausfällt, wechselst Du in Open Design einfach die Engine, statt Deine Design-Pipeline zu verlieren.

Open Design installieren und mit Claude Code verbinden

Voraussetzung ist ein funktionierendes Claude Code auf Deinem Rechner. Falls das noch fehlt, führt Dich die Anleitung: Claude Code auf dem Mac installieren & nutzen durch die Einrichtung. Danach lädst Du die Desktop-App als fertiges Paket für macOS (Apple Silicon und Intel) oder Windows von den offiziellen GitHub-Releases herunter und installierst sie wie jede andere App; für Linux gibt es ein AppImage. Beim ersten Start scannt Open Design Deinen PATH nach Agent-CLIs und listet alles auf, was es gefunden hat. Taucht Claude Code dort auf, bist Du startklar und kannst direkt den ersten Prototypen prompten.

Wenn Du zusätzlich aus dem Terminal heraus arbeiten willst, registrierst Du Open Design mit dem mitgelieferten Kommando als MCP-Server in Claude Code:

od mcp install claude

Danach kann Claude Code selbst Artefakte an den Workspace übergeben, etwa wenn Du mitten in einer Coding-Session eine Vorschau oder einen PPTX-Export brauchst. Für Server-Fans existiert daneben eine Docker-Variante, die den Workspace unter http://localhost:7456 bereitstellt, für den Einstieg ist die Desktop-App aber der einfachere Weg.

Was Open Design besser macht als pures Claude Code

Der größte Gewinn ist die Sichtbarkeit. Statt HTML-Dateien blind zu erzeugen und im Browser-Tab-Chaos zu vergleichen, siehst Du jede Iteration sofort in der eingebauten Vorschau und promptest gezielt nach. Dazu kommen drei handfeste Vorteile:

• Konsistenz per DESIGN.md: Einmal definiert, hält sich jeder Entwurf an Deine Farben, Schriften und Abstände. Mit purem Claude Code musst Du diese Vorgaben in jedem Prompt oder einer eigenen CLAUDE.md mitschleppen und hoffen, dass sie greifen.
• Fertige Exporte: PDF, PPTX, MP4 und ZIP fallen als echte Dateien heraus. Eine Präsentation aus Claude Code heraus in ein sauberes PPTX zu bekommen, ist dagegen Handarbeit mit Zusatz-Tools.
• Modellfreiheit: Läuft Dein Anthropic-Kontingent leer oder fällt ein Modell aus, wechselst Du per Klick auf Codex, Gemini oder eine andere installierte CLI, ohne den Workflow zu ändern.

Dass die Skills und Design-Systeme als offene Markdown- und Konfigurationsdateien vorliegen, macht das Ganze zudem anpassbar: Du kannst eigene Skills schreiben oder bestehende auf Deine Marke umbiegen, genau wie Du es von Claude-Code-Skills kennst.

Wo pures Claude Code die Nase vorn hat

Ehrlich bleiben muss der Vergleich trotzdem. Open Design ist auf Design-Artefakte spezialisiert, also HTML-Prototypen, Slides, Bilder und Videos. Sobald es um echte Softwareentwicklung geht, um Refactorings, Tests, Git-Workflows und Deployments, bleibt Claude Code im Terminal das richtige Werkzeug, und Open Design will das auch gar nicht ersetzen. Außerdem gilt:

• Mehr Ballast: Die Electron-App mit Next.js-Frontend und lokalem Daemon ist deutlich schwergewichtiger als ein Terminalfenster. Auf einem älteren Rechner spürst Du das.
• Junges Projekt: Version 0.x heißt, dass sich Bedienung und Dateiformate zwischen Releases noch spürbar ändern können. Wer maximale Stabilität braucht, wartet besser auf eine 1.0.
• Kein Figma-Ersatz: Die Artefakte sind HTML-basiert. Pixelgenaue Layout-Arbeit, gemeinsames Editieren im Team und echte Designdateien bekommst Du hier nicht.
• Tokens kosten weiter: Open Design ist gratis, die Modell-Nutzung dahinter nicht. Jede Iteration läuft über Dein Claude-Code-Kontingent oder Deinen API-Key.

Open Design und Claude Code im direkten Vergleich

Fazit: Für wen lohnt sich was?

Wenn Du mit Claude Code regelmäßig visuelle Dinge baust, also Landing Pages, Klick-Prototypen, Dashboards oder Präsentationen, ist Open Design ein echter Gewinn: Du siehst sofort, was entsteht, bleibst automatisch im eigenen Markendesign und bekommst Exportformate, die Du direkt weitergeben kannst. Als lokale, modell-offene Alternative zu Anthropics Cloud-Tool Claude Design ist es zudem die deutlich souveränere Wahl. Wer Claude Code dagegen fast nur zum Programmieren nutzt, braucht den zusätzlichen Workspace nicht und fährt mit dem schlanken Terminal weiter am besten. Einen kleinen Vorgeschmack, wie sich Claude Code um visuelle Aufgaben erweitern lässt, gibt Dir auch die Anleitung: Bilder in Claude Code generieren mit FLUX. Und falls Dir das Thema Unabhängigkeit von einzelnen Anbietern unter den Nägeln brennt, zeigt Dir Odysseus: Eigener KI-Workspace mit lokalen Modellen, wie Du gleich den ganzen KI-Stack auf die eigene Hardware holst.