Crea un gioco giocabile sulla tela: dall'idea all'esportazione .html

Lo skill /games è uno sviluppatore di giochi integrato in FilmMovie Studio: descrivi un'idea di gioco e l'app la costruisce come un documento HTML/JS autonomo che parte all'istante in una scheda sandbox sulla tela. Funziona per giochi arcade (Snake, Pong, Breakout), rompicapi (2048, memory, tris), quiz, platform e giochi di fisica (Phaser, Kaboom, Matter.js), e per il 3D moderno con Three.js e la fisica Rapier. Giochi al gioco direttamente nella scheda, lo rifinisci con altri messaggi in chat e, quando sei soddisfatto, lo esporti come file .html che si apre in qualsiasi browser. Questa guida percorre l'intero giro.

Cosa ti serve

FilmMovie Studio installato (macOS o Windows).
Almeno un fornitore di generazione configurato nelle Impostazioni (una chiave kie.ai o deAPI) — serve solo per la grafica o l'audio IA; i giochi disegnati in codice funzionano anche senza.
Un'idea per un gioco — genere e tema, es. «Snake a tema spaziale».

Passo dopo passo

1
Apri un progetto nel Workspace
Avvia FilmMovie Studio, clicca su «Nuovo progetto» nel Launchpad, dagli un nome (es. «Il mio gioco») e conferma. Si apre il Workspace con la tela a sinistra e la chat a destra.
Film Movie StudioRender
Battlecraft Fantasy RTSNuovo progetto
LaunchpadHubTutti i progetti
Recenti
project 1project 2project 3
Impostazioni
Film Movie Studio
Un nuovo modo di creare contenuti con l'IA
Descrivi cosa vuoi creare…
SkillModelli
Digita / per esplorare gli skill IA
Short DramaE-commerceMusic VideoGamesDocumentary
2
Scegli lo skill /games
In chat clicca l'icona dello skill e scegli /games (oppure inizia il messaggio con /games). Così dici all'app che vuoi costruire un gioco giocabile, non un video o un'immagine.
Film Movie StudioRender
Storybook Fantasy RTSNuovo progetto
Cerca skill…
TuttiWorkflowRapidi
video
Short DramaViral vertical mini-series, end to end.
image
Image CreatorGenerate single images from a prompt.
audio
Audio StudioVoiceover, SFX and music tracks.
copy
App BuilderMulti-screen apps with live preview.
image
E-commerce DesignPro product shots for any platform.
video
Music VideoBeat-synced clips cut to your track.
Consiglio: Se ometti il genere e dici solo «fammi un gioco», l'app chiede una volta il tipo (arcade / puzzle / quiz / platform). Quando nomini il genere, parte subito.
3
Scrivi la tua idea di gioco in chat
Descrivi il gioco in una o due frasi, es. «Fai un gioco Snake a tema spaziale con conteggio del punteggio». Bastano genere e tema — non preoccuparti del motore; lo sceglie l'app (Canvas2D per i classici, Phaser/Kaboom per arcade e platform, Three.js per il 3D).
Film Movie StudioRender
Fantasy Realm ConquestNuovo progetto
Skill
/games
/short-drama
/image-creator
/audio-studio
/app-builder
/games Panoramic 360 fantasy sky plate, warm storybook clouds, soft golden hour light, gentle gradient from warm blue at top to peach and cream near horizon, fluffy cumulus clouds,…
SkillModelli
Digita / in qualsiasi momento per cambiare skill
Consiglio: Descrivi il gioco, non il codice. Un classico semplice compare in un colpo solo; uno più complesso (platform, 3D) viene costruito a pezzi, e vedi ogni sistema comparire uno alla volta.
4
Guarda la scheda giocabile comparire sulla tela
Una scheda di gioco cade sulla tela. L'app vi inserisce un documento HTML/JS autonomo che parte all'istante in un iframe sandbox. Per un gioco complesso vedrai riempirsi parti etichettate — input, fisica, collisione, rendering, punteggio.
Film Movie StudioRender
3D Tactical Tower DefenseNuovo progetto
File
frame_1frame_2frame_3
Trascina un'immagine qui, o clicca per caricare
reference.png
Chat
Panoramic wide fantasy game sky, warm golden late afternoon sunlight, soft billowing clouds lit from the side, smooth gradient from warm peach and gold at horizon up to deep…
/games → working…
Descrivi cosa vuoi creare…
SkillModelli
5
Gioca al gioco direttamente nella scheda
Clicca nella scheda e gioca subito — i comandi funzionano con tastiera e touch/mouse, e vedi un suggerimento sui comandi a schermo, un HUD del punteggio e uno stato vittoria/sconfitta con un pulsante Riavvia.
Film Movie StudioRender
Fantasy RTS War GameNuovo progetto
File
frame_1frame_2frame_3frame_4
60%
frame_01.png1024²
Generazione… 42%
RemixVarianti
frame_02.png1024²
Generazione… 68%
RemixVarianti
frame_03.png1024²
Generazione… 55%
RemixVarianti
frame_04.png1024²
Generazione… 80%
RemixVarianti
Chat
Seamless tileable top-down albedo texture of lush fantasy meadow grass, warm storybook hand-painted illustration style, soft varied greens with tiny wildflowers, clover and dirt…
/games → working…
Descrivi cosa vuoi creare…
SkillModelli
Consiglio: Trascina l'angolo della scheda per ingrandirla — il gioco si riadatta alla nuova dimensione, così lo provi anche a tutto schermo.
6
Itera chattando le modifiche
Vuoi modifiche? Scrivile in chat: «velocizza il serpente», «aggiungi un secondo livello», «cambia i colori in neon» o «aggiungi un suono di raccolta». L'app modifica il gioco e la scheda si aggiorna. Itera in pochi passaggi mirati.
Film Movie StudioRender
Colorful Kids Quiz GameNuovo progetto
Skill
/games
/short-drama
/image-creator
/audio-studio
/app-builder
/games Majestic climactic shot: the fully revealed colossal whale creature — no longer disguised, its body flowing with whale-like curves and broad fins, glowing bioluminescent cyan…
SkillModelli
Digita / in qualsiasi momento per cambiare skill
7
(Opzionale) Aggiungi grafica o audio IA
Per un aspetto più ricco, chiedi grafica personalizzata — es. «aggiungi una nave disegnata e uno sfondo spaziale». L'app chiede prima se vuoi la versione disegnata in codice (istantanea) o una versione IA (consuma crediti), poi incorpora i media generati direttamente nell'HTML.
Film Movie StudioRender
Battlecraft Fantasy RTSNuovo progetto
File
frame_1frame_2frame_3frame_4frame_5frame_6
60%
frame_01.png1024²
Generazione… 42%
RemixVarianti
frame_02.png1024²
Generazione… 68%
RemixVarianti
frame_03.png1024²
Generazione… 55%
RemixVarianti
frame_04.png1024²
Generazione… 80%
RemixVarianti
frame_05.png1024²
Generazione… 35%
RemixVarianti
frame_06.png1024²
Generazione… 61%
RemixVarianti
Chat
Panoramic fantasy sky plate, warm storybook golden-hour, soft glowing clouds in peach and lavender, distant rolling mountain silhouettes, painterly hand-painted look, 360 horizon…
/games → working…
Descrivi cosa vuoi creare…
SkillModelli
Consiglio: Per arcade, puzzle e quiz bastano forme disegnate in codice, gradienti e bip via Web Audio — istantanei, gratuiti e mantengono il gioco leggero.
8
Esporta il gioco come file .html (clic destro)
Quando sei soddisfatto, fai clic destro sulla scheda di gioco e scegli esporta (o scrivi «esporta il gioco»). Si apre una finestra di salvataggio e l'app esporta un unico file .html autonomo con tutti i media incorporati.
Film Movie StudioRender
Storybook Fantasy RTSNuovo progetto
Skill
/games
/short-drama
/image-creator
/audio-studio
/app-builder
/games Panoramic fantasy storybook sky background, warm golden afternoon sunlight, soft painterly fluffy cumulus clouds, distant green rolling hills and forest silhouettes along the…
SkillModelli
Digita / in qualsiasi momento per cambiare skill
Consiglio: L'esportazione è il passo finale. Fai doppio clic sul .html ottenuto in qualsiasi browser, invialo a qualcuno o caricalo sul web — funziona senza internet e senza l'app.

Cosa ottieni

Hai un gioco finito e davvero giocabile: è nato da una frase, ci hai giocato direttamente nella scheda sulla tela, l'hai messo a punto via chat e l'hai esportato come un unico file .html autonomo. Questo stesso schema — scegli /games → descrivi il gioco → gioca nella scheda → itera in chat → esporta — vale per arcade, puzzle, quiz, platform e 3D moderno con Three.js.

Consigli da esperti

Per i classici 2D (Snake, Pong, 2048) l'app resta su Canvas2D senza dipendenze — si carica sempre e non fallisce mai; per arcade e platform usa Phaser o Kaboom, e per il 3D Three.js con la fisica Rapier.
Chiedi modifiche piccole e precise una alla volta («20% più veloce», «aggiungi un power-up») — iterazioni brevi sono più affidabili di una grande ricostruzione.
Il .html esportato è completamente autonomo (media incorporati come data-URI), quindi puoi semplicemente inviarlo o caricarlo sul web e si gioca in qualsiasi browser, anche offline.

Provalo tu stesso

FilmMovie Studio è un'app desktop che ti accompagna dall'idea all'esportazione finita. Scaricala e inizia a creare.

Ottieni FilmMovie Studio

Crea un gioco giocabile sulla tela: dall'idea all'esportazione .html

Apri un progetto nel Workspace

Film Movie Studio

Scegli lo skill /games

Scrivi la tua idea di gioco in chat

Guarda la scheda giocabile comparire sulla tela

Gioca al gioco direttamente nella scheda

Itera chattando le modifiche

(Opzionale) Aggiungi grafica o audio IA

Esporta il gioco come file .html (clic destro)

Il tuo primo progetto: dal Launchpad all'esportazione finale

Dirigi un cortometraggio: dall'idea agli episodi renderizzati

Foto prodotto per e-commerce: principale, hero, dettaglio e lifestyle in pochi minuti