Die meisten Claude-Nutzer tippen eine Frage, lesen die Antwort und kopieren den Text irgendwo hin. Das reicht für viele Aufgaben. Aber es verschenkt einen erheblichen Teil dessen, was Claude leisten kann.
Artefakte sind Claudes zweiter Ausgabekanal – und ein grundlegend anderer. Während eine Chat-Antwort Text im Gesprächsfenster ist, öffnet ein Artefakt ein separates Panel rechts neben dem Chat: mit eigenem Rendering, direkter Ausführbarkeit im Browser und der Möglichkeit, iterativ weiterzuentwickeln. Ein Artefakt ist kein Dokument zum Lesen. Es ist ein Werkzeug zum Benutzen.
Was ist ein Artefakt – und wann erscheint es?
Claude entscheidet selbst, wann eine Ausgabe als Artefakt sinnvoll ist – aber du kannst es auch explizit anfordern. Als Faustregel gilt: Wenn die Ausgabe eigenständig nutzbar ist oder ausführbaren Code enthält, erscheint sie als Artefakt. Du kannst es bearbeiten lassen, herunterladen oder – bei HTML und React – direkt im Browser ausführen.
Die sechs Artefakt-Typen
HTML: Direkt im Browser gerendert – ohne Download, ohne Installation. Dashboards, Kalkulatoren, Formular-Prototypen, Landing-Page-Entwürfe, einfache Web-Apps. Beispiel-Prompt: „Erstelle ein interaktives HTML-Dashboard für unsere monatliche Sales-Pipeline mit Filtern nach Phase und Region."
React: Vollständige React-Komponenten, direkt im Panel gerendert. Für Produktteams: statt Wireframes entsteht ein klickbarer Prototyp in Minuten. Direkt in bestehende React-Projekte übernehmbar.
SVG: Skalierbare Vektorgrafiken – Diagramme, Infografiken, Flussdiagramme. Verlustfrei vergrößerbar, direkt in Websites einbettbar.
Markdown: Formatierte Dokumente – Berichte, Anleitungen, Checklisten. Klar vom Gespräch getrennt, als Datei herunterladbar.
Code: Ausführbarer Code in beliebigen Sprachen – Python, JavaScript, SQL, Bash, R. Direkt kopierbar oder herunterladbar.
CSV: Strukturierte Tabellendaten, direkt in Excel oder Google Sheets importierbar.
5 konkrete B2B-Anwendungsfälle
Interaktives Reporting ohne BI-Tool: Ein filterbares Sales-Pipeline-Dashboard als HTML-Artefakt – läuft im Browser, keine IT-Abhängigkeit. Monatliche Aktualisierung: neue Daten einfügen, Artefakt neu generieren lassen.
Prototypen für Stakeholder-Meetings: Ein klickbarer Low-Fidelity-Prototyp als React-Artefakt in 20 Minuten – statt zwei Tagen Figma-Arbeit. Live im Meeting iterieren.
Prozessdiagramme: Onboarding-Ablauf im Chat beschreiben, Claude erstellt daraus ein SVG-Flussdiagramm, direkt in Confluence einbettbar. Keine Visio-Lizenz nötig.
Kalkulations-Tools: Angebotsrechner für Lizenzmodelle als HTML-Artefakt – Eingabefelder für Nutzeranzahl, Laufzeit, Rabattstufe, Ausgabe als formatiertes Angebot.
Freitext-Feedback strukturieren: 50 Kunden-Feedbacks als Block eingeben, Claude extrahiert Thema, Sentiment und Produktbereich – als CSV direkt für die CRM-Analyse.
Iteratives Arbeiten: Artefakte schrittweise entwickeln
Ein Artefakt ist kein einmaliger KI-Output, sondern ein lebendes Objekt. Claude behält den Stand über mehrere Nachrichten bei. Typische Sequenz: Grundstruktur erstellen → Details verfeinern → Funktionen ergänzen. Jeder Schritt aktualisiert das Artefakt im Panel.
Was Artefakte nicht können
Artefakte laufen in einer isolierten Browser-Sandbox: kein Zugriff auf externe APIs, keine dauerhaften Daten, kein Live-System. Komplexe Webanwendungen mit Backend gehören zu Claude Code. Und: Artefakte werden nicht dauerhaft gespeichert, wenn sie nicht in ein Projekt hochgeladen werden – wichtige Artefakte immer herunterladen.
Artefakte und Projekte zusammen
Wenn du Artefakte innerhalb eines Projekts erstellst, kennt Claude von Anfang an deinen Styleguide und deine Designvorgaben. Ein Redaktions-Projekt mit Markenfarben in den Systemanweisungen produziert HTML-Artefakte, die von Anfang an zum Corporate Design passen. Den Einstieg in Projekte erklärt Claude Projekte erstellen und nutzen.
