Inizia il tuo viaggio di sviluppo del gioco con la semplicità di 24a2

Inizia il tuo viaggio di sviluppo del gioco con la semplicità di 24a2

24a2 è un motore di gioco molto semplice, ma pienamente operativo, per programmatori JavaScript. Ha un aspetto insolito, ma puoi usarlo per imparare i fondamenti della programmazione del gioco.

Con il supporto per un ciclo di gioco, grafica colorata e input semplice, 24a2 ha tutto il necessario per creare piccoli giochi con il minimo sforzo.

Dai un’occhiata a 24a2 e inizia oggi il tuo viaggio verso lo sviluppo completo del gioco.

Cos’è 24a2?

24a2 è un piccolo motore open source che ti aiuta a creare giochi di base. È molto facile da imparare e tutto ciò di cui hai bisogno per iniziare a creare i tuoi giochi è un browser web e un editor di testo.

24a2 prende il nome dalla sua risoluzione: 24 x 24. Anche rispetto ad altri motori minimalisti come PICO-8, con la sua risoluzione 128 x 128, questo è minuscolo! 24a2 utilizza “pixel” circolari, con grandi spazi tra loro, quindi ha un aspetto piuttosto distintivo.

Un semplice gioco di sci con il giocatore mostrato su un sentiero al centro di due aree verdi.

Probabilmente non userai 24a2 per inventare il prossimo videogioco di grande successo, ma non è questo il punto. 24a2 è perfetto per i principianti e puoi usarlo per apprendere alcuni dei concetti fondamentali alla base dello sviluppo del gioco.

È anche ottimo per la prototipazione di un concetto di base. Se ti ritrovi a essere distratto dalla complessa fisica del gioco o dalle animazioni degli sprite, eliminare tutto ciò dovrebbe aiutarti a concentrarti.

Inoltre, il codice sorgente 24a2 è un singolo file TypeScript. Puoi usarlo come ispirazione o persino modificarlo per creare il tuo motore di gioco più avanzato.

Come usi 24a2?

Inizia con un modello di base per il tuo gioco:

<html>
  <head>
    <script
      src="https://cdn.jsdelivr.net/gh/jamesroutley/24a2/build/engine.js">
    </script>
    <script src="game.js"></script>
  </head>
  <body></body>
</html>

Nota come questo utilizza una rete di distribuzione dei contenuti (cdn.jsdelivr.net) per generare il file engine.js , quindi non è nemmeno necessario scaricare o installare nulla.

Il secondo script, game.js , è per il tuo codice di gioco. Inizia con il codice funzionante minimo assoluto, per verificare che tutto funzioni correttamente:

new Game({}).run();

Questo piccolo programma visualizzerà la griglia 24a2 predefinita nel tuo browser web:

La griglia predefinita 24x24 di cerchi grigio chiaro che compongono il campo di gioco di 24a2.

Successivamente, ti consigliamo di familiarizzare con le funzioni di callback di 24a2 che costituiscono il nucleo del motore. Questi concetti sono trasferibili tra i motori di gioco, quindi imparare come funzionano ti avvantaggerà oltre l’uso di 24a2.

C’è una manciata di funzioni essenziali che puoi definire e passare al costruttore Game() tramite un oggetto di configurazione .

let config = {
  create: create,
  update: update,
  onKeyPress: onKeyPress,
  onDotClicked: onDotClicked
};

let game = new Game(config);
game.run();

24a2 chiama la funzione specificata in config.create all’avvio. Puoi usarlo per inizializzare la configurazione del tuo gioco, impostare strutture di dati, ecc.

function create(game) {}

La funzione di aggiornamento viene eseguita periodicamente per tutta la durata del gioco. Questo è il ciclo di gioco principale che, in altri motori, di solito consiste in passaggi separati per aggiornare lo stato del gioco e ridisegnare lo schermo. Con 24a2, gestirai entrambe le operazioni in questa funzione.

function update(game) {}

Infine, per acquisire l’input, ti consigliamo di gestire la pressione dei tasti freccia, i clic del mouse o entrambi. 24a2 passa una direzione alla tua funzione onKeyPress quando il giocatore preme un tasto freccia. Passa le coordinate x e y a onDotClicked se fanno clic su un punto usando il mouse.

function onKeyPress(direction) {}
function onDotClicked(x, y) {}

Che tipo di gioco puoi creare con 24a2?

Il sito 24a2 contiene tre giochi di esempio tra cui un tutorial. Gli altri che mette in mostra sono un semplice gioco Snake e una sfida di sci.

Il repository GitHub include collegamenti ad altri giochi tra cui Space invaders, Tic-Tac-Toe e un programma Paint minimo. You Killed a Bear è più avanzato e Maze Craze è una buona dimostrazione di come sovrapporre grafica aggiuntiva sopra la griglia standard.

24MadRush è un “clone” di Tetris che fa un grande uso della tavolozza dei colori. Inizia anche con un innovativo tutorial giocabile che ne dimostra le caratteristiche.

24MadRush, un gioco a blocchi che cadono con una patch di punti di colore misto sulle 4 righe inferiori.

Le specifiche tecniche dei giochi 24a2

24a2 è molto limitato, in base alla progettazione. Ma questo offre un’eccellente opportunità per la creatività. Uno dei migliori consigli per essere più creativi è accettare i vincoli.

Oltre alla sua risoluzione limitata, 24a2 ti limita a:

  • Una tavolozza di soli nove colori: quelli dell’arcobaleno più il nero e il grigio.
  • Input molto semplice: pressione dei tasti freccia e clic del mouse sulla griglia di punti.
  • Silenzio: non c’è alcun supporto per musica o effetti sonori di sorta.

Tuttavia, puoi sempre scrivere codice JavaScript supplementare per estendere il tuo gioco oltre queste limitazioni. E poiché il motore è open-source, sei libero di svilupparlo nel modo che ritieni opportuno.

Spronati a fare cose più grandi con 24a2

Prova a metterti alla prova con 24a2. Ricrea un gioco classico o inventane uno tutto tuo. I giochi a turni, come i giochi da tavolo, funzioneranno molto bene con il motore.

Se 24a2 accende la tua passione per lo sviluppo di giochi, ci sono molte opportunità per continuare il viaggio. PICO-8, Godot, Unity e GameMaker sono tutte scelte popolari.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *