Du Javascript pour le jeu vidéo

Ne nous mentons pas, beaucoup de nouveaux programmeurs se sont lancés dans le développement informatique pensant jouer à des jeux vidéos toute la journée. Ils ont vite déchanté !
Les plus courageux ont donc persévéré et certains ont été attiré du côté obscur par le web development.
Bien que passionnés par leur métier, nos chers web developers ont pu penser que c’en était fini de leur passion et que jamais ils ne révolutionneraient les aventures de Mario, Link, John Spartan, Crash Bandicoot, Sonic, Rayman, Lara Croft, Ryu, Kratos, Sephiroth, Sam Fisher, Nathan Drake, Kirby, Chris Redfield, Rico Rodriguez, Max Payne, Alan Wake, Markus Fenix et autres …
Hé bien cela était sans compter sur le Javascript !

Oui ! Votre formation webdevelopment vous a permis d’acquérir des notions de Javascript … et cela tombe bien car il existe de nombreux frameworks Javascript sur lesquels s’appuyer pour développer des jeux vidéo 2D ET jeux 3D. Bien sûr comme votre formation vous a coûté très cher me direz-vous, vous n’avez pas les moyens d’acheter des plateformes hors de prix. Ça tombe donc plutôt bien qu’une partie de la sélection qui suit soit basée sur des frameworks Javascript gratuits et néanmoins performants qui permettront d’être compatible HTML5 pour les incorporer à vos sites et/ou les transformer en applications mobiles grâce aux Canvas ou à la technologie WebGL :


Phaser - Desktop and Mobile HTML5 game framework

Phaser

Phaser est un framework open source de haut niveau, 100% web et gratuit, permettant de créer des jeux HTML5 2D avancés pour mobile et desktop.
Il interprète du javascript ou du coffeescript comme langage de programmation pour un rendu graphique en HTML5 Canvas ou WebGL.
À vous maintenant de créer les nouveaux mondes de Mario, Metroïd, Castelvania et autres Flappy Bird !

Il est le plus populaire à l’heure actuelle et a donc constitué une grande communauté très active autour de lui qui fournit des réponses à vos questions, des mises à jour, des tutoriels, des vidéos, etc … Étant fortement apprécié par les web developers, les éditeurs mettent aussi à disposition une documentation plutôt complète en anglais (oui je sais, il va falloir vous y remettre !).

Le framework embarque tous les concepts, boucles et caractéristiques des moteurs de jeux vidéos rendant le développement plus facile.


Playground.js

Playground.js est un framework Javascript orienté pour le développement de jeux vidéo.
Il est celui qui s’approche le plus de ce que l’on peut faire en Ruby ou Java et est construit autour de deux méthodes : step (la boucle principale) et render (qui gère la mise à jour de l’affichage).

Un avantage indéniable du framework Playground.js est d’être ouvert sur la gestion de la bibliothèque d’affichage; c’est à dire que vous pouvez aussi bien fonctionner avec CanvasQuery (fournie de base) qu’avec par exemple Three.js ou une autre librairie tierce.
En revanche, pour un débutant il sera plus difficile à prendre en main car beaucoup moins assisté. Néanmoins pour les plus téméraires, il vous permettra un meilleur suivi de votre code et du fonctionnement du framework.


CraftyJS

CraftyJS est un framework Javascript gratuit, simple et léger, permettant de créer des jeux HTML5 2D.
Sa logique se rapproche de celle des langages utilisés pour le jeu vidéo autre que web comme le C#, C++, … Vous vous en doutez donc : vous allez bouffer de l’objet !

CraftyJS possède un historique de plusieurs années dans le domaine mais est encore à jour et de ce fait, vous trouverez des nombreuses documentations et tutoriels.


Panda.js

Panda.js est un framework Javascript gratuit et modulaire, possédant un grand nombre de fonctionnalités afin de développer des jeux HTML5 pour mobile et desktop.

Il offre une grande facilité d’utilisation, ainsi que quelques fonctionnalités intéressantes telles que le rendu d’affichage Canvas et/ou WebGL (se basant sur la librairie Pixi.js), la gestion de particules, de la lumière ou encore de la gravité.

Bien que l’API soit complète, elle reste malheureusement plutôt mal documentée.


Three.JS

Three.js est une bibliothèque Javascript pour le développement de jeux 3D, comme Papervision3D nous le permettait en ActionScript dans Flash !

Il utilise la technlogie WebGL pour générer la 3D et s’appuie sur le SVG afin d’intégrer des images vectorielles dans des Canvas. De plus et afin de pallier à certaines lacunes du WebGL, vous serez amener à fricoter avec le CSS3D … oui oui vous avez bien entendu : CSS3D.

La librairie contient entre autres des fonctionnalités d’animation par squelette, de gestion de particules, de LOD (niveau de détails pour les objets), ou encore d’un parser de fichiers pour différents formats tels que JSON, OBJ et FBX.


Kiwi.js

Kiwi.js est un framework Javascript permettant de développer des jeux web avancés en HTML5 Canvas et WebGL, tout en restant simple dans sa prise en main.

Il embarque la librairie Cocoon.js qui vous permettra de compiler votre application pour la publier sur les différents stores.
Il utilise une gestion des ressources, des sprites, des textures, …

La documentation est constituée de nombreux exemples avec des tutoriels débutants et avancés.


 

Maintenant, c’est à vous de jouer !