Commencez votre voyage de développement de jeu avec la simplicité de 24a2

Commencez votre voyage de développement de jeu avec la simplicité de 24a2

24a2 est un moteur de jeu très basique, mais pleinement opérationnel, pour les programmeurs JavaScript. Il a une apparence inhabituelle, mais vous pouvez l’utiliser pour apprendre les bases de la programmation de jeux.

Avec la prise en charge d’une boucle de jeu, des graphismes colorés et une saisie simple, 24a2 a tout ce dont vous avez besoin pour créer de petits jeux avec un minimum d’effort.

Découvrez 24a2 et commencez votre voyage vers le développement de jeux complets dès aujourd’hui.

Qu’est-ce que 24a2 ?

24a2 est un petit moteur open source qui vous aide à créer des jeux de base. Il est très facile à apprendre et tout ce dont vous avez besoin pour commencer à créer vos jeux est un navigateur Web et un éditeur de texte.

24a2 tire son nom de sa résolution : 24 x 24. Même comparé à d’autres moteurs minimalistes comme le PICO-8, avec sa résolution de 128 x 128, c’est minuscule ! 24a2 utilise des ‘pixels’ circulaires, avec de grands espaces entre eux, donc c’est assez distinctif.

Un jeu de ski de base avec le joueur représenté sur un chemin au milieu de deux espaces verts.

Vous n’utiliserez probablement pas 24a2 pour créer le prochain jeu vidéo à succès, mais ce n’est pas vraiment le but. 24a2 est parfait pour les débutants et vous pouvez l’utiliser pour apprendre certains des concepts fondamentaux derrière le développement de jeux.

Il est également idéal pour le prototypage d’un concept de base. Si vous vous retrouvez distrait par la physique complexe du jeu ou les animations de sprites, supprimer tout cela devrait vous aider à vous concentrer.

De plus, le code source 24a2 est un seul fichier TypeScript. Vous pouvez l’utiliser comme source d’inspiration, ou même le modifier, pour créer votre propre moteur de jeu plus avancé.

Comment utilisez-vous 24a2 ?

Commencez avec un modèle de base pour votre jeu :

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

Remarquez comment cela utilise un réseau de diffusion de contenu (cdn.jsdelivr.net) pour sourcer le fichier engine.js , vous n’avez donc même pas besoin de télécharger ou d’installer quoi que ce soit.

Le deuxième script, game.js , est destiné à votre propre code de jeu. Commencez par le code de travail minimum absolu, pour vérifier que tout fonctionne correctement :

new Game({}).run();

Ce petit programme affichera la grille 24a2 par défaut dans votre navigateur Web :

La grille 24x24 par défaut de cercles gris clair qui composent le terrain de jeu de 24a2.

Ensuite, vous voudrez vous familiariser avec les fonctions de rappel de 24a2 qui forment le cœur du moteur. Ces concepts sont transférables entre les moteurs de jeu, donc apprendre comment ils fonctionnent vous sera bénéfique au-delà de votre utilisation de 24a2.

Il existe une poignée de fonctions essentielles que vous pouvez définir et transmettre au constructeur Game() via un objet de configuration .

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

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

24a2 appelle la fonction que vous spécifiez dans config.create lorsqu’il démarre. Vous pouvez l’utiliser pour initialiser la propre configuration de votre jeu, configurer des structures de données, etc.

function create(game) {}

La fonction de mise à jour s’exécute périodiquement pendant toute la durée de votre partie. Il s’agit de la boucle de jeu principale qui, dans d’autres moteurs, consiste généralement en des étapes distinctes pour mettre à jour l’état du jeu et redessiner l’écran. Avec 24a2, vous gérerez les deux opérations dans cette fonction.

function update(game) {}

Enfin, pour capturer les entrées, vous souhaiterez gérer les pressions sur les touches fléchées, les clics de souris ou les deux. 24a2 transmet une direction à votre fonction onKeyPress lorsque le joueur appuie sur une touche fléchée. Il transmet les coordonnées x et y à onDotClicked s’ils cliquent sur un point à l’aide de leur souris.

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

Quels types de jeu pouvez-vous créer avec 24a2 ?

Le site 24a2 contient trois exemples de jeux dont un tutoriel. Les autres qu’il présente sont un simple jeu de serpent et un défi de ski.

Le référentiel GitHub comprend des liens vers d’autres jeux, notamment Space invaders, Tic-Tac-Toe et un programme Paint minimal. You Killed a Bear est plus avancé et Maze Craze est une bonne démonstration de la façon de superposer des graphiques supplémentaires au-dessus de la grille standard.

24MadRush est un « clone » de Tetris qui fait un grand usage de la palette de couleurs. Il commence également par un didacticiel jouable innovant qui démontre ses fonctionnalités.

24MadRush, un jeu de bloc tombant avec un patch de points de couleurs mélangées sur les 4 rangées inférieures.

Les spécifications techniques des jeux 24a2

24a2 est très limité, par conception. Mais cela offre une excellente occasion de créativité. L’un des meilleurs conseils pour être plus créatif est d’accepter les contraintes.

Outre sa résolution limitée, 24a2 vous limite à :

  • Une palette de couleurs de seulement neuf couleurs : celles de l’arc-en-ciel plus le noir et le gris.
  • Saisie très basique : pressions sur les touches fléchées et clics de souris sur la grille de points.
  • Silence : il n’y a aucun support pour la musique ou les effets sonores.

Cependant, vous pouvez toujours écrire du code JavaScript supplémentaire pour étendre votre jeu au-delà de ces limitations. Et, puisque le moteur est open-source, vous êtes libre de le développer comme bon vous semble.

Stimulez-vous vers de plus grandes choses avec 24a2

Essayez de vous tester avec 24a2. Recréez un jeu classique ou inventez-en un. Les jeux au tour par tour, comme les jeux de société, fonctionneront très bien avec le moteur.

Si 24a2 enflamme votre passion pour le développement de jeux, il existe de nombreuses opportunités pour continuer le voyage. PICO-8, Godot, Unity et GameMaker sont tous des choix populaires.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *