Claude 101
← Alle Lektionen
Lektion 06Claude 101

Erstellen mit Artifacts

Zusammenfassung (Audio)

Gesprochene Zusammenfassung — drücke auf Play zum Mitlesen: die gesprochene Zeile bleibt oben.

Studiennotizen

Geschätzte Zeit: 20 Minuten

Lernziele

Am Ende dieser Lektion können Sie:

  • Erklären, was Artifacts sind und wann Claude sie erstellt
  • Artifacts mit Kollegen teilen und öffentlich veröffentlichen
  • Häufige Artifact-Probleme beheben

Was sind Artifacts?

Artifacts sind eigenständige, interaktive Ausgaben, die Claude in einem dedizierten Fenster neben Ihrer Konversation erstellt. Anstatt einen langen Codeblock oder Text in der Chat vergraben zu sehen, sehen Sie Ihren Inhalt gerendert und einsatzbereit – ob das eine funktionierende Website, ein interaktives Diagramm oder ein Dokument ist, das Sie sofort herunterladen können.

Claude erstellt automatisch ein Artifact, wenn Inhalte bestimmte Kriterien erfüllen:

  • Es ist bedeutsam und in sich geschlossen, typischerweise über 15 Zeilen
  • Es ist etwas, das Sie wahrscheinlich bearbeiten, iterieren oder wiederverwenden möchten
  • Es stellt komplexe Inhalte dar, die eigenständig funktionieren, ohne die umgebende Konversation zu benötigen
  • Es ist Inhalt, auf den Sie später verweisen oder den Sie verwenden möchten

Häufige Artifact-Typen

Claude kann verschiedene Arten von Artifacts erstellen, die jeweils für unterschiedliche Anforderungen geeignet sind:

  • Dokumente (einschließlich Markdown, Klartext, Word-Dokumente, PDFs, PowerPoint und Excel): Ideal für alles Textlastige, das Sie exportieren oder weiter bearbeiten möchten – wie Besprechungsnotizen, Berichte, Projektpläne, Blog-Beiträge und andere schriftliche Inhalte.
  • Code-Snippets: Funktionierender Code in jeder Programmiersprache – Python, JavaScript, C++ und mehr. Sie können den Code anzeigen, kopieren oder herunterladen, um ihn in Ihren eigenen Projekten zu verwenden.
  • HTML-Seiten: Vollständige Webseiten mit HTML, CSS und JavaScript in einer einzigen Datei. Perfekt für Landing Pages, Formulare, interaktive Demos oder schnelle Prototypen.
  • SVG-Bilder: Skalierbare Vektorgrafiken für Logos, Symbole, Illustrationen und andere visuelle Elemente. Diese werden direkt im Artifact-Fenster gerendert, sodass Sie genau sehen, was Sie bekommen.
  • Mermaid-Diagramme: Flowcharts, Sequenzdiagramme, Gantt-Diagramme, Organigramme und mehr. Beschreiben Sie die Beziehungen, die Sie visualisieren möchten, und Claude erstellt ein Diagramm, das Sie verfeinern können.
  • React-Komponenten: Interaktive UI-Elemente mit echter Funktionalität – Rechner, Dashboards, Spiele, Datenvisualisierungen. Dies sind keine bloßen Mockups; sie enthalten tatsächliche Logik und reagieren auf Benutzereingaben.

Erstellen Sie Ihr erstes Artifact

Ein Artifact zu erstellen ist so einfach wie eine Konversation. Beschreiben Sie einfach, was Sie möchten, und Claude bestimmt, ob es als Artifact präsentiert werden soll.

Sie könnten zum Beispiel sagen:

  • "Erstelle ein Flowchart, das unseren Kundenonboarding-Prozess zeigt (Hinweis: Claude kann jetzt visuelle Diagramme wie Flowcharts als HTML mit Imagine generieren, zusätzlich zu codebasierten Artifacts. )"
  • "Baue ein interaktives Dashboard, mit dem ich monatliche Ausgaben eingeben und eine Aufschlüsselung sehen kann"
  • "Gestalte eine Landing Page für eine Produktivitäts-App mit einem Hero-Bereich und einer Feature-Liste"
  • "Schreibe eine Projektbrief-Vorlage, die ich für neue Initiativen wiederverwenden kann"

Wenn Claude nicht automatisch ein Artifact erstellt, wenn Sie eines erwarten, können Sie explizit fragen: "Erstelle dies als Artifact" oder "Zeige mir dies in einem Artifact. "

