Come creare un gioco in flash: 4 passaggi (con immagini)

Sommario:

Come creare un gioco in flash: 4 passaggi (con immagini)
Come creare un gioco in flash: 4 passaggi (con immagini)
Anonim

Flash è un formato popolare per i videogiochi basati su browser visti su siti come Newgrounds e Kongregate. Mentre il formato Flash sta lentamente diventando meno utilizzato di fronte alla crescita delle app mobili, molti giochi di qualità vengono ancora realizzati con esso. Flash utilizza ActionScript, un linguaggio di facile apprendimento che consente di controllare gli oggetti sullo schermo. Questo articolo di wikiHow ti insegnerà come imparare a creare un gioco Flash di base.

Passi

Parte 1 di 3: avvio del processo

381698 1
381698 1

Passaggio 1. Progetta il tuo gioco

Prima di iniziare a programmare, sarà utile avere un'idea approssimativa di cosa vuoi che faccia il tuo gioco. Flash è più adatto per i giochi semplici, quindi concentrati sulla creazione di un gioco che abbia solo poche meccaniche di cui il giocatore possa preoccuparsi. Cerca di avere in mente un genere di base e alcuni meccanismi prima di iniziare a creare prototipi. Consulta questa guida per maggiori dettagli sulle fasi di pianificazione dello sviluppo dei videogiochi. I giochi Flash comuni includono:

  • Corridori infiniti: questi giochi spostano automaticamente il personaggio e il giocatore è responsabile di saltare gli ostacoli o interagire in altro modo con il gioco. Il giocatore in genere ha solo una o due opzioni quando si tratta di controlli.
  • Brawlers: questi sono in genere lo scorrimento laterale e incaricano il giocatore di sconfiggere i nemici per progredire. Il personaggio del giocatore ha spesso diverse mosse che può eseguire per sconfiggere i nemici.
  • Puzzle: questi giochi chiedono al giocatore di risolvere enigmi per superare ogni livello. Questi possono variare dallo stile Match-3 come Bejeweled alla risoluzione di enigmi più complessi che si trovano tipicamente nei giochi di avventura.
  • Giochi di ruolo: questi giochi si concentrano sullo sviluppo e la progressione del personaggio e fanno muovere il giocatore in più ambienti con una varietà di tipi di nemici. Le meccaniche di combattimento variano notevolmente da RPG a RPG, ma molte sono a turni. I giochi di ruolo possono essere molto più difficili da codificare rispetto a un semplice gioco d'azione.
381698 2
381698 2

Passaggio 2. Scopri in cosa eccelle Flash

Flash è più adatto per i giochi 2D. È possibile creare giochi 3D in Flash, ma è molto avanzato e richiede una conoscenza significativa del linguaggio. Quasi tutti i giochi Flash di successo sono stati in 2D.

I giochi in flash sono anche più adatti per sessioni veloci. Questo perché la maggior parte dei giocatori di giochi Flash gioca quando ha un po' di tempo libero, ad esempio durante le pause, il che significa che le sessioni di gioco sono in genere di 15 minuti o meno

381698 3
381698 3

Passaggio 3. Acquisire familiarità con il linguaggio ActionScript3 (AS3)

I giochi flash sono programmati in AS3 e dovrai avere una conoscenza di base di come funziona per creare con successo un gioco. Puoi creare un gioco semplice con una conoscenza rudimentale di come codificare in AS3.

Ci sono diversi libri su ActionScript disponibili su Amazon e altri negozi, insieme a un gran numero di tutorial ed esempi online

381698 4
381698 4

Passaggio 4. Scarica Flash Professional

Questo programma costa denaro, ma è il modo migliore per creare programmi Flash rapidamente. Sono disponibili altre opzioni, comprese le opzioni open source, ma spesso mancano di compatibilità o impiegano più tempo per svolgere le stesse attività.

Flash Professional è l'unico programma di cui avrai bisogno per iniziare a creare giochi

Parte 2 di 3: scrivere un gioco di base

381698 5
381698 5

Passaggio 1. Comprendere gli elementi costitutivi di base del codice AS3

