OpenGenerativeUI - framework open source de UI generativa baseada em IA

 (github.com/CopilotKit)
35 pontos por xguru 2026-03-17 | 3 comentários | Compartilhar no WhatsApp
  • Implementa fielmente o recurso de geração de materiais visuais interativos lançado pela Claude
  • Uma UI generativa que cria automaticamente gráficos, diagramas, visualizações e outros materiais, em vez de responder apenas com texto
    • Visualização de algoritmos: busca binária, BFS/DFS, ordenação etc.
    • Animações 3D: cenas interativas baseadas em WebGL/CSS3D
    • Gráficos e diagramas: gráfico de pizza, gráfico de barras, diagrama de rede etc.
    • Widgets e simulações: formulários, gráficos matemáticos, ferramentas interativas etc.
  • Todos os elementos visuais são renderizados dentro de um iframe sandbox para garantir segurança e isolamento
    • Suporte a tema claro/escuro automático, animação progressiva e redimensionamento responsivo
  • Gera conteúdo visual conversacional em tempo real com base em CopilotKit e LangGraph
    • Estruturado como um monorepo baseado em Turborepo
    • apps/app: frontend baseado em Next.js 16, React 19 e Tailwind 4
    • apps/agent: agente Python que usa LangGraph e middleware do CopilotKit
  • Como funciona
    • O usuário insere um prompt pela UI de chat do CopilotKit
    • O agente decide a forma de resposta adequada entre texto, chamada de ferramenta ou componente visual
    • O hook widgetRenderer do frontend recebe o HTML e o renderiza em um iframe
    • Após o Skeleton loading, aplica um fade-in suave e executa o ajuste automático de altura
  • Fornece uma matriz de decisão de visualização
    • Dependendo do tipo de solicitação, seleciona automaticamente a tecnologia adequada entre SVG, HTML, Chart.js, Three.js, D3.js etc.
    • Ex.: para explicação de processo usa Flowchart, para comparação de dados usa Bar chart, para representação 3D usa Three.js
  • Licença MIT

Leituras relacionadas

3 comentários

 
beoks 2026-03-17

Então, é um método de renderizar o HTML gerado dentro de um iframe.
 
xguru 2026-03-17

Faz pouquíssimo tempo que o Claude lançou esse recurso, e já o implementaram em open source.

Também é engraçado ver o Claude entre os contribuidores haha O Claude ajudando a implementar exatamente o recurso que o próprio Claude lançou..
 
kissdesty 2026-03-17

Ouvi dizer que, se você fizer commit usando o Claude Code, ele aparece automaticamente como contributor na configuração padrão.