Anunciando: Artefatos Web de IA

Apresentando Artefatos Web no Discourse AI!

Artefatos Web permitem que você crie e compartilhe componentes interativos e dinâmicos (HTML/CSS/JavaScript) diretamente em suas postagens. De visualizações e quizzes a aplicativos web leves.

O artefato acima foi gerado usando GPT-4o e a biblioteca anime.js
Demonstração de CSS Grid por Claude 3.5 Sonnet

Saiba mais em: Discourse AI - Web Artifacts

24 curtidas

Compêndio da Tábua Sheikah

Isso é um nível totalmente novo de diversão no Discourse! :tada:

15 curtidas

Artefato Mágico da Web para Encontrar Respostas

Para usar: pense em uma pergunta, e pressione o ícone do item mágico. :magic_wand:

Ok, vou fazer uma pausa por agora… tantas ideias!

9 curtidas

Nenhum desses exemplos mostra nada no iPad :cry: E se eu abrir em tela cheia no Hub, não consigo sair sem sair de um fórum.

2 curtidas

Temos uma nova compilação do hub que @pmusaraj está publicando, você atualizou para a mais recente?

3 curtidas

Sim! Sair da tela cheia com Esc é difícil em tablets, e usar o botão de voltar não me leva de volta ao tópico, mas um passo para trás.

3 curtidas

Acho que podemos empurrar o estado quando você clica no botão para corrigir a tela cheia

Talvez essa sobreposição não faça sentido no toque, ela atrapalha os controles na parte superior de qualquer maneira

2 curtidas

Esta é uma ótima adição!

Só quero acrescentar alguns pontos para aqueles que podem hesitar em usar isso. Nas últimas semanas, tenho usado principalmente o ChatGPT com o modelo 4o para criar páginas HTML simples/padrão usando JavaScript e CSS. O que é incrível é que o código gerado quase nunca tem um bug, mas a engenharia de prompt é necessária para obter os resultados desejados. Às vezes, o que você pensa e o que o modelo pensa que você quer podem não ser os mesmos, então um pequeno ajuste no prompt é necessário.

Se você tiver acesso a um canvas no modo de codificação ou similar, estes são ótimos para começar. Além disso, se você não é um programador e não faz isso normalmente, uma das ferramentas mais úteis para corrigir bugs é estar ciente da tecla F12 (ref) com navegadores de Internet.

Eu poderia escrever um livro sobre isso, mas vou parar por aqui; você está em um playground, então experimente!

4 curtidas

Se o sistema atualizou, então sim. 2.0.7 há duas semanas.

1 curtida

Sim, foi um problema do Hub mesmo. O Safari mostra bem.

É possível um exemplo de prompt para nós, não-codificadores?

Editar

A primeira tentativa funcionou. Esse tipo de trabalho de desenvolvimento é ótimo. Apenas dizendo o que é necessário. Mas algumas perguntas:

  • onde esse código vive no meu fórum? Quero dizer, posso ou não destruir esse PM?
  • podemos começar a usar Support com essas perguntas?
2 curtidas

Prompt simplificado para uso como um Artefato Web de IA (não tenho acesso a Artefatos Web de IA para testar, mas deve funcionar ou ser muito próximo)

Crie um jogo de caça-níqueis, use JavaScript e CSS.

Prompt real usado com ChatGPT 4o

Crie uma página HTML simples para um jogo de caça-níqueis, use JavaScript e CSS. Crie como uma única página HTML para download.

Aqui está um prompt mais avançado que foi ajustado algumas vezes antes de obter um resultado desejado. Terá que ser modificado para uso com um Artefato Web de IA.

Crie uma página HTML simples para um jogo de Blackjack, use JavaScript e CSS.

  • Crie como uma única página HTML para download.
  • Mostre as cartas do dealer após ele parar.
  • Adicione opção para jogadores bot adicionais, mostre as cartas dos jogadores bot.
  • Adicione opção para apostar e acompanhar o valor.
  • Mostre o total das cartas do jogador.
  • Mostre as cartas do dealer antes de exibir um pop-up de quem ganhou.

Se você quiser algo um pouco mais difícil, crie um jogo de damas com um oponente bot.

2 curtidas

Essa versão não incluiu a correção do artefato. Nova versão, 2.0.8, enviada para revisão agora, deve estar disponível em breve.

8 curtidas

Olhos Googly

Acertou em cheio!

Inspirado por Xeyes – Wikipedia :eyes:

8 curtidas

Sinceramente, estou tendo um pouco de dificuldade em imaginar inserções que realmente aprimorem uma postagem de forma integrada. Já existem exemplos de alguma aplicação prática que seria incluída de forma integrada?

6 curtidas

No meu fórum há muitos tópicos sobre nutrição de cães. Agora eu poderia oferecer um planejador simples, como um exemplo, do que o cão do usuário precisaria por dia.

Eu gostaria de usar uma IA, mas elas falham o tempo todo e são muito caras. Claro, um plugin ou talvez um componente poderia fazer o mesmo e melhor, mas eu não sei como.

Se eu pudesse enviar a resposta de um artefato para uma persona de IA com um prompt pré-feito, seria bom, mas não sei se isso é possível.

4 curtidas

Vamos tentar! :smiley:

4 curtidas

Entendi. Mais ou menos. Basicamente, é “apenas” mais uma conversa com a IA onde se explica o que é necessário, como deve parecer, e outras orientações e regras rígidas.

É basicamente Visual Basic, mas mais fácil :joy:

2 curtidas

Visual Basic para Leigos. :laughing:

3 curtidas

Chihuahua!

Essas imagens são da Wikimedia; estou ansioso para utilizar dados públicos interativamente, para arte e compartilhamento de informações. :slight_smile:

4 curtidas

Nossa, perdi esse anúncio. Incrível! :exploding_head: Parabéns, equipe. :clap:
Já vejo que isso trará muitas consequências positivas, como aumentar o engajamento do usuário, facilitar a explicação/aprendizado de coisas e dar feedback interativo. Além disso, é divertido :smile:.

2 curtidas