Generació de fotogrames d'IA
Obrir el creador de fotogrames
Quan es genera un fotograma, la insígnia d'estat de la pantalla a la barra lateral esquerra canvia a "s'està generant..." i apareix un indicador de progrés a la part inferior dreta (per exemple, "S'està generant el fotograma... (10%)"). El botó "Genera el fotograma" es substitueix pel botó "Atura la generació", que et permet cancel·lar-lo si cal.
Creador de fotogrames
El creador de fotogrames és on generes i administres els fotogrames individuals de la maqueta per a cada pantalla. La barra lateral esquerra mostra totes les pantalles del teu projecte (per exemple, Panell de control, Llista de tasques, Detalls de la tasca) amb indicadors d'estat que mostren si cadascuna està pendent, generant-se o completada.
Disseny
Proveïdor d'IA
Selecciona el model d'IA que s'utilitzarà per a la generació de fotogrames al menú desplegable de la part superior esquerra (per exemple, Claude Code, Opus 4.6).
Llista de pantalles
La barra lateral esquerra mostra totes les pantalles del projecte. Fes clic a una pantalla per veure els seus detalls i generar el seu fotograma.
Propòsit de la pantalla i instruccions
El panell central mostra el propòsit i les característiques clau de la pantalla seleccionada. Fes clic a Edita per modificar-los abans de generar.
Previsualització del fotograma
El costat dret mostra una previsualització del fotograma generat o un marcador de posició de fotograma de mida completa si el fotograma encara no s'ha generat.
Genera el fotograma
Fes clic per generar el fotograma de la pantalla seleccionada. Utilitza Inicia la generació de tots per generar tots els fotogrames pendents alhora.
Edició abans de la generació
Un cop finalitzada la generació, veuràs un missatge "Fotograma generat correctament". La insígnia d'estat de la pantalla canvia a "completat" (verd) juntament amb un recompte d'elements (per exemple, "41 elements"). La previsualització del fotograma generat apareix al costat dret de l'editor.
Generació de fotogrames
Les connexions de bloc et permeten adjuntar blocs de la biblioteca de blocs a elements de maquetes. Quan fas doble clic a un element i fas servir cap avall a la secció de propietats, trobaràs la secció Connexions de bloc. Fes clic a "+ Afegeix un bloc" per enllaçar un bloc (HTML, component o plantilla) a l'element. Els blocs connectats es fan referència quan es genera el codi amb la IA, cosa que facilita l'adjuntament de codi HTML o de components específics als elements de maquetes.
Durant la generació
Indicadors d'estat
Cada pantalla mostra el seu estat actual: pendent (no iniciat), generant-se (en curs) o completada (fet).
Indicador de progrés
Una barra de progrés basada en percentatge a la part inferior dreta mostra fins a quin punt ha avançat la generació del fotograma actual.
Atura la generació
Cancel·la la generació del fotograma actual en qualsevol moment fent clic al botó Atura la generació.
Enllaç automàtic
Els fotogrames s'enllacen automàticament entre ells: els fluxos de navegació entre les pantalles es connecten durant la generació.
Fotogrames completats
La barra d'indicacions de la IA a la part inferior del llenç et permet utilitzar la IA per editar o crear pantalles. Selecciona el model d'IA del menú desplegable de l'esquerra, descriu els canvis que vols i la IA modificarà la maqueta per a tu. També pots utilitzar l'entrada de veu o el botó "Edita la CLI" per a una edició avançada.
Després de la finalització
Previsualització del fotograma
El panell dret mostra una previsualització visual del fotograma generat amb tots els components disposats.
Comptador d'elements
La insígnia completada mostra el nombre total d'elements generats per a la pantalla.
Reinicia el fotograma
Si no estàs satisfet amb el resultat, fes clic a Reinicia el fotograma per regenerar-lo des de zero.
Inicia la generació de tots
Continua generant els fotogrames pendents restants o utilitza-ho per generar tots els fotogrames alhora.