Questa è una guida avanzata. Mostreremo come partire da un'idea semplice ("un runner infinito che schiva ostacoli al neon") per costruire un vero gioco 3D che gira direttamente sulla tela di FilmMovie Studio dentro un iframe in sandbox. Il gioco viene creato come un unico file HTML autonomo: Three.js gestisce scena, camera e rendering, il motore fisico Rapier guida movimento e collisioni, e il post-processing (bloom, tone mapping) rifinisce l'aspetto. La chiave è il ritmo — l'IA non invia tutto il gioco in una volta; lo assembla in piccoli pezzi, così vedi il mondo crescere e ogni round resta veloce. Alla fine hai un gioco giocabile che scarichi come singolo .html e apri in qualsiasi browser senza installazione.
Cosa ti serve
- Completata la guida «Per iniziare» — sai creare un progetto e usare la tela e la chat.
- Un fornitore di generazione configurato nelle Impostazioni (per eventuali texture, skybox e suoni via generate_image / generate_audio).
- Un'idea chiara per un loop di gioco — un verbo, un obiettivo e una condizione di sconfitta (es. «schiva gli ostacoli, raccogli cristalli, uno schianto termina la corsa»).
Passo dopo passo
- 1
Avvia lo skill /threejs-game
Nel progetto apri la chat e scegli l'icona dello skill, oppure scrivi semplicemente /threejs-game. Questo skill è per 3D, Three.js e giochi premium — per i classici 2D (Snake, Pong, un quiz) usa invece /games. Aggiungi la tua idea subito dopo il comando.
Film Movie StudioRenderFantasy RTS War GameNuovo progettoCerca skill…TuttiWorkflowRapidivideoShort DramaViral vertical mini-series, end to end.imageImage CreatorGenerate single images from a prompt.audioAudio StudioVoiceover, SFX and music tracks.copyApp BuilderMulti-screen apps with live preview.imageE-commerce DesignPro product shots for any platform.videoMusic VideoBeat-synced clips cut to your track.Consiglio: Conviene indicare se punti a desktop, touch o entrambi — incide su comandi e HUD. - 2
Descrivi il loop di gioco in una frase
In chat scrivi il loop come verbo + obiettivo + pressione + ricompensa + sconfitta, es. «Runner infinito: corri in avanti, schiva ostacoli al neon, raccogli cristalli per punti, uno schianto termina la corsa e riparte». Se la richiesta è vaga, l'IA chiede una volta genere, direzione artistica e dispositivo target — rispondi e continua a costruire.
Film Movie StudioRenderFantasy RTS War GameNuovo progettoSkill/threejs-game/short-drama/image-creator/audio-studio/app-builder/threejs-game Texture albedo dall'alto, ripetibile senza giunture, di rigogliosa erba di prato fantasy, caldo stile illustrativo dipinto a mano da libro di fiabe, verdi morbidi e variegati con minuscoli fiori di campo,…
SkillModelliDigita / in qualsiasi momento per cambiare skill
Consiglio: Descrivi l'intento, non il codice. Lo skill legge da sé il flusso e sceglie geometria, fisica ed effetti. - 3
Guarda comparire la scheda di gioco (lo shell)
Il primo passo dell'IA (create_game) apre una scheda di gioco sulla tela con solo uno «shell» — lo scheletro: una tela a schermo intero, l'HUD, un overlay di avvio e il renderer/scena/camera di Three.js. Three.js e Rapier si caricano da una CDN tramite un importmap. Lo shell è volutamente piccolo perché la scheda non lo rifiuti.
Film Movie StudioRenderFantasy RTS War GameNuovo progettoFile
frame_1.png
frame_2.png
frame_3.png
frame_4.png
frame_5.png
frame_6.png60%promptframe_01.pngRemixframe_02.pngRemixframe_03.pngRemixframe_04.pngGenerazione… 80%Remixoutput - 4
Lascia crescere il gioco pezzo per pezzo (append_game_code)
Ora l'IA chiama append_game_code molte volte — un sistema per round: input del giocatore, un corpo e un collider Rapier, lo spawner di ostacoli, lo step update(dt), il costruttore del mondo, i materiali e i VFX. Un gioco 3D premium ne ha facilmente 15–25. La scheda prende vita dopo ogni pezzo, davanti a te.
Film Movie StudioRenderFantasy RTS War GameNuovo progettoFileframe_1.pngframe_2.pngframe_3.png60%promptframe_01.pngRemixframe_02.pngRemixframe_03.pngGenerazione… 55%RemixoutputConsiglio: Questo ritmo è voluto, non lentezza — ogni round è veloce e vedi il mondo accumularsi. - 5
Giocalo in linea nella scheda
Clicca l'overlay di avvio nella scheda e gioca in linea nell'iframe in sandbox — tastiera e mouse su desktop, o touch su mobile. La fisica Rapier gestisce salti, schianti e cadute; dopo una sconfitta il gioco deve ripartire pulito (nessuna entità, timer o listener residui).
Film Movie StudioRenderFantasy RTS War GameNuovo progettoFileframe_1.pngframe_2.pngframe_3.pngframe_4.png60%promptframe_01.pngGenerazione… 42%Remixframe_02.pngGenerazione… 68%Remixframe_03.pngGenerazione… 55%Remixframe_04.pngGenerazione… 80%Remixoutput - 6
Aggiungi texture, uno skybox e suoni
Per un aspetto premium fai generare all'IA almeno una texture eroica o uno skybox (generate_image) e gli SFX principali — salto, raccolta, schianto — più un tappeto musicale (generate_audio). Il percorso del file viene inserito automaticamente direttamente nell'HTML del gioco, così un'immagine diventa una vera texture e un suono un vero SFX, senza passaggio di upload.
Film Movie StudioRenderFantasy RTS War GameNuovo progettoFileframe_1.pngframe_2.pngframe_3.pngframe_4.png
frame_5.pngTrascina un'immagine qui, o clicca per caricare
reference.pngConsiglio: Genera ogni asset una sola volta — l'IA tiene traccia di ciò che esiste già sulla tela e non lo ripete. - 7
Itera via chat
Rifinisci il gioco in linguaggio naturale in chat: «velocizza gli ostacoli», «aggiungi un secondo tipo di ostacolo con telegrafo», «abbassa il bloom», «sistema il salto, è troppo fluttuante». L'IA integra via append_game_code o riscrive con update_game, e tu rigiochi subito. Cambia una cosa e prova.
Film Movie StudioRenderFantasy RTS War GameNuovo progettoSkill/threejs-game/short-drama/image-creator/audio-studio/app-builder/threejs-game Texture albedo dall'alto, ripetibile senza giunture, di rigogliosa erba di prato fantasy, caldo stile illustrativo dipinto a mano da libro di fiabe, verdi morbidi e variegati con minuscoli fiori di campo,…
SkillModelliDigita / in qualsiasi momento per cambiare skill
- 8
Esporta il gioco come singolo .html
Quando sei soddisfatto, chiedi l'export — l'IA chiama export_game_html e scarichi un file .html autonomo. Si apre in qualsiasi browser senza installazione e senza server, pronto da condividere o caricare sul web. È il passo finale.
Film Movie StudioRenderFantasy RTS War GameNuovo progettoFileframe_1.pngframe_2.pngframe_3.pngTrascina un'immagine qui, o clicca per caricare
reference.pngConsiglio: L'export è l'ultimo passo. Per altre modifiche, regola il gioco in chat ed esporta di nuovo.
Cosa ottieni
Da una sola frase hai un gioco 3D giocabile che girava direttamente sulla tela: una scena Three.js, movimento e collisioni tramite la fisica Rapier, un aspetto rifinito col post-processing e un HUD con stati per pausa, sconfitta e riavvio. Dopo aver iterato in chat l'hai esportato come un unico .html autonomo che si apre in qualsiasi browser senza installazione e senza server — pronto da condividere o caricare sul web.
Consigli da esperti
- Per i classici 2D (Snake, Pong, 2048, un quiz) usa /games — /threejs-game paga sempre il costo di una pipeline WebGL completa ed è adatto a 3D e giochi premium.
- Non aspettarti modelli 3D pronti: le forme sono geometria procedurale di Three.js; generate_image dà texture, skybox, decal e UI — non personaggi riggati.
- Dopo ogni modifica gioca un breve loop e regola un asse alla volta (velocità, salto, numero di ostacoli) per vedere esattamente cosa ha aiutato.
Provalo tu stesso
FilmMovie Studio è un'app desktop che ti accompagna dall'idea all'esportazione finita. Scaricala e inizia a creare.
Ottieni FilmMovie Studio