html 🏺 Artefatos | Nullcore
Pule para o conteúdo principal

O que são artefatos e como os uso no webui aberto?

Os artefatos no Nullcore são um recurso inovador inspirado nos artefatos da Claude.ai, permitindo que você interaja com conteúdo significativo e independente gerado por um LLM dentro de um bate -papo. Eles permitem que você visualize, modifique, desenvolva ou faça referência a peças substanciais de conteúdo separadamente da conversa principal, facilitando o trabalho com saídas complexas e garantindo que você possa revisitar informações importantes posteriormente.

Quando o Nullcore usa artefatos?

O Nullcore cria um artefato quando o conteúdo gerado atende a critérios específicos adaptados à nossa plataforma:

  1. Renderizável: Para ser exibido como um artefato, o conteúdo deve estar em um formato que o Nullcore suporta para a renderização. Isso inclui:
  • Sites HTML de uma página única
  • Imagens de gráficos vetoriais escaláveis ​​(SVG)
  • As páginas da Web completas, que incluem HTML, JavaScript e CSS, todos no mesmo artefato. Observe que o HTML é necessário se gerar uma página da Web completa.
  • Visualizações de trêsjs e outras bibliotecas de visualização de JavaScript, como D3.js.

Outros tipos de conteúdo, como documentos (marcação ou texto simples), trechos de código e componentes de reação, não são renderizados como artefatos por webui aberto.

Como o modelo Nullcore cria artefatos?

Para usar artefatos no Nullcore, um modelo deve fornecer conteúdo que desencadeia o processo de renderização para criar um artefato. Isso envolve a geração de HTML, código SVG válido ou outros formatos suportados para renderização de artefatos. Quando o conteúdo gerado atende aos critérios mencionados acima, o Nullcore o exibirá como um artefato interativo.

Como uso artefatos em webui aberto?

Quando o Nullcore cria um artefato, você verá o conteúdo exibido em uma janela de artefatos dedicados para o lado direito do bate -papo principal. Veja como interagir com artefatos:

  • Edição e iteração: Peça a um LLM no bate -papo para editar ou iterar no conteúdo, e essas atualizações serão exibidas diretamente na janela Artefato. Você pode alternar entre versões usando o seletor de versão no canto inferior esquerdo do artefato. Cada edição cria uma nova versão, permitindo rastrear alterações usando o seletor de versão.
  • Atualizações: Nullcore pode atualizar um artefato existente com base em suas mensagens. A janela Artefato exibirá o conteúdo mais recente.
  • Ações: Acesse ações adicionais para o artefato, como copiar o conteúdo ou abrir o artefato em tela cheia, localizada no canto inferior direito do artefato.

Editando artefatos

  1. Atualizações direcionadas: Descreva o que você quer alterado e onde. Por exemplo:
  • "Mude a cor da barra no gráfico de azul para vermelho".
  • "Atualize o título da imagem SVG para 'Novo título'".
  1. Reescritas completas: Solicite grandes alterações que afetam a maior parte do conteúdo para reestruturação substancial ou várias atualizações de seção. Por exemplo:
  • "Reescreva este site HTML de página única para ser uma página de destino."
  • "Redesenhe esse SVG para que seja animado usando trêsjs".

Práticas recomendadas

  • Seja específico sobre qual parte do artefato você deseja mudar.
  • Referência de texto de identificação exclusiva em torno da alteração desejada para atualizações direcionadas.
  • Considere se uma pequena atualização ou reescrita completa é mais apropriada para suas necessidades.

Casos de uso

Os artefatos no Webui aberto permitem que várias equipes criem produtos de trabalho de alta qualidade de maneira rápida e eficiente. Aqui estão alguns exemplos adaptados à nossa plataforma:

  • Designers
    • Crie gráficos SVG interativos para design de UI/UX.
    • Projete sites HTML de uma página única ou páginas de destino.
  • Desenvolvedores: Crie protótipos HTML simples ou gerar ícones SVG para projetos.
  • Profissionais de marketing
    • Design Páginas de destino da campanha com métricas de desempenho.
    • Crie gráficos SVG para criativos de anúncios ou postagens de mídia social.

Exemplos de projetos que você pode criar com os artefatos do Nullcore

Os artefatos no Webui aberto permitem que várias equipes e indivíduos criem produtos de trabalho de alta qualidade de maneira rápida e eficiente. Aqui estão alguns exemplos adaptados à nossa plataforma, mostrando a versatilidade dos artefatos e inspirando você a explorar seu potencial:

  1. Visualizações interativas
  • Componentes usados: trêsjs, d3.js e svg
  • Benefícios: Crie histórias de dados imersivas com visualizações interativas. Os artefatos do Nullcore permitem alternar entre versões, facilitando o teste de diferentes abordagens de visualização e rastrear alterações.

Exemplo Projeto: Crie um gráfico de linhas interativas usando trêsjs para visualizar os preços das ações ao longo do tempo. Atualize as cores e escalas do gráfico em versões separadas para comparar diferentes estratégias de visualização.

  1. Aplicativos da Web de página única
  • Componentes usados: HTML, CSS e JavaScript
  • Benefícios: desenvolva aplicativos da Web de uma página única diretamente no Webui aberto. Editar e iterar no conteúdo usando atualizações direcionadas e reescritas completas.

Exemplo de projeto: projete um aplicativo de lista de tarefas com uma interface de usuário criada usando HTML e CSS. Use JavaScript para adicionar funcionalidade interativa. Atualize o layout do aplicativo e a UI/UX usando atualizações direcionadas e reescritas completas.

  1. Gráficos SVG animados
  • Componentes usados: SVG e trêsjs
  • Benefícios: Crie gráficos de SVG animados envolventes para campanhas de marketing, mídias sociais ou web design. Os artefatos do Nullcore permitem editar e iterar nos gráficos em uma única janela.

Exemplo de projeto: projete um logotipo SVG animado para uma marca da empresa. Use trêsjs para adicionar efeitos de animação e abrir as atualizações direcionadas da Webui para refinar as cores e o design do logotipo.

  1. Protótipos de página da web
  • Componentes usados: HTML, CSS e JavaScript
  • Benefícios: Crie e teste protótipos de página da web diretamente no Webui aberto. Alterne entre as versões para comparar diferentes abordagens de design e refinar o protótipo.

Exemplo de projeto: desenvolva um protótipo para um novo site de comércio eletrônico usando HTML, CSS e JavaScript. Use as atualizações direcionadas do Nullcore para refinar a navegação, o layout e a UI/UX.

  1. Narrativa interativa
  • Componentes usados: HTML, CSS e JavaScript
  • Benefícios: Crie histórias interativas com efeitos de rolagem, animações e outros elementos interativos. Os artefatos do Nullcore permitem refinar a história e testar versões diferentes.

Exemplo de projeto: construa uma história interativa sobre a história de uma empresa, usando efeitos e animações de rolagem para envolver o leitor. Use atualizações direcionadas para refinar a narrativa da história e abrir o seletor de versão da Webui para testar versões diferentes.