FG—01AI Design Field Guide

Search the field guide

Search chapters, principles, patterns, worksheets, and glossary terms

PTN—17

Artifacts

Promote substantial outputs — documents, code, designs — out of the chat stream into standalone, editable objects.

Conversation is a terrible container for work products. A document born as message forty-seven is trapped there: hard to find, hard to revise, impossible to hand off. The artifact pattern gives real outputs their own frame — a document, a code file, a rendered app — with its own title, versions, and lifecycle, while the conversation remains the place where you discuss and revise it.

The structural move is separating the channel of negotiation from the object of work. Each round of “make the intro punchier” updates the artifact in place instead of spawning a near-duplicate wall of text in the transcript. Version history falls out naturally, diffs become possible, and the person always knows where the current canonical output lives. Without this separation, iteration produces archaeology — scrolling back through messages to find which of six drafts was the good one.

Artifacts also change what the output is. A rendered artifact — running code, an interactive diagram, a formatted document — is a thing you evaluate by using, not by reading a description of it. That shortens the feedback loop and raises the bar honestly: broken code is visibly broken in a preview, which is exactly the kind of failure you want in the open.

The pattern crystallized publicly with Claude’s Artifacts and ChatGPT’s Canvas, but the pressure behind it is older: the moment models could produce work products rather than answers, chat’s ephemerality became the bottleneck. The tradeoff lives in the promotion threshold. Promote too eagerly and every reply spawns a panel; too reluctantly and real deliverables drown in the transcript. Maturity shows when the artifact stops being a viewer and becomes a workspace — directly editable, versioned, exportable — and when the product treats the conversation as the artifact’s change history rather than its container. At that point the chat serves the work, which was always the right hierarchy.

When to use

Design considerations

Pitfalls

In the wild

Claude
Artifacts open substantial outputs — code, documents, interactive apps — in a side panel with version history, updated in place as the conversation revises them.
ChatGPT
Canvas moves documents and code into an editable workspace beside the chat, where both the person and the model can revise the same object.
Notion AI
Generated content lands directly as editable blocks in the page — the artifact is the document itself, not a chat message about one.
Midjourney
Every generation is a persistent, addressable image object with its own variation and upscale lineage, not a transient reply.

Principles served