Concevoir des applications et des jeux vidéo en JavaScript

Introduction

• Histoire du jeu vidéo
• Particularités des Casual Games
• Les différentes étapes de la conception
• Faire les bons choix technologiques
• Après Flash, quel avenir pour les jeux via navigateur ?
• Le navigateur, le runtime JavaScript sur le client

Analyse et algorithme

• Structurer le projet et analyser les besoins
• Ecrire la logique du programme en langage courant
• Lister et rechercher tous les éléments utiles

Choix techniques

• Le couple HTML/CSS pour créer un document Web
• Le JavaScript pour ajouter des fonctionnalités
• Le navigateur et sa console
• Le DOM (Document Object Modèle) et les APIs
• Les IDE et éditeurs
• Les design patterns (singleton, observer, factory, MVC,…)
• Les librairies et frameworks (jQuery,…)
• La programmation orientée objet

JavaScript - Le langage de programmation navigateur

• Syntaxe générale et bonnes pratiques
• Les variables, la mémoire du programme
• Les fonctions, les possibilités du programme
• Les conditions, pour affiner les calculs
• Ecouteurs d’événements, pour l’interactivité
• Boucles et timers, pour gérer le moteur du jeu
• Les tableaux, la mémoire temporaire
• Les objets (images, …), pour manipuler les médias
• Programmation Orientée Objet et Prototypes
• Nouvelle syntaxe EcmaScript 6
• Les APIs navigateur
• Les Canvas pour dessiner le rendu du jeu
• Le SVG pour faire du vectoriel
• Le DOM pour interagir avec la page HTML et CSS
• Audio et vidéo pour ajouter de la vie au jeu
• JSon pour stocker les informations durablement
• AJAX pour communiquer avec un serveur

La conception technique

• Commencer par un moteur simple
• Séparer le rendu, les données et les calculs (MVC)
• Créer une fonction principale pour les calculs
• Créer une routine pour le rendu graphique
• Créer une interface in-game (HUD)
• Définir et créer les interactions utilisateur
• Charger et utiliser des feuilles de sprites
• Factoriser le programme
• Travailler en objets le plus souvent
• Créer ses propres librairies

Les évolutions

• Ajouter du son
• Ajouter des animations
• Créer une page d’introduction
• Ajouter de l’intelligence artificielle
• Gérer la physique d’un jeu
• Enregistrer les scores sur un serveur

Les médias

• Créer une console de gestion du son
• Créer des bruitages et des musiques
• Créer des sprites et des feuilles de sprites
• Intégrer des vidéos

Les levels

• Créer des niveaux et des maps
• Notions de level design
• Créer un éditeur
• Srocker les maps à l’aide de JSon

Les types de rendu 2D

• Board
• Bird eyes
• Profil
• Isométrique
• Mode 7
• Raycasting (2.5D)

Les algorithmes utiles

• Maps
• Grilles et tuiles
• Scrolling
• Collisions
• Pathfinding (A*)
• FloodFill
• Particules
• Génération de labyrinthes
• Génération de cavernes
• Génération de donjons

Etude de moteurs simples

• Quizz
• Pong
• Taquin
• Memory
• Tic Tac Toe
• Snake
• Doodle Jump
• Frogger
• Démineur

Etude de moteurs intermédiaires

• Tetris
• Asteroids
• Space Invaders
• Frogger
• Pacman
• Bejeweled
• Blackjack
• Course de voiture

Etude de moteurs complexes

• Plateformes avec tuiles et scrolling
• First Person Shooter avec du Raycasting