Das aktuelle Design von hirse.eu, datly.eu und incomly.eu kommt aus Claude Design. Das Werkzeug erzeugt aus einer Beschreibung fertige, hochauflösende Entwürfe als HTML samt exakten Design-Tokens und einer schriftlichen Übergabe, die ich anschließend selbst in Produktionscode übersetze. Ich bin kein Designer, und genau deshalb ist das für meine Abendprojekte so nützlich.
Was Claude Design liefert
Am Ende steht kein hübsches Bild, sondern eine präzise Vorlage. Für das hirse.eu-Redesign „Freundlich modern” waren das konkret:
- Entwürfe als HTML mit Inline-Styles, also jede Farbe, jeder Abstand und jeder Radius als exakter Wert, nicht als ungefähre Skizze.
- Ein Style Guide mit allen Tokens: warmes Beige
#F7F3ECals Hintergrund, Amber#B8722Cals Akzent, die Schrift Schibsted Grotesk in vier Schnitten, Kartenradien bis 24 Pixel, abgestimmte Schatten und ein vollständiger Dark Mode. - Eine Übergabe-Doku: pro Seite die Komponenten, das Verhalten bei Hover und die Regeln fürs Umbrechen auf dem Handy.
Das ist mehr als Optik. Es ist die Art Spezifikation, die sonst eine Designerin liefert und die ich als Einzelperson zuverlässig umsetzen kann.
Vom Entwurf zum eigenen Code
Wichtig ist, was Claude Design bewusst nicht ist: fertiger Produktionscode. Die Entwürfe sind Referenz, den echten Code baue ich im jeweiligen Stack selbst. Bei hirse.eu heißt das Astro 5 mit Tailwind v4, wo die Design-Tokens direkt als @theme in einer CSS-Datei landen. Beim datly-Redesign war es ein eigenes CSS-Design-System mit Space Grotesk und JetBrains Mono statt Bootstrap, bei incomly Tailwind mit shadcn/ui.
Der entscheidende Punkt: Der Entwurf respektiert meine Randbedingungen. Die Schriften hoste ich selbst statt über ein Google-Fonts-CDN, Icons liegen als Inline-SVG statt über einen Icon-Dienst. So lädt hirse.eu am Ende keine einzige externe Ressource, und das Datenschutzversprechen der Seite bleibt unberührt. Ein Design, das mir Tracking ins Haus holt, wäre für diese Projekte unbrauchbar.
Wo ich entscheide
Wie beim Bauen mit KI gilt auch hier: Der Vorschlag ist der Anfang, nicht das Ergebnis. Ich wähle aus, welche Entwürfe bleiben, passe Tokens an meine Zwänge an und trage die Umsetzung. Claude Design nimmt mir die Reibung zwischen „so soll es aussehen” und einem sauberen Tokensatz, nicht den Geschmack und nicht die Verantwortung.
Was dabei herauskommt
Drei Projekte teilen sich jetzt eine handgemachte, in sich stimmige Optik, die ich ohne dieses Werkzeug so nicht hinbekommen hätte: weder aus dem Stand selbst gezeichnet noch mit dem Standard-Look eines Frameworks von der Stange. Und weil alles auf Tokens beruht, die ich selbst hoste und ändere, gehört das Design am Ende mir.
Wie das live aussieht, siehst du auf hirse.eu selbst und auf der Projektseite. Wenn du Claude Design in deinem eigenen Projekt ausprobierst und wissen willst, wie ich die Tokens in Tailwind übersetzt habe, schreib mir gern über das Kontaktformular.
