Annuncio: Artefatti Web di Intelligenza Artificiale

Ho provato localmente e la maggior parte dei problemi riscontrati:

  • In modalità a schermo intero, a volte la barra di escape si sovrappone al contenuto, rendendo impossibile interagirci.
  • A volte, “Esegui artefatti” non appare immediatamente, ma appare una volta che si passa il mouse sopra le icone dei post, per esempio (sembra).
  • Ho avuto solo un caso in cui non è stato visualizzato alcun risultato. Ho potuto vedere l’indicatore, e poi non è successo nulla.

Nel complesso, funziona molto bene. :+1:

Ecco alcune delle demo.
Non è così facile creare una demo corretta. Come al solito, più un prompt è dettagliato, migliore è il risultato.
A volte è necessaria una precisione aggiuntiva. Non sempre include tutte le risorse, non è reattivo o richiede codice per attendere il caricamento della pagina. Inoltre, l’uso di librerie esterne aumenta la probabilità di fallimento.

Mi è piaciuta troppo questa funzionalità. :smile:

Prompt (simula moto parabolica)

Crea una pagina per simulare il moto parabolico. La pagina dovrebbe:

  1. Consentire agli utenti di inserire la velocità iniziale, l’angolo e l’altezza del proiettile.
  2. Visualizzare un’animazione in tempo reale della traiettoria del proiettile.
  3. Includere i valori calcolati per il tempo di volo, l’altezza massima e la gittata.
  4. Utilizzare slider per la regolazione in tempo reale dei parametri di input.
  5. Includere un pulsante “Reset” per ricominciare.
Video


Prompt (gioco di pioggia di emoji)

Crea una pagina in cui gli utenti scelgono il loro umore e le emoji iniziano a piovere sullo schermo. La pagina dovrebbe:

  1. Fornire opzioni di umore come “Felice”, “Scontroso” o “Pizza”.
  2. Far cadere emoji come :smile:, :angry: o :pizza: all’infinito dall’alto dello schermo.
  3. Consentire agli utenti di fare clic sulle emoji per “raccoglierle” con un divertente effetto sonoro.
  4. Includere un contatore sciocco come “Fette di pizza raccolte: 27”.
  5. Utilizzare HTML, CSS e JavaScript per un divertimento animato.
Video


Prompt (semplice visualizzatore del sistema solare)

Crea una pagina per visualizzare il sistema solare. La pagina dovrebbe:

  1. Visualizzare un sistema solare in scala ridotta, animato e dettagliato, mostrando le orbite planetarie.
  2. Consentire agli utenti di fare clic su un pianeta per visualizzare informazioni come dimensioni, distanza dal sole e periodo orbitale.
  3. Consentire agli utenti di ingrandire e rimpicciolire.
  4. Includere uno slider per accelerare o rallentare il moto orbitale.
  5. Utilizzare HTML, CSS e JavaScript per l’interattività e l’animazione.
  6. Assicurarsi che il contenitore utilizzi il 100% di larghezza e altezza.
Video


Prompt (Playground animazioni CSS)

Crea una pagina in cui gli utenti possono sperimentare con animazioni e transizioni CSS. La pagina dovrebbe:

  1. Visualizzare vari elementi (ad esempio, pulsanti, div) che gli utenti possono animare con CSS.
  2. Consentire agli utenti di scegliere da un elenco di proprietà di animazione (ad esempio, transform, opacity, translate, rotate).
  3. Fornire slider per regolare la durata, la funzione di temporizzazione e il ritardo delle animazioni.
  4. Consentire agli utenti di visualizzare in anteprima le animazioni in tempo reale e vedere come le modifiche influiscono sull’animazione.
  5. Utilizzare JavaScript per aggiornare dinamicamente le proprietà CSS e HTML/CSS per lo styling.
Video


Prompt (Dashboard dati interattiva)

Crea una pagina che visualizza una dashboard dati con grafici interattivi. La pagina dovrebbe:

  1. Visualizzare più grafici, come un grafico a barre, un grafico a linee e un grafico a torta, ognuno dei quali rappresenta diversi set di dati (ad esempio, vendite, popolazione, dati meteorologici).
  2. Consentire agli utenti di filtrare i dati per intervallo di tempo, categoria o posizione utilizzando menu a discesa o slider.
  3. Aggiornare i grafici in tempo reale mentre gli utenti interagiscono con i filtri.
  4. Mostrare statistiche descrittive (ad esempio, media, mediana, moda) per i dati selezionati.
  5. Utilizzare Chart.js o D3.js per il rendering dei grafici e JavaScript per gestire il filtraggio dei dati e i calcoli statistici.
Video

3 Mi Piace