Quando crei un gioco di base, ci sono diverse strutture di codice che utilizzerai. Ci sono tre parti principali di qualsiasi codice AS3:

  • Variabili: ecco come vengono archiviati i tuoi dati. I dati possono essere numeri, parole (stringhe), oggetti e altro. Le variabili sono definite dal codice var e devono essere una parola.

    var playerSalute:Numero = 100; // "var" indica che stai definendo una variabile. // "playerHealth" è il nome della variabile. // "Numero" è il tipo di dati. // "100" è il valore assegnato alla variabile. // Tutte le righe dell'actionscript terminano con ";"

  • Gestori di eventi: i gestori di eventi cercano cose specifiche che si verificano e quindi comunicano il resto del programma. Questo è essenziale per l'input del giocatore e la ripetizione del codice. I gestori di eventi in genere richiamano le funzioni.

    addEventListener(MouseEvent. CLICK, swingSword); // "addEventListener()" definisce il gestore dell'evento. // "MouseEvent" è la categoria dell'input che viene ascoltato. // ". CLICK" è l'evento specifico nella categoria MouseEvent. // "swingSword" è la funzione che viene chiamata quando si verifica l'evento.

  • Funzione - Sezioni di codice assegnate a una parola chiave che possono essere richiamate in seguito. Le funzioni gestiscono la maggior parte della programmazione del tuo gioco e i giochi complessi possono avere centinaia di funzioni mentre i giochi più semplici possono averne solo alcune. Possono essere in qualsiasi ordine poiché funzionano solo quando vengono chiamati.

    funzione swingSword (e:MouseEvent):void; { //Il tuo codice va qui } // "funzione" è la parola chiave che appare all'inizio di ogni funzione. // "swingSword" è il nome della funzione. // "e:MouseEvent" è un parametro aggiunto, che mostra che la funzione // viene chiamata dal listener di eventi. // ":void" è il valore restituito dalla funzione. Se nessun valore // viene restituito, usa:void.

381698 6
381698 6

Passaggio 2. Crea un oggetto

ActionScript viene utilizzato per influenzare gli oggetti in Flash. Per creare un gioco, dovrai creare oggetti con cui il giocatore interagirà. A seconda delle guide che stai leggendo, gli oggetti possono essere indicati come sprite, attori o filmati. Per questo semplice gioco, creerai un rettangolo.

  • Apri Flash Professional se non l'hai già fatto. Crea un nuovo progetto ActionScript 3.
  • Fare clic sullo strumento di disegno Rettangolo dal pannello Strumenti. Questo pannello può trovarsi in posizioni diverse a seconda della configurazione di Flash Professional. Disegna un rettangolo nella finestra della scena.
  • Seleziona il rettangolo usando lo strumento Selezione.
381698 7
381698 7

Passaggio 3. Assegna proprietà all'oggetto

Con il rettangolo appena creato selezionato, apri il menu Modifica e seleziona "Converti in simbolo". Puoi anche premere F8 come scorciatoia. Nella finestra "Converti in simbolo", assegna all'oggetto un nome facilmente riconoscibile, ad esempio "nemico".

  • Trova la finestra Proprietà. Nella parte superiore della finestra, ci sarà un campo di testo vuoto etichettato "Nome istanza" quando ci passi sopra con il mouse. Nominalo come quando lo hai convertito in un simbolo ("nemico"). Questo crea un nome univoco con cui è possibile interagire tramite il codice AS3.
  • Ogni "istanza" è un oggetto separato che può essere influenzato dal codice. Puoi copiare l'istanza già creata più volte facendo clic sulla scheda Libreria e trascinando l'istanza sulla scena. Ogni volta che ne aggiungi uno, il nome verrà modificato per indicare che si tratta di un oggetto separato ("nemico", "nemico1", "nemico2", ecc.).
  • Quando si fa riferimento agli oggetti nel codice, è sufficiente utilizzare il nome dell'istanza, in questo caso "nemico".
381698 8
381698 8

Passaggio 4. Scopri come modificare le proprietà di un'istanza

Una volta creata un'istanza, è possibile modificare le proprietà tramite AS3. Ciò consente di spostare l'oggetto sullo schermo, ridimensionarlo e così via. Puoi modificare le proprietà digitando l'istanza, seguita da un punto ".", seguito dalla proprietà, seguito dal valore:

  • nemico.x = 150; Ciò influenza la posizione dell'oggetto nemico sull'asse X.
  • nemico.y = 150; Ciò influenza la posizione dell'oggetto nemico sull'asse Y. L'asse Y viene calcolato dalla parte superiore della scena.
  • nemico.rotazione = 45; Ruota l'oggetto nemico di 45° in senso orario.
  • nemico.scalaX = 3; Allunga la larghezza dell'oggetto nemico di un fattore 3. Un numero (-) capovolgerà l'oggetto.
  • nemico.scalaY = 0,5; Schiaccia l'oggetto a metà della sua altezza.
381698 9
381698 9

Passaggio 5. Esaminare il comando trace()

Questo comando restituirà i valori correnti per oggetti specifici ed è utile per determinare se tutto funziona come dovrebbe. Potresti non voler includere il comando Trace nel codice finale, ma è utile per il debug.

381698 10
381698 10

Passaggio 6. Crea un gioco di base utilizzando le informazioni di cui sopra

Ora che hai una conoscenza di base delle funzioni principali, puoi creare un gioco in cui il nemico cambia dimensione ogni volta che fai clic su di esso, finché non si esaurisce.

var nemicoHP:Numero = 100; // imposta gli HP (salute) del nemico a 100 all'inizio. var playerAttack:Number = 10; // imposta la potenza di attacco dei giocatori quando fanno clic. nemico.addEventListener(MouseEvent. CLICK, attackEnemy); // Aggiungendo questa funzione direttamente all'oggetto nemico, // la funzione si attiva solo quando si fa // clic sull'oggetto stesso, invece di fare clic in qualsiasi punto dello schermo. setEnemyLocation(); // Questo chiama la seguente funzione per posizionare il nemico // sullo schermo. Ciò si verifica all'avvio del gioco. function setEnemyLocation ():void { nemico.x = 200; // sposta il nemico a 200 pixel dalla sinistra dello schermo nemico.y = 150; // sposta il nemico in basso di 150 pixel dalla parte superiore dello schermo nemico.rotation = 45; // ruota il nemico di 45 gradi in senso orario trace("il valore x del nemico è", nemico.x, "e il valore y del nemico è", nemico.y); // Visualizza la posizione corrente del nemico per il debug } function attackEnemy (e:MouseEvent):void // Crea la funzione di attacco per quando si fa clic sul nemico { nemicoHP = nemicoHP - playerAttack; // Sottrae il valore di attacco dal valore HP, // risulta nel nuovo valore HP. nemico.scaleX = nemicoHP / 100; // Modifica la larghezza in base al nuovo valore HP. // Viene diviso per 100 per trasformarlo in un decimale. nemico.scaleY = nemicoHP / 100; // Cambia l'altezza in base alla nuova traccia del valore HP("Il nemico ha", nemicoHP, "HP sinistra"); //Emetti quanti HP sono rimasti al nemico }

381698 11
381698 11

Passaggio 7. Provalo

Una volta creato il codice, puoi testare il tuo nuovo gioco. Fare clic sul menu Controllo e selezionare Prova filmato. Il gioco inizierà e potrai fare clic sull'oggetto nemico per modificarne le dimensioni. Gli output di Trace verranno visualizzati nella finestra Output.

Parte 3 di 3: apprendimento di tecniche avanzate

381698 12
381698 12

Passaggio 1. Scopri come funzionano i pacchetti

ActionScript è basato su Java e utilizza un sistema di pacchetti molto simile. I pacchetti consentono di memorizzare variabili, costanti, funzioni e altre informazioni in file separati e quindi importare questi file nel programma. Questi sono particolarmente utili se vuoi usare un pacchetto sviluppato da qualcun altro che renderà il tuo gioco più facile da creare.

Vedi questa guida per maggiori dettagli su come funzionano i pacchetti in Java

381698 13
381698 13

Passaggio 2. Crea le cartelle del tuo progetto

Se stai creando un gioco con più immagini e clip audio, ti consigliamo di creare una struttura di cartelle per il tuo gioco. Ciò ti consentirà di archiviare facilmente i tuoi diversi elementi, nonché di archiviare diversi pacchetti da richiamare.

  • Crea una cartella di base per il tuo progetto. Nella cartella di base, dovresti avere una cartella "img" per tutte le tue risorse artistiche, una cartella "snd" per tutte le tue risorse sonore e una cartella "src" per tutti i tuoi pacchetti di gioco e codice.
  • Crea una cartella "Gioco" nella cartella "src" per memorizzare il tuo file Constants.
  • Questa particolare struttura non è necessaria, ma è un modo semplice per organizzare il lavoro e i materiali, soprattutto per progetti più grandi. Per il semplice gioco spiegato sopra, non sarà necessario creare alcuna directory.
381698 14
381698 14

Passaggio 3. Aggiungi l'audio al tuo gioco

Un gioco senza audio o musica diventerà presto noioso per il giocatore. È possibile aggiungere suoni agli oggetti in Flash utilizzando lo strumento Livelli. Vedi questa guida per maggiori dettagli.

381698 15
381698 15

Passaggio 4. Creare un file di costanti

Se il tuo gioco ha molti valori che rimarranno gli stessi per tutta la partita, puoi creare un file Constants per memorizzarli tutti in un unico posto in modo da poterli richiamare facilmente. Le costanti possono includere valori come gravità, velocità del giocatore e qualsiasi altro valore che potrebbe essere necessario richiamare ripetutamente.

  • Se crei un file Constants, dovrà essere inserito in una cartella nel tuo progetto e quindi importato come pacchetto. Ad esempio, supponiamo di creare un file Constants.as e di posizionarlo nella directory del gioco. Per importarlo, dovresti usare il seguente codice:

    pacchetto { import gioco.*; }

381698 16
381698 16

Passaggio 5. Guarda i giochi di altre persone

Sebbene molti sviluppatori non rivelino il codice per i loro giochi, ci sono una varietà di tutorial di progetto e altri progetti aperti che ti permetteranno di vedere il codice e come interagisce con gli oggetti di gioco. Questo è un ottimo modo per imparare alcune tecniche avanzate che possono aiutare il tuo gioco a distinguersi.

Consigliato: