Die vier Bibliotheken hinter Open Design — Skills, Systems, Templates und Craft

Warum sehen die Ergebnisse von Open Design besser aus als die eines typischen KI-Designtools? Weil vier Inhaltsbibliotheken zusammenwirken — und eine davon, Craft, wird kaum je besprochen. Dieser Leitfaden geht alle vier durch. Er folgt dem Walkthrough, den AI Fusion in ihrem Video zeigt, neu geschrieben und auf den aktuellen Release gebracht. Sehen Sie sich das Video oben an oder lesen Sie die schriftliche Fassung weiter.

Die Plugin-Bibliothek: Installieren Sie Skills direkt aus der Registry — inklusive Design-Skills gegen belanglose KI-Ergebnisse.

Was ist Open Design?

Open Design ist die quelloffene, lokal-zuerst arbeitende Alternative zu einem geschlossenen Cloud-Designtool. Es bringt keinen eigenen KI-Agenten mit — es erkennt die Coding-Agenten, die Sie bereits haben (Claude Code, Codex, Cursor, Gemini, OpenCode und mehr), oder Sie bringen Ihren eigenen API-Key mit (Anthropic, OpenAI, Azure, Google Gemini, sogar ein lokales Modell über Ollama). Die Architektur ist sauber: ein Frontend, das mit einem lokalen Daemon spricht, alles in einer lokalen SQLite-Datenbank gespeichert, sodass Ihre Projekte immer da sind, wenn Sie zurückkommen.

Die vier Bibliotheken

1. Skills — die „Wie man es baut“-Ebene

Skills sind nach Modus, Szenario und Plattform organisiert. Jeder ist buchstäblich nur ein Ordner mit einer einzigen Skill-Datei — hineinlegen, den Daemon neu starten, und er erscheint im Picker. Über das Naheliegende hinaus (SaaS-Landingpage, Dashboard, Docs) gibt es beeindruckende: ein Deck im Swiss-International-Stil (16-Spalten-Raster, ein einziger Akzent, festgelegte Layout-Varianten), ein Magazin-Editorial-Deck (Ästhetik aus Tinte und E-Paper) sowie kreative Video-Skills wie Glitch-Titelkarten und Cursor-Lichtspur-Intros.

2. Design-Systeme — die „Wie es aussieht“-Ebene

Jedes Design-System ist eine einzelne Markdown-Datei mit der vollständigen Token-Spezifikation: Farben, Typografie, Abstände, Komponenten, Motion. Apples edler Weißraum, Airbnbs warme, korallfarbene, fotografiegetriebene UI, der Look strukturierter Daten von Airtable, Ant Design für datenintensive Apps — eine große, portable Bibliothek, die jedes Artefakt visuell konsistent hält.

Der Plugins-Hub: die Registry durchsuchen, Plugins importieren und für Ihr Team vorbereiten.

3. Templates — die „Von etwas ausgehen“-Ebene

Sofort forkbare, vollständige Artefakt-Bundles mit bereits enthaltenen Beispieldaten. Forken Sie den Ordner, setzen Sie Ihre Daten ein, veröffentlichen Sie. Denken Sie an ein Magazin-Poster-Template (übergroße Serifen-Überschrift, zweispaltiger Fließtext) oder ein Audio-Jingle-Template, das Musik an Suno/Udio und Sprache an ElevenLabs/MiniMax routet.

4. Craft — die „Warum es hochwertig ist“-Ebene (die kaum besprochene)

Das ist der Teil, den die meisten Reviews überspringen. Craft ist eine Reihe markenunabhängiger Rendering-Prinzipien, die Skills als benötigt deklarieren können, und der Agent lädt die relevanten automatisch in seinen System-Prompt:

• Eine Barrierefreiheits-Baseline, die über das gesetzliche Minimum hinausgeht.
• Animationsdisziplin — wann Bewegung ihren Platz verdient und welche Grenzen sie hat.
• Farbregeln, eine redaktionelle Typografie-Hierarchie für Langtexte und Formularvalidierungsregeln.

Entscheidend ist: Einige werden von einem Linter automatisch durchgesetzt, sodass ein Verstoß als Regression behandelt wird, nicht als Stilvorliebe. Das ist ein großer Grund, warum die Ergebnisqualität höher ist, als man es von einem KI-Designtool erwarten würde — die Standards werden durchgesetzt, nicht bloß vorgeschlagen.

Slide-Deck-Modus: eine Deck-Kategorie wählen und ein Beispiel als Ausgangspunkt forken.

Installieren und ausprobieren

Laden Sie den Installer von open-design.ai/download herunter (macOS/Windows) und starten Sie ihn — aufgeräumte Oberfläche, Chatbereich oben, sofort nutzbare Community-Optionen nach Kategorie (prototype, live artifact, slides, image, video, hyperframes, audio). AI Fusion fügt einen Gemini-API-Key hinzu, testet die Verbindung und forkt dann ein Community-live-artifact (ein Dashboard zum Tracking einer Social-Media-Matrix). Es legt den vollständigen Plan dar und baut anschließend ein responsives Ergebnis, das Sie auf Tablet/Mobil prüfen, umthemen, als Code ansehen und als HTML herunterladen können.

Tipps

• Wählen Sie einen Skill für die Struktur und ein Design-System für den Stil — diese Paarung macht den Großteil der Qualität aus.
• Forken Sie ein Template, wenn Sie von etwas Vollständigem statt von einem leeren Prompt ausgehen möchten.
• Wissen Sie, dass Craft durchgesetzt wird — die Baselines für Barrierefreiheit/Animation/Typografie werden gelintet, nicht optional gehalten.
• Durchstöbern Sie open-design.ai/plugins, um die aktuellen Skills und Systeme zu sehen.
• Jedes Modell funktioniert — die Bibliotheken tragen die Qualität; verbinden Sie, was Sie haben.

FAQ

Was macht die Ergebnisse eigentlich gut? Vier Bibliotheken: Skills (Struktur), Design-Systeme (Stil), Templates (Ausgangspunkte) und Craft (Rendering-Prinzipien, einige davon automatisch von einem Linter durchgesetzt).

Was ist die „Craft“-Ebene? Markenunabhängige Rendering-Regeln (Barrierefreiheit, Animationsdisziplin, Farbe, Typografie, Formularvalidierung), die Skills auswählen und der Agent automatisch lädt — mehrere werden gelintet, sodass Verstöße Regressionen sind.

Lassen sich Skills und Systeme leicht hinzufügen? Ja — Skills sind Ordner mit einer Skill-Datei; Design-Systeme sind einzelne Markdown-Dateien. Hineinlegen, und sie werden erkannt.

Ist es kostenlos und quelloffen? Ja — Apache-2.0, lokal-zuerst. Betreiben Sie es kostenlos; Sie zahlen nur für die Modell-/Media-Nutzung dessen, was Sie verbinden.

---

Dieser schriftliche Leitfaden basiert auf dem Walkthrough von AI Fusion. Sehen Sie sich oben das vollständige Video an und abonnieren Sie AI Fusion für weitere quelloffene KI-Tools.