Wenn Claude ein Artifact generiert, erscheint es in einem dedizierten Fenster rechts neben Ihrer Konversation. Von hier aus können Sie:

  • Verschiedene Formate anzeigen: Zwischen einer Vorschau (wie es aussieht) und dem zugrunde liegenden Code wechseln
  • Inhalte kopieren: Klicken Sie auf das Kopiersymbol, um den Inhalt zur Verwendung an anderer Stelle zu erfassen
  • Dateien herunterladen: Speichern Sie das Artifact als Datei auf Ihrem Computer
  • Code anzeigen: Sehen Sie genau, was Claude unter der Haube generiert hat

Sharing und Veröffentlichung von Artifacts

Sobald Sie etwas Nützliches erstellt haben, haben Sie mehrere Optionen zum Teilen.

Kopieren oder herunterladen: Für persönliche Nutzung oder Teilen über andere Kanäle verwenden Sie die Schaltflächen zum Kopieren oder Herunterladen in der unteren rechten Ecke des Artifact-Fensters.

Teilen innerhalb Ihrer Organisation (Claude for Work): Team- und Enterprise-Benutzer können Artifacts intern mit Kollegen teilen. Das geteilte Artifact bleibt innerhalb Ihrer Organisation und erfordert Team-Authentifizierung für den Zugriff.

Öffentlich veröffentlichen: Für kostenlose, Pro- und Max-Benutzer können Sie Artifacts veröffentlichen, um sie für jeden mit dem Link zugänglich zu machen. Wenn Sie veröffentlichen:

  • Nur die ausgewählte Version wird öffentlich (Ihre Chat bleibt privat)
  • Jeder kann das Artifact ohne Claude-Konto anzeigen und damit interagieren
  • Andere können Ihr Artifact „remixen" – es in ihrer eigenen Claude-Konversation öffnen, um es zu ändern und darauf aufzubauen

Um zu veröffentlichen, klicken Sie auf die Schaltfläche „Teilen" oder „Veröffentlichen" in der oberen rechten Ecke des Artifacts. Sie können die Veröffentlichung jederzeit rückgängig machen, indem Sie zu diesem Artifact zurückkehren und den öffentlichen Zugriff entfernen. Hinweis: Wenn Sie ein Artifact veröffentlichen, ist es über seinen Link öffentlich zugänglich – jeder kann es anzeigen, auch ohne Claude-Konto. Veröffentlichte Artifacts werden nicht von Suchmaschinen indexiert, daher erscheinen sie nicht in Google-Ergebnissen.

Tipps, um das Beste aus Artifacts herauszuholen

**Seien Sie spezifisch, was Sie möchten. ** „Baue einen Budget-Tracker" ist gut, aber „Baue einen monatlichen Budget-Tracker, bei dem ich Ausgaben nach Kategorie eingeben kann, eine Kreisdiagramm-Aufschlüsselung sehe und eine Warnung erhalte, wenn ich über Budget bin" ist besser.

**Beschreiben Sie den Endbenutzer. ** Claude zu sagen, wer das Artifact verwenden wird, hilft ihm, angemessene Designentscheidungen zu treffen. „Dieses Flowchart ist für neue Mitarbeiter" führt zu anderen Ergebnissen als „Dieses Flowchart ist für das Engineering-Team. "

**Iterieren Sie schrittweise. ** Bitten Sie Claude, jeweils eine Funktion hinzuzufügen oder eine Änderung vorzunehmen. Dies macht es einfacher, zu identifizieren, was funktioniert, und Probleme früh zu erkennen.

**Fordern Sie Artifacts an, wenn nötig. ** Wenn Sie etwas Umfangreiches fragen und Claude antwortet stattdessen im Chat, sagen Sie einfach „Bitte erstelle das als Artifact. "

Lektion Reflexion

Bevor Sie fortfahren, bedenken Sie:

  • Welche wiederkehrende Arbeit könnte von einem interaktiven Artifact profitieren, das Sie wiederverwenden können?
  • Gibt es Prozesse in Ihrer Arbeit, die als Flowchart oder Diagramm klarer wären?
  • Welcher Prototyp oder welches Tool würde Ihnen helfen, eine Idee schnell zu testen?

Was kommt als Nächstes

In der nächsten Lektion erfahren Sie mehr über Skills – wiederverwendbare Anweisungssätze, die Claude spezialisierte Workflows beibringen.

Feedback

Während Sie den Kurs durchlaufen, würden wir gerne von Ihnen hören, wie Sie Konzepte aus dem Kurs in Ihrer Arbeit nutzen und welches Feedback Sie haben. Teilen Sie Ihr Feedback hier.

Danksagungen und Lizenz

Copyright 2025 Anthropic. Alle Rechte vorbehalten.

Lernkarten 8 Karten
Frage
zum Aufdecken klicken · ←/→
Antwort
zum Zurückdrehen klicken
Nach Anki exportieren (.tsv) ↓
Wissensüberprüfung 6 Fragen