Tâche
Le client a souhaité qu’on développe le jeu de sorte qu’il puisse fonctionner sur tous les navigateurs modernes sans installation de composants supplémentaires sur l’appareil de l'utilisateur. Le projet est un jeu de logique avec des éléments de gamification, qui doit être intégré dans le site Web du client. Le but principal du jeu est de mettre des blocs d’éclairage de secours dans le bon ordre pour évacuer 10 employés. Le jeu dispose d’une minuterie qui calcule le temps nécessaire pour évacuer toutes les personnes. Le jeu doit bien fonctionner sur tous les navigateurs modernes, montrer de bonnes performances et avoir de bons effets d'animation sans utiliser le flash.
Challenge
L'un des défis pour le développeur web d’Elinext Group était de mettre en œuvre la physique de la lumière : la lumière devait être lisse et interagir avec les murs sur la carte. Les objets en mouvement devaient également changer leur vitesse en fonction de l'intensité de l'éclairage. Il était également nécessaire de résoudre le problème de performances : le jeu devait avoir une vitesse suffisante sur n'importe quel navigateur web.
Solution
Lors du développement du jeu, le développeur d’Elinext Group a utilisé sa riche expérience d’un travail avec HTML5. Pour visualiser les objets du jeu, il a utilisé HTML5 Canvas. Toute la logique du jeu a été écrite à l’aide du framework JavaScript JQuery. Le développeur web d’Elinext Group a créé l'algorithme de la physique de l’éclairage, et a fourni une animation fluide pour tous les objets et a construit une structure DOM bien organisée.
Résultats
Le jeu a été développé et testé avec succès sur les navigateurs Web les plus populaires ainsi que sur les navigateurs Web mobiles. Le jeu a démontré une bonne performance et a été intégré avec succès dans le site Web du client.