Artefakty a vizuální výstupy

Artefakty a vizuální výstupy

Claude nepíše jen text — tvoří věci. Objevte, jak Artefakty umožňují vytvářet živé náhledy HTML stránek, diagramy, grafy, React komponenty a interaktivní nástroje přímo uvnitř konverzace.

Co jsou Artefakty?

Artifacts are Claude’s ability to generate standalone, self-contained content that appears in a dedicated preview panel on the right side of the screen on claude.ai. Instead of giving you code or text inside a chat message and leaving you to copy it somewhere else, Claude renders the content live — so you can see a working HTML page, an interactive diagram, a styled document, or a functional React component right there in the conversation.

Představte si ten rozdíl takto: bez Artefaktů, když požádáte Claude o vytvoření mockupu dashboardu, dostanete blok kódu, který musíte zkopírovat do souboru, otevřít v prohlížeči a zobrazit sami. S Artefakty se dashboard objeví okamžitě v živém náhledu. Můžete ho vidět, interagovat s ním, iterovat říkáním „změň barvu záhlaví na modrou“ nebo „přidej koláčový graf“ a stáhnout finální výsledek, až budete spokojeni. Toto proměňuje Claude z čistě textového asistenta na nástroj pro vizuální tvorbu. Je to jedna z funkcí, která odlišuje Claude od všech ostatních AI asistentů na trhu.

Artefakty jsou dostupné na claude.ai pro všechny uživatele (Free, Pro, Team a Enterprise). Objeví se automaticky, když Claude usoudí, že by odpověď měla prospěch ze samostatného náhledu — nebo můžete explicitně požádat „vytvoř to jako artefakt“ nebo „ukaž mi živý náhled.“

Typy Artefaktů

Claude dokáže generovat několik odlišných typů artefaktů, z nichž každý je vhodný pro různé kreativní a technické potřeby. Pochopení možností vám pomůže požádat o správnou věc a získat skvělé výsledky na první pokus.

Praktické příklady — O co žádat

Nejlepší způsob, jak pochopit Artefakty, je vidět je v akci. Zde jsou reálné příklady promptů, které produkují působivé vizuální výstupy. Kterýkoli z nich můžete zkopírovat přímo do Claude a během sekund získat funkční artefakt.

Tipy pro nejlepší artefakty

Artefakty krásně reagují na principy prompt engineeringu z naší předchozí lekce. Zde jsou tipy specifické pro artefakty, které posunou vaše výsledky z dobrých na vynikající:

Iterování artefaktů

One of the most powerful aspects of Artifacts is conversational iteration. After Claude generates an artifact, you can refine it with simple natural-language instructions. Claude understands the context of the existing artifact and applies your changes without rebuilding from scratch. Here are examples of effective iteration prompts:

Each iteration builds on the previous version. You can make dozens of refinements in a single conversation, gradually sculpting the artifact into exactly what you need. This iterative workflow is often faster than writing code yourself, even for experienced developers, because you are describing what you want rather than implementing how to build it.

Export a používání artefaktů

Once your artifact is ready, you have several options for getting it out of Claude and into your workflow. Claude provides a copy button that copies the full source code to your clipboard — paste it into your code editor, save it as an HTML file, or integrate the component into your project. For HTML artifacts, you can often save the file with a .html extension and open it directly in a browser. For React components, copy the code into your project and import it normally. For Mermaid diagrams, many tools (Notion, GitHub, Obsidian) support Mermaid rendering natively.