Artifacts no Claude: o que são e quando a resposta vira arquivo em vez de texto no chat?

janela de artifacts no Claude mostrando código em arquivo separado do chat
Resposta rápida

Artifacts no Claude são conteúdos significativos e autocontidos que aparecem em uma janela dedicada, fora do fluxo da conversa

O Claude usa esse formato quando o conteúdo é grande (tipicamente mais de 15 linhas), quando você vai querer editar, iterar ou reusar aquilo fora do chat, quando ele se sustenta sozinho e quando é algo que você vai consultar depois

Na prática vira HTML e apps React, documentos markdown, diagramas Mermaid e SVGs, com histórico de versões, edição de trecho destacado e link público

Funciona no Claude, no Claude Desktop e no Claude Code

Fala aí, beleza? Uma resposta longa jogada no chat tem sempre o mesmo destino: sumir na rolagem

Aí você volta meia hora depois atrás daquele trecho de código, e é scroll pra cima, scroll pra baixo, procurando onde a coisa estava 😅

O Artifact é a janela lateral que aparece quando o Claude entrega algo que tem vida fora da conversa

Neste post eu te conto quando isso acontece, o que muda na sua vida quando a resposta vira arquivo com endereço próprio, e como editar, versionar e publicar essa parada

Quando o Claude decide transformar a resposta em Artifact?

A primeira coisa que todo mundo acha é que o critério é só tamanho

Domine o Claude Code do básico ao avançado
Pré-inscrição Formação Claude Code

Domine o Claude Code do básico ao avançado

Você vai aprender a criar sistemas completos com Claude Code, sem precisar ser programador. Inscreva-se para ter acesso a um desconto de lançamento e bônus especiais!

Não é

O tamanho entra na conta, sim: um artifact é conteúdo significativo e autocontido, tipicamente acima de 15 linhas

Mas os outros critérios oficiais são sobre DESTINO do conteúdo, não sobre volume:

  • é algo que você provavelmente vai querer editar, iterar ou reusar fora da conversa
  • é conteúdo complexo que se sustenta sozinho, sem precisar do contexto extra do chat
  • é conteúdo ao qual você provavelmente vai voltar ou usar depois

Se liga na lógica: o Claude está perguntando "isso aqui vai morrer nesta conversa ou vai virar coisa que você usa em outro lugar?"

Se a resposta é "vai virar coisa", ela ganha janela própria

Se é dúvida rápida de consulta, continua sendo texto no chat mesmo, e tá tudo certo

O que muda quando a resposta vira arquivo em vez de texto no chat

Texto solto no chat não tem versão, não tem endereço e não tem edição cirúrgica

Você pede uma mudança, o modelo reescreve o bloco inteiro, e a versão anterior fica lá atrás na conversa pra você garimpar

Com o artifact a história é outra:

  • Histórico de versões navegável: dá pra alternar entre versões diferentes usando o seletor de versão
  • Edição pontual (em documento markdown): você destaca o trecho que quer mudar, clica em ‘Edit with Claude’, escreve o pedido, e a edição cai exatamente ali no que você marcou
  • Vida fora da conversa: ao publicar, o artifact entra na seção Artifacts da barra lateral, onde ficam todos os seus artifacts
  • Link público: o botão ‘Publish’ gera um link, e qualquer pessoa com ele consegue ver e interagir
  • Código de embed: nos planos Free, Pro e Max dá pra gerar código de incorporação pra qualquer artifact publicado

É a diferença entre um rascunho no meio da conversa e um documento que existe por conta própria

legal né? 😀

Que tipo de pedido se beneficia de virar Artifact

Os tipos de conteúdo que viram artifact são HTML ou apps React, documentos markdown, diagramas Mermaid e SVGs

Cada um casa com um tipo de pedido bem específico:

  • HTML ou app React: aquela página de teste, o protótipo interativo, o componentezinho que você quer VER funcionando em vez de ler em bloco de código
  • Documento markdown: texto longo que vai ser editado e reusado, tipo documentação, roteiro, especificação
  • Diagrama Mermaid: fluxo, arquitetura, aquele desenho que explica o sistema melhor que três parágrafos
  • SVG: gráfico ou ícone vetorial que você vai levar pra outro lugar

Um pedido de diagrama, por exemplo, é o caso clássico de coisa que ninguém quer ler como texto corrido:

Monte um diagrama Mermaid do fluxo de checkout,
do carrinho até a confirmação do pagamento

E no Claude Code?

Aqui tem um caso que eu acho MUITO massa: no Claude Code, a saída da sessão pode ser publicada como uma página interativa em URL privada

E ela se atualiza no mesmo endereço conforme a sessão continua, além de poder ser compartilhada com pessoas da organização

Ou seja: em vez de mandar print do terminal pro time, você manda um endereço que acompanha o trabalho

Esse formato conversa bem com quem já se preocupa em gerenciar contexto no Claude Code, porque tira da conversa o que não precisa ficar nela

Onde os artifacts funcionam e em qual plano

Os artifacts estão disponíveis no Claude, no Claude Desktop e no Claude Code

Mas o plano muda o que você consegue fazer, e o Claude Code é o ponto de atenção aqui:

Onde / o que Planos que suportam
Artifacts com IA no Claude e no Claude Desktop Free, Pro, Max, Team e Enterprise
Seção Artifacts na barra lateral Free, Pro, Max, Team e Enterprise
Artifacts no Claude Code Team e Enterprise
Código de embed de artifact publicado Free, Pro e Max
Compartilhamento restrito à organização Team e Enterprise (quem for ver precisa estar logado na conta)

Repara na terceira linha: se você usa o Claude Code em plano individual, os artifacts do Claude Code não são pra você

Já a janela dedicada no Claude mesmo você tem até no Free

E repara também na quarta linha, que é a que mais confunde: o embed a documentação lista pra Free, Pro e Max, enquanto o caminho de compartilhamento documentado pra Team e Enterprise é o restrito à organização

O que precisa estar ligado antes de os artifacts funcionarem

Tome cuidado com isso aqui, porque é o motivo número um de "pedi e não apareceu janela nenhuma"

Execução de código e criação de arquivos precisa estar habilitada

Onde ligar depende do seu plano:

  • Free, Pro e Max: ‘Code execution and file creation’ em Settings > Capabilities
  • Team e Enterprise: ‘Code execution and file creation’ em Organization settings > Capabilities

Sem isso ligado, o recurso não opera

E se você está no Team ou Enterprise, repara que o caminho é de organização: pode não ser você quem tem a chave dessa porta 🙂

Como editar, versionar e publicar um Artifact

Bora ver o fluxo na prática?

  1. Peça algo que justifique o formato: conteúdo significativo e autocontido, tipicamente acima de 15 linhas, e de preferência algo que você vá reusar fora do chat

O erro comum aqui: esperar artifact de resposta curta de consulta, que é justamente o que continua sendo texto no chat

  1. Alterne entre as versões pelo seletor de versão: cada rodada de mudança não apaga o que veio antes, dá pra ir e voltar

O erro comum: achar que a nova versão substituiu a anterior de vez e refazer o pedido do zero, quando bastava trocar de versão no seletor

  1. Em um documento markdown, destaque o trecho que quer mudar, clique em ‘Edit with Claude’ e digite o pedido: a edição é aplicada exatamente no trecho marcado

Repara no detalhe: esse caminho de seleção é o documentado pra artifact de documento markdown

O erro comum: pedir a mudança pelo chat sem destacar nada e esperar precisão cirúrgica, quando o caminho da edição pontual é a seleção

  1. Clique em ‘Publish’ e copie o link público: o artifact ganha endereço e passa a viver na seção Artifacts da barra lateral

O erro comum, e esse dói: publicar sem perceber que qualquer pessoa com o link consegue ver e interagir com aquilo

  1. Se você está no Team ou Enterprise e o conteúdo é interno, use o compartilhamento restrito à organização: aí o artifact fica disponível só dentro da organização, e quem for ver precisa estar logado na conta Team ou Enterprise

O botão ‘Remix’ saiu: como partir de um artifact publicado hoje

Se você seguiu tutorial antigo procurando o ‘Remix’, pode parar de procurar: esse botão não existe mais

O caminho atual é copiar o código em um novo chat e pedir as mudanças ao Claude

E tem uma implicação importante aí: essa cópia é separada do original

O que você fizer nela não volta pro artifact publicado

Ou seja, é fork mesmo, não é edição colaborativa

Vale usar Artifacts no seu fluxo?

A régua é bem simples e ela vem dos próprios critérios: o conteúdo é pra editar, versionar ou reusar fora da conversa?

Então o formato de arquivo ganha fácil, porque você leva versão, edição pontual e endereço junto

É resposta curta de consulta? O chat basta, e forçar formato só atrapalha

Esse raciocínio, aliás, é o mesmo tipo de escolha de ferramenta de quando se decide usar a API em vez do chat: não é qual é melhor, é qual é o destino do que você está produzindo

Próximo passo concreto pra hoje: confere se ‘Code execution and file creation’ está habilitado no seu plano, aí pede pro Claude algo longo o bastante e vê a janela dedicada aparecer do lado

faça o teste!

até o próximo post! 😀

Perguntas frequentes

Todo código ou texto longo que o Claude gera vira Artifact automaticamente?

Não. O tamanho conta (tipicamente acima de 15 linhas), mas o critério real é se o conteúdo é significativo, autocontido e algo que você vai editar, reusar ou consultar depois. Uma resposta curta de consulta continua sendo texto no chat, mesmo que passe de 15 linhas em casos raros.

Dá pra voltar para uma versão anterior de um Artifact depois de várias edições?

Sim, o Artifact guarda histórico de versões e dá pra alternar entre elas usando o seletor de versão. Nenhuma edição nova apaga o que veio antes, então você não perde o rascunho anterior.

A edição por seleção (‘Edit with Claude’) vale para qualquer tipo de Artifact?

O caminho documentado é para o Artifact de documento markdown: você destaca o trecho, clica em ‘Edit with Claude’, digita o pedido e a edição é aplicada exatamente ali. Para os demais tipos, a documentação não descreve esse fluxo de seleção.

Um Artifact publicado com link fica visível pra qualquer pessoa da internet?

Sim, ao clicar em ‘Publish’ e copiar o link, qualquer pessoa com esse link consegue ver e interagir com o Artifact. Já o compartilhamento restrito à organização, disponível nos planos Team e Enterprise, exige que quem for ver esteja logado na conta da organização.

O botão Remix ainda existe para reaproveitar um Artifact publicado?

Não, o botão ‘Remix’ foi descontinuado. Pra partir de um Artifact publicado hoje, você copia o código dele em um novo chat e pede as mudanças ao Claude, e essa cópia fica separada do original.

Artifacts no Claude Code funcionam em qualquer plano?

Não, os Artifacts no Claude Code estão disponíveis apenas nos planos Team e Enterprise. Já a janela de Artifacts no Claude e no Claude Desktop funciona em Free, Pro, Max, Team e Enterprise.

Dá pra gerar código de embed de um Artifact em qualquer plano?

A documentação lista a geração de código de incorporação (embed) para qualquer Artifact publicado nos planos Free, Pro e Max. É esse código que permite colocar o Artifact dentro de outra página ou site.



Subscribe
Notify of
guest

0 Comentários
Oldest
Newest Most Voted

Formações

Formação Vibe Coding

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

  • 474 aulas
  • 20 projetos
  • 39h 27min

Blog | Mais populares