Grundlagen & Einrichtung
Claude Design ist das neue Design-Tool von Anthropic Labs, gestartet am 17. April 2026. Es ist Teil des Claude-Ökosystems und wird von Claude Opus 4.7 betrieben.
Was es macht: Du beschreibst in natürlicher Sprache, was du brauchst – Claude erstellt dir Präsentationen, Prototypen von Webseiten, interaktive Lernseiten oder ganze Design-Systeme. Du bleibst immer im Chat-Dialog, siehst das Ergebnis rechts im Canvas und kannst direkt dort nachschärfen.
Einordnung für Lehrpersonen:
- Canva: Stark für Social-Content und schnelle Poster.
- Figma: Profi-Design-Tool mit hoher Lernkurve.
- Claude Chat (Artefakte): Text + einfache Layouts.
- Claude Design: Design-Layer mit direktem Handoff zu Claude Code – ideal für Lehrpersonen, die regelmässig visuelle Materialien brauchen: Elternabend-Decks, Arbeitsblatt-Layouts, interaktive Lernseiten.
Claude Design ist aktuell Research Preview. Das heisst: funktioniert gut, aber noch nicht bug-frei. Wir zeigen die bekannten Stolperfallen in Tutorial 3.
Claude Design – Cheatsheet (PDF)Welche Abos haben Zugang?
- Pro (USD 20/Monat): ✅
- Max: ✅
- Team: ✅
- Enterprise: standardmässig ausgeschaltet – muss vom Admin in den Organisations-Einstellungen aktiviert werden.
Kosten & Kontingent: Claude Design hat eigenes Metering (Wochen-Kontingent), das nicht auf dein Chat-Limit angerechnet wird. Als Startgeschenk gibt Anthropic einmalig einen Credit für ca. 20 Prompts – gültig bis 17. Juli 2026. Danach: im Abo inklusive, Zusatznutzung zukaufbar.
So kommst du rein: Öffne claude.ai → Sidebar links → Anthropic Labs → Claude Design.
Oberfläche auf einen Blick:
- Chat links: Hier schreibst du deine Briefe und Nachschärfungen.
- Canvas rechts: Hier erscheint das Design live.
- Export-Button oben rechts: PDF, PPTX, Canva, HTML, .zip, oder Handoff zu Claude Code.
- Vier Start-Punkte beim Anlegen eines Projekts: Prototype, Pitch Deck, From Template, Design System (mehr dazu in Tutorial 2).
Das ist der Schritt, den die meisten überspringen – und der dann später schmerzt. Lege zuerst ein Design-System an, bevor du irgendein Projekt startest.
Warum? Ohne Design-System driften deine Assets nach drei Prompts auseinander — jedes neue Projekt sieht anders aus als das vorherige. Mit Design-System erbt jedes Projekt automatisch dein Branding.
Was du dafür brauchst:
- Logo (SVG oder PNG, transparenter Hintergrund ideal)
- Farbcodes: Primärfarbe, Sekundärfarbe, eine Akzentfarbe (Hex-Codes, z.B.
#1A1A1A) - Schriftarten: Eine Headline-Schrift, eine Fliesstext-Schrift (Google-Fonts-Namen reichen)
- Optional: eine bestehende Präsentation (PPTX) oder ein PDF als Referenz für den allgemeinen Stil
So legst du's an: Start-Punkt Design System wählen → Inputs hochladen → Brief schreiben: „Erstelle ein Design-System aus diesem Logo und diesen Farben, mit [Headline-Font] für Überschriften und [Body-Font] für Fliesstext."
Ergebnis: ein wiederverwendbares Referenz-Pack. Bei jedem neuen Projekt hängst du es als Input an, und Claude übernimmt Farben, Typo, Logo-Platzierung automatisch.
Jedes Claude-Design-Projekt folgt derselben Abfolge. Einmal verinnerlicht, wird's Routine:
- Projekt benennen + Typ wählen – einer der vier Start-Punkte: Prototype, Pitch Deck, From Template, Design System.
- Inputs hochladen – Text-Beschreibung plus beliebige Kombination aus: Bildern, DOCX/PPTX/XLSX, Codebase-Referenzen, Web-Captures (bestehende Website als Stil-Inspiration einfangen).
- Brief schreiben – Charlie's Regel: „Specific beats vague." Nenne konkrete Layout-Regionen. Statt „Gestalte einen Flyer" besser: „Einladungs-Flyer fürs Schulfest. Oben: Hero mit Titel und Datum. Mitte: 3 Spalten mit Programm-Punkten. Unten: Anfahrt und Kontakt."
- Refine – Inline-Kommentare, Text direkt ändern, Slider für Feinjustierung (Tutorial 3 Step 1).
- Export – PDF, PPTX, Canva, HTML, .zip, Org-URL – oder Handoff zu Claude Code.
Wireframe-first: Starte bei neuen Projekten immer im Wireframe-Modus (Grauwerte, einfache Formen). Wenn die Struktur stimmt, duplizierst du ins High-Fidelity (Farben, Typo, Bilder). Spart Tokens und Iterations-Zeit.
Quiz
1. Welche Claude-Abos haben Zugang zu Claude Design?
- Nur Enterprise
- Nur das kostenlose Konto
- Pro, Max, Team und Enterprise – bei Enterprise muss der Admin es aktivieren
- Claude Design ist ein separates, eigenständiges Abo
Lösung anzeigen
Richtige Antwort: c) — Claude Design ist in Pro, Max, Team und Enterprise enthalten. Bei Enterprise ist es standardmässig aus und muss vom Admin in den Organisations-Einstellungen aktiviert werden.
2. Was ist der zentrale Rat, bevor du ein Projekt in Claude Design startest?
- Immer mit einem Pitch Deck beginnen, das ist am einfachsten
- Zuerst ein Design-System anlegen, damit alle folgenden Projekte konsistent aussehen
- Immer direkt im High-Fidelity-Modus arbeiten, sonst verliert man Zeit
- Ein Abo-Upgrade auf Max machen, Pro reicht nicht
Lösung anzeigen
Richtige Antwort: b) — Ohne Design-System verändern sich Farben und Stil von Projekt zu Projekt. Einmal angelegt, vererbt das Design-System Branding automatisch an jedes neue Projekt.
3. Welcher Modus wird beim Start eines neuen Prototyp-Projekts empfohlen?
- Direkt High-Fidelity, um das Endergebnis sofort zu sehen
- Wireframe zuerst, dann bei stimmender Struktur duplizieren und in High-Fidelity weiterarbeiten
- Gar nicht zuerst entscheiden – Claude wählt automatisch
- Immer nur Wireframe, High-Fi ist für Profis
Lösung anzeigen
Richtige Antwort: b) — Wireframe-first spart Tokens und Iterations-Zeit. Erst wenn Layout und Struktur passen, lohnt sich der Wechsel zu High-Fidelity mit Farben, Typo und Bildern.