Les ressources JS de l’été : Des frameworks pour créer vos propres jeux

Pendant tout le mois d'août, retrouvez tous les mardis une série de ressources Javascript à thème, avec aujourd'hui un des domaines les plus attrayants du développement : la création de jeux vidéo.

Que ce soit pour réaliser un rêve d'enfant, changer de carrière ou simplement comprendre comment tout cela fonctionne, la création d'un jeu vidéo rudimentaire est quelque chose de très intéressant, mais aussi plutôt complexe. Pour vous aider lors de vos premiers pas, je vous propose de découvrir cette petite liste de 4 ressources Javascript en commençant par mon chouchou : Playground.js

Playground.js

Playground.js est la ressource que j'ai le plus utilisé parmi les 4 que je présente aujourd'hui, certainement car son fonctionnement est celui s'approchant le plus de ce que l'on peut faire en Ruby ou Java. 

Ce framework propose une organisation principalement construite autour de deux méthodes : step et render. La première est votre boucle principale, et la seconde s'occupe de mettre à jour l'affichage. Pour ceux qui connaissent, c'est assez proche dans son fonctionnement à la librarie ruby Gosu.

D'un point de vue fonctionnalités, Playground propose évidemment un support simplifié du clavier, de la souris, mais aussi des manettes de jeu, ce qui est très agréable. Il propose en plus une API simplifiée pour gérer l'utilisation de sons, ainsi que le découpage de son application sous la forme de "states", qui sont les différents écrans qui composent notre jeu (menu principale, un niveau, gamme over, …).

Enfin, Playground a l'avantage d’être complètement agnostique comprenant l'affichage. La version de base est fournie avec CanvasQuery (grosso modo du canvas avec du chaînage et quelques petites fonctionnalités en plus) mais rien ne vous empêche de changer au profit de three.js par exemple.

Si vous n'avez touché à aucun framework de jeu HTML5 pour l'instant mais que vos ave déjà un fort background en développement, je pense que Playground est intéressant pour commencer de par son fonctionnement très "nature", ou pratiquement rien n'est fait dans votre dos. Cela vous permettra de bien comprendre le fonctionnement de votre application et éventuellement passer à un framework plus automatisé par la suite.

Phaser

Phaser est un framework HTML5 biens plus haut niveau que Playground. Ici, pas la peine de manager soit même le rafraîchissement du canvas,, vous pourrez appliquer directement des interpolations à vos objets, qui auront été automatiquement.

Je n'en dirai pas plus sur ce framework car je ne l'ai pas encore utilisé suffisamment, mais il sera sans aucun doute à la base d'un prochain projet.

Panda.js

Je n'ai essayé panda que très brièvement et ne m'étendrais donc pas dessus. Ce framework propose des fonctionnalités de très haut niveau, comme une gestion de particules, de lumière, ou de la gravite, mais son manque de documentation claire est un sérieux frein à son adoption.

Quintus

Même chose que pour Panda, je n'ai pas utilisé Quintus, et ne peux donc pas donner mon avis. Si quelqu'un l'a déjà eu entre les mains, n'hésitez pas à le dire en commentaire !