Come creare giochi Flash
Dì la verità: sin da piccolo sogni di creare da solo un videogioco. Sono infatti parecchi anni che hai questo desiderio nel cassetto e vorresti provare a realizzarlo almeno una volta nella tua vita, anche solamente mediante un esperimento trainato dalla passione. Tuttavia, finora ti sei sempre un po’ trattenuto da questo mondo, in quanto sai bene che un videogioco è complesso da realizzare.
In questo contesto, a noi appassionati spesso viene un’idea comune, ovvero creare dei giochi online con la nostra faccia. Lo step successivo per chi ha un po’ di più anni sulle spalle è dunque ovviamente chiedersi come creare giochi Flash. Te lo dico subito: anche la mia memoria riporta lì, ma quei tempi sono andati, in quanto l’iconico Adobe Flash ha ormai fatto il suo tempo.
In ogni caso, non preoccuparti: questa guida è qui proprio per aggiornarti sulla situazione attuale e per fornirti delle soluzioni alternative che ti consentiranno comunque di raggiungere il tuo intento. Vedrai: il passare degli anni ha reso tutto più semplice e al giorno d’oggi è addirittura possibile incontrare il favore di molti altri appassionati online anche con semplici esperimenti. Insomma, se il tuo intento è quello di provare a realizzare qualche piccolo progetto per passione, le indicazioni presenti di seguito possono fornirti alcuni spunti. Non mi resta che augurarti buona lettura e buon divertimento!
Indice
Informazioni preliminari
Visto che ti stai chiedendo come creare giochi Flash, ci tengo a fornirti un quadro generale relativo alla situazione legata a questa tipologia di titoli, prima ovviamente di approfondire soluzioni che potrebbero tornarti utili.
Ebbene, quando noi appassionati con un po’ più di anni sulle spalle ci chiediamo come creare dei giochi online, spesso pensiamo ad Adobe Flash per un motivo: ha accompagnato per lungo tempo le nostre sessioni online, in cui eravamo soliti fare esperienze con miriadi di titoli direttamente tramite browser. Tuttavia, ormai quei tempi se ne sono andati, o meglio: tutto è cambiato.
Dal 12 gennaio 2021, infatti, Adobe ha deciso di bloccare l’esecuzione di contenuti in Flash, anche per motivi di sicurezza (il software era semplicemente diventato obsoleto). In parole povere, Adobe Flash Player e tutto ciò che ricordi di quell’epoca è ormai inutilizzato, al netto di qualche progetto open source mirato a preservare vecchi giochi (a tal proposito, se proprio ci tieni, potresti voler dare un’occhiata a BlueMaxima’s Flashpoint, che contiene oltre 100.000 titoli).
In questo contesto, capisci bene che realizzare un gioco in Flash diventa pressoché impossibile o quantomeno poco utile in termini pratici. Comprendo però che tu possa essere rimasto un po’ a quei tempi (non troppo lontani, in realtà) e dunque ci tengo a farti sapere che quel mondo per certi versi esiste ancora: si è semplicemente evoluto. Infatti, ciò che gli appassionati sfruttano al giorno d’oggi per realizzare titoli giocabili direttamente da browser e fare esperimenti di questo tipo è l’HTML5, diventato per certi versi un sostituto più avanzato di Flash.
Insomma, nonostante la soluzione di Adobe se ne sia ormai andata, questo non significa che non è possibile raggiungere comunque il tuo obiettivo principale: realizzare un mini-gioco con la tua faccia e pubblicarlo online, in modo magari da mostrarlo agli amici o agli utenti della community. Credimi: il Web pullula di persone che non vedono l’ora di provare nuovi esperimenti, anche di pochi secondi, realizzati da appassionati come te. Ebbene, fare progetti in HTML5 non è poi così complesso (certo, tutto dipende dalle tue ambizioni, ma se fai tutto per svago vedrai che non avrai troppi problemi, seguendo i giusti accorgimenti).
In ogni caso, come avrai ben capito, in questa guida mi soffermerò su ciò che puoi fare per arrivare, in era post-Flash, a creare e condividere un semplice gioco con la tua faccia in HTML5. Insomma, proseguendo con la lettura del tutorial potresti trovare pane per i tuoi denti.
Come creare un gioco in HTML5
Ora che sei a conoscenza della situazione generale relativa all’addio ad Adobe Flash, direi che è giunto il momento di andare oltre e vedere cosa puoi effettivamente fare per creare un semplice mini-gioco con la tua faccia, ovviamente sfruttando l’HTML5. Qui sotto puoi trovare le principali soluzioni utilizzate solitamente dagli appassionati.
Unity
La situazione relativa alla creazione di questi mini-giochi è cambiata molto rispetto al passato, ovvero all’epoca Flash. Infatti, in quel periodo esistevano parecchi portali che consentivano di creare giochi direttamente da browser, mentre ora si punta maggiormente su programmi esterni in ambito HTML5. Infatti, l’evoluzione tecnologica al giorno d’oggi permette potenzialmente di far girare direttamente all’interno di un browser come Google Chrome titoli dal discreto comparto tecnico 3D. Nota bene: per via di modifiche alle policy arrivate a settembre 2023, viene adesso chiesto ai developer di pagare una somma (ad esempio, 20 centesimi) a fronte di ogni installazione di un gioco realizzato con Unity, ma si fa riferimento a una questione relativa, a partire dal 2024, solamente a sviluppatori di giochi particolarmente popolari (oltre il milione di dollari all’anno) e il piano Personal rimane gratuito.
In ogni caso, se vuoi comprendere meglio a cosa mi riferisco, ti basta provare semplicemente dare un’occhiata, ad esempio, al progetto Stuck! by chkkll pubblicato su itch.io, premendo sul pulsante Run game, sfruttando la barra spaziatrice e utilizzando i classici pulsanti WASD per farti spazio tra la folla, come previsto dal gioco. Insomma, come avrai ben notato, si possono realizzare degli esperimenti interessanti in 3D (conta però che potrebbe esserti richiesto un po’ di lavoro in termini di ottimizzazione per far girare tutto su browser). In che modo è riuscito l’appassionato coinvolto a fare questo? Mediante il motore grafico Unity, usato anche da professionisti del settore. Puoi trovare molti titoli creati in questo modo, giusto per farti un’idea, nella sezione relativa ai giochi HTML5 realizzati in Unity di itch.io.
In parole povere, i mondi dello sviluppo di giochi per browser per passione o per lavoro si sono intersecati sempre di più col passare degli anni, tanto che lo strumento di base utilizzato per realizzare titoli in HTML5 è essenzialmente lo stesso. Sviluppare mini-giochi potrebbe sembrarti un po’ più faticoso rispetto all’epoca Flash, in cui spesso bastavano pochi clic, ma in realtà non è propriamente così. Infatti, se vuoi provare a fare sul serio, vedrai che seguendo il mio tutorial su come usare Unity riuscirai in relativamente poco tempo a raggiungere il tuo obiettivo (specialmente se ciò che ti interessa è semplicemente passare per semplici asset 2D).
In ogni caso, ritengo sia ben poco utile farti un esempio specifico relativo alla creazione di un gioco con la tua faccia in Unity, in quanto il senso di realizzare un videogioco è proprio mettere in campo la propria creatività. Per questo motivo, per quel che concerne i classici motori grafici, in questa sede preferisco semplicemente rimandarti alla guida che ho citato in precedenza, in cui ho spiegato nel dettaglio un po’ tutto ciò che devi sapere relativamente a questo mondo.
Al netto di questo, ci tengo a farti sapere che online puoi trovare parecchi altri programmi utili a creare giochi in HTML5. Tra i più popolari c’è Phaser, un framework open source generalmente apprezzato dalla community, che permette di effettuare qualche rapido esperimento in modo relativamente più semplice rispetto a Unity (se sei interessato e conosci un po’ l’inglese, potresti voler dare un’occhiata alla sezione Learn del portale ufficiale di Phaser, da cui puoi eventualmente partire per provare a realizzare il tuo primo gioco di questo tipo).
Per il resto, ti consiglio di proseguire con la lettura del tutorial, in quanto mi appresto a fornirti dettagli specifici su una soluzione meno professionale ma molto più semplice, nonché sulle procedure necessarie all’effettiva pubblicazione del gioco su itch.io, ovvero una delle più popolari piattaforme indipendenti per i giochi. Devi infatti sapere che quest’ultima accoglie qualsivoglia esperimento, anche in ambito di titoli per browser (come hai visto in precedenza tramite gli esempi che ti ho indicato per mostrarti le potenzialità offerte da questa soluzione).
GDevelop
Come dici? Quanto espresso nel capitolo precedente non ti ha convinto, in quanto non hai molto tempo da dedicare a questo progetto, non ti ritieni all’altezza per utilizzare soluzioni avanzate o vorresti fare tutto in pochi clic, come ai vecchi tempi di Flash? Ebbene, nonostante non esistano purtroppo molte soluzioni valide per fare questo, penso di avere uno specifico servizio che può fare al caso tuo: mi riferisco a GDevelop, soluzione che andrebbe usata in modo completo a livello desktop (come ho spiegato nel mio tutorial su come creare un gioco) ma che in realtà dispone anche di un semplice e rapido editor per browser (utile per realizzare esperimenti al volo, proprio come si faceva in era Flash).
Per sfruttare questa soluzione, ti basta collegarti al portale ufficiale di GDevelop e premere sul pulsante Try it online. A questo punto, accederai alla pagina principale dell’editor, che ti consente tra l’altro eventualmente di selezionare preset già fatti, in modo da non partire da zero e semplificarti la vita (d’altronde, se stai facendo tutto per passione, probabilmente non hai particolari esigenze da questo punto di vista, dato che al massimo pubblicherai tutto per puro divertimento e non per scopi commerciali). In ogni caso, eventualmente, se vuoi fare tutto da zero, puoi premere sul tasto CREATE A BLANK PROJECT, collocato in alto a destra.
In questo caso, dato che il tuo scopo probabilmente è semplicemente creare un gioco con la tua faccia, ti consiglio di fare clic sul riquadro Geometry monster (che dovrebbe essere il primo in alto a sinistra, presente nella sezione Start from an example), premendo poi sul tasto OPEN per iniziare. Ti verrà inoltre richiesto di dare un titolo al progetto, nonché di fare clic sul pulsante CREATE PROJECT, espandere la voce Scenes e premere sul riquadro Level1, ma poi ti troverai effettivamente all’interno dell’editor che ti consente di creare il tuo gioco in HTML5.
A questo punto, stai usufruendo di un semplice gioco già fatto, quindi non mi resta che spiegarti semplicemente come cambiare il protagonista mettendo la tua faccia, in modo da farti quantomeno comprendere il funzionamento di base del servizio che ti ho indicato. Per procedere, fai dunque clic destro sul mostro giallo collocato in basso e seleziona l’opzione Edit Object Monster. Perfetto, adesso comparirà a schermo una finestra che ti mostrerà le immagini usate per generare le animazioni del protagonista.
In alto c’è MonsterIdle, ovvero i movimenti che fa il mostro quando è fermo, mentre in basso c’è MonsterDead, ovvero come appare il mostro quando viene sconfitto. Hai già probabilmente compreso cosa puoi fare: sostituire le immagini del mostro con tue foto, in modo che all’interno del mini-gioco ci sia la tua faccia e non il mostro. Ti faccio un semplice esempio per farti comprendere come procedere.
A tal proposito, ti consiglio di fare clic sul pulsante ADD, presente nella sezione MonsterDead, spostandoti poi nella scheda CHOOSE A FILE, presente in alto a destra. A questo punto, puoi usare un qualsiasi URL pubblico che punta a una tua foto (chiaramente ti consiglio di fare uso di un’immagine PNG con trasparenza e ridimensionata come vuoi farla apparire). Te la faccio il più semplice possibile: per caricare una tua foto online da usare nel gioco, ti basta collegarti al portale Imgur, fare clic sul tasto New post presente in alto a sinistra e trascinare dal tuo PC la foto di tuo interesse nello spazio Drop images here.
Dopodiché, ti basta fare clic destro sull’immagine e selezionare l’opzione Apri immagine in un’altra scheda (questo è necessario per ottenere un link, che compare in alto, che punta direttamente all’immagine). In alternativa, puoi fare riferimento alla mia guida su come caricare foto online per maggiori dettagli (ma fai attenzione al fatto che non tutti i link generati dai servizi di terze parti potrebbero funzionare per il tuo scopo).
In ogni caso, quel che è importante è copiare l’URL fornito dal servizio usato per caricare online la foto e incollarlo nell’apposito campo Use an URL di GDevelop. Dopodiché, premi sul pulsante CHOOSE e, se tutto è stato svolto correttamente, vedrai comparire la tua foto nella zona Animation. Chiaramente, ti consiglio di fare clic destro sull’animazione già presente, selezionando la voce Delete selection, in modo che ci sia solamente la tua foto in basso.
Perfetto, adesso non ti resta che fare clic sul tasto APPLY, così da applicare le modifiche, premendo in seguito sul tasto PREVIEW, collocato in alto. A questo punto, prova a prendere le bombe, in modo da perdere la partita, guardando poi cosa succede. Complimenti, hai giocosamente inserito la tua faccia in un mini-game.
Chiaramente, in questa sede ti ho indicato un esempio che può semplicemente farti divertire un po’ (d’altronde, come già spiegato, consiglio altre soluzioni per realizzare progetti più professionali). Tuttavia, se vuoi approfondire ulteriormente cosa si può fare con questo strumento, ti consiglio di fare riferimento alla documentazione ufficiale di GDevelop in inglese, in modo da andare oltre (chiaramente è impensabile spiegarti come creare un titolo intero in una singola guida, ma l’obiettivo di questo tutorial è principalmente quello di indirizzarti verso i giusti strumenti, anche se poi sarai tu a dover mettere in campo la tua creatività).
Come pubblicare un gioco in HTML
Adesso che sei a conoscenza delle principali possibilità relative a come creare un gioco in HTML5, direi di passare all’eventuale fase di pubblicazione del gioco, dato che potrebbe interessarti mostrare tutto ai tuoi amici e soprattutto all’ampia community online che è solita provare essenzialmente qualsiasi produzione o esperimento totalmente indipendente.
In questo ambito, la soluzione più interessante è probabilmente quella di pubblicare gratuitamente il proprio gioco su itch.io, nota piattaforma indie che raccoglie miriadi di esperimenti di appassionati come te. Infatti, si tratta di uno store che accoglie di tutto e garantisce totale libertà creativa, quindi è perfetto per test come quelli che potresti aver svolto tu a partire da questo tutorial.
In ogni caso, la procedura per pubblicare un gioco su itch.io varia a seconda del fatto che tu abbia deciso di usare Unity o GDevelop, ma in entrambi i casi c’è questa possibilità. Partendo da Unity, una volta aperto il progetto del gioco, devi recarti nel percorso File > Build Settings, selezionare WebGL nella sezione Platform ed eventualmente premere sul pulsante Switch platform (se originariamente hai sviluppato il gioco per un’altra piattaforma). Potresti dover attendere che il progetto venga convertito per supportare la nuova piattaforma selezionata.
Dopodiché, premi sul tasto Build e seleziona la cartella dove vuoi salvare il risultato (ad esempio, il Desktop). Piccolo consiglio: in alcuni casi, potrebbe interessarti recarti nel percorso Edit > Project Settings, selezionare la scheda Player dalla sinistra, espandere la voce Publishing Settings e impostare l’opzione Compression format in Disabled (ad esempio, se vedi che il tuo gioco ci mette molto a caricarsi o proprio non si carica una volta effettuato l’upload su itch.io).
Perfetto, ora potresti dover attendere un po’ di tempo affinché vengano generati tutti i file necessari al corretto funzionamento del tuo gioco, ma poi vedrai che troverai tutto ciò di cui hai bisogno, ovvero il file index.html (aprendolo localmente purtroppo non accadrà nulla, in quanto questo tipo di operazione è vietata a livello locale, quindi dovrai pubblicare o visualizzare un’anteprima del gioco direttamente su itch per vedere se effettivamente funziona) e le varie altre cartelle necessarie (che generalmente sono TemplateData e Build).
Perfetto, adesso non ti resta che selezionare tutti i file del gioco e comprimerli in un unico file ZIP. Per fare questo, ad esempio, su Windows 11, ti basta selezionare i file, fare clic destro e utilizzare l’opzione Comprimi nel file ZIP, in modo da ottenere l’apposita cartella compressa.
Ottimo, ora sei pronto per la pubblicazione del tuo gioco creato in Unity su itch.io. Per fare questo, collegati al sito Web ufficiale di itch.io e fai clic sul pulsante Create an account now, compilando poi il modulo che compare a schermo con i dati richiesti (ovvero username, password e indirizzo e-mail) e premendo sul tasto Create account (ovviamente spuntando la casella I accept the Terms of Service).
Dopodiché, fai clic sul pulsante Create new project e accederai in questo modo alla pagina per inviare il tuo gioco. Qui dovrai semplicemente inserire tutti i dati richiesti (dal titolo al prezzo: ti consiglio inoltre di selezionare No payments nella sezione Pricing, se stai semplicemente facendo tutto per passione e vuoi rendere il gioco totalmente gratuito, evitando anche le donazioni). Il parametro importante da selezionare è quello Kind of project, in cui è chiaramente necessario impostare HTML.
Per il resto, si possono aggiungere eventuali video gameplay, immagini e molto altro. Una volta sistemato tutto, premi sul tasto Upload files e carica dunque la cartella compressa creata in precedenza, spuntando poi la casella This file will be played in the browser. Dopodiché, quando sei pronto, ti basta fare clic sul pulsante Save & view page, in modo da visualizzare un’anteprima in merito a come comparirà il gioco su itch.io.
Adesso, premi sul tasto Got it e controlla che il gioco funzioni. Dopodiché, potrai eventualmente premere sul tasto Edit theme, presente in alto a sinistra, così da sistemare tutto anche a livello grafico. Per il resto, una volta che hai verificato che il titolo funziona, ti basta premere sul tasto Edit game, collocato in alto a sinistra, spuntando poi la casella Public presente in basso e premendo sul tasto Save. Complimenti, hai correttamente pubblicato il tuo gioco HTML5 realizzato in Unity su itch.io e ti basta eventualmente condividere il link presente nella barra degli URL per mostrarlo ai tuoi amici.
Se hai invece realizzato il gioco in GDevelop, ti basta fare clic sul pulsante PUBLISH, presente in alto nell’editor, selezionare la voce PUBLISH ON STORES, fare clic sul tasto EXPORT AS A HTML5 GAME e creare un account per effettuare l’esportazione (puoi anche eventualmente premere sul collegamento PUBLISH YOUR GAME ON ITCH.IO per ottenere informazioni specifiche in merito, ma in realtà, una volta ottenuti i giusti file, ti basterà seguire esattamente quanto ho illustrato in precedenza, ovvero seguire la procedura di pubblicazione prevista da itch.io).
Insomma, adesso sei a conoscenza di tutto ciò che devi sapere in merito alla possibilità di realizzare e pubblicare un gioco in HTML5. Non ti resta che esprimere la tua creatività: buon divertimento!
Autore
Salvatore Aranzulla
Salvatore Aranzulla è il blogger e divulgatore informatico più letto in Italia. Noto per aver scoperto delle vulnerabilità nei siti di Google e Microsoft. Collabora con riviste di informatica e cura la rubrica tecnologica del quotidiano Il Messaggero. È il fondatore di Aranzulla.it, uno dei trenta siti più visitati d'Italia, nel quale risponde con semplicità a migliaia di dubbi di tipo informatico. Ha pubblicato per Mondadori e Mondadori Informatica.
