A framework de front-end para agentes de IA open source, o CopilotKit, anunciou a 7 de maio o lançamento do Open Generative UI, uma implementação open source da função do Anthropic Claude Artifacts. akshay_pachaar reuniu e explicou os detalhes: a versão do CopilotKit permite que o agente gere HTML/SVG dinamicamente durante a execução, exibindo-o em modo de streaming token-by-token dentro de um iframe isolado em sandbox; assim, os utilizadores conseguem ver imediatamente o processo de montagem da interface, sem precisar de esperar pela resposta completa.
Antes do Anthropic Claude Artifacts, as capacidades de GenUI só existiam dentro de produtos próprios da Anthropic; com o CopilotKit, o mesmo modelo passou a estar disponível para a comunidade, como open source, podendo ser integrado em qualquer aplicação.
Mecanismo central: o agente gera HTML/SVG em tempo real e faz streaming para um iframe sandboxed
Desenho técnico do Open Generative UI:
O agente não escolhe componentes previamente construídos; em vez disso, gera, de cada vez, qualquer conteúdo visual do zero
A saída é transmitida em streaming token-by-token em formato HTML/SVG para um iframe em sandbox
O iframe fica totalmente isolado, sem capacidade de aceder à app pai, ao DOM, nem aos dados do utilizador
Mesmo que o agente produza tags danificadas ou JavaScript inesperado, isso não vaza para fora do iframe
Os programadores podem orientar o agente a produzir um formato visual específico através de “skill prompts” (por exemplo, um dashboard com Chart.js com etiquetas de eixos, ou um modelo 3D com controlos de rotação)
O desenho em sandbox é uma abordagem padrão para lidar com o risco de “o agente gerar código arbitrário”: permite que o agente produza livremente, mas limita o âmbito da sua execução, sem comprometer as fronteiras de segurança da aplicação principal.
Âmbito de compatibilidade: LangGraph／CrewAI／Mastra／Google ADK／AWS Strands
O Open Generative UI é construído sobre o protocolo AG-UI, sendo compatível “à partida” com vários frameworks de agentes:
LangGraph
CrewAI
Mastra
Google ADK
AWS Strands
Em simultâneo, disponibiliza um servidor MCP (Model Context Protocol) independente, que pode ser integrado em clientes como Claude Code, Cursor ou qualquer cliente compatível com MCP. O conjunto da solução é construído sobre o framework de front-end open source do CopilotKit; no GitHub, o CopilotKit já acumulou mais de 30,000 estrelas, e oferece SDKs para React, Next.js, Angular e Vue.
Significado para programadores de agentes de IA: um padrão de GenUI para além de frameworks e além de modelos
O que esta disponibilização representa para a camada de aplicação dos agentes de IA:
No passado, para adicionar na própria app uma “UI dinâmica ao estilo de Claude Artifacts”, os programadores tinham de implementar tudo do zero
O Open Generative UI oferece uma opção open source, transversal a frameworks e modelos
Através do servidor MCP, Claude Code e Cursor, os utilizadores conseguem ligar diretamente
Eventos concretos a acompanhar no futuro: taxa de adoção do CopilotKit Open Generative UI na comunidade LangChain／CrewAI, reação oficial da Anthropic à “implementação open source do Claude Artifacts” e se outros frameworks de agentes vão disponibilizar capacidades de GenUI semelhantes.
Este artigo CopilotKit lança Open Generative UI: implementação do Claude Artifacts para frameworks de agentes surgiu pela primeira vez em 鏈新聞 ABMedia.
Isenção de responsabilidade: As informações contidas nesta página podem ser provenientes de terceiros e não representam os pontos de vista ou opiniões da Gate. O conteúdo apresentado nesta página é apenas para referência e não constitui qualquer aconselhamento financeiro, de investimento ou jurídico. A Gate não garante a exatidão ou o carácter exaustivo das informações e não poderá ser responsabilizada por quaisquer perdas resultantes da utilização destas informações. Os investimentos em ativos virtuais implicam riscos elevados e estão sujeitos a uma volatilidade de preços significativa. Pode perder todo o seu capital investido. Compreenda plenamente os riscos relevantes e tome decisões prudentes com base na sua própria situação financeira e tolerância ao risco. Para mais informações, consulte a
Isenção de responsabilidade.
