images bannieres

Mathgames

Cours de mathématiques pour la programmation de jeux vidéo

Accueil

Bienvenue sur ce modeste site web sans prétention où je vous présente plusieurs cours de mathématiques de base pour la programmation de jeux vidéo, j'ai choisi comme sujets la trigonométrie, les vecteurs et une partie infime de l'analyse. Ensuite sous la rubrique « programmation », nous étudierons des différents algorithmes d'un jeu vidéo avec avion mère qui vise sur plusieurs séries d'avions avec tir de munitions et animation de collision, on le programmera avec une couche du langage Java orienté objet dans un IDE (mot anglais, pour integrated development environment) qui veut dire environnement de développement intégré et on utilisera Processing* pour programmer votre jeu vidéo. Cela ressemblera à la vidéo ci-dessous qui est le projet de jeu vidéo UNITÉ-1,* un jeu vidéo « rétrogaming » remake de 1942* que je viens tout juste de finir de programmer fin décembre 2016 en version web avec la participation de Carlos un ami d'enfance qui de par son expérience est un programmeur averti, nous avons commencé l'apprentissage des langages de programmation informatique en tant qu'autodidacte, en 1983, jusqu'à aujourd'hui où vous lisez ces lignes. Pour l'instant, le jeu vidéo se lance sur Linux, Mac OS X, Windows et sur plateforme Android (mobile et tablette).

Note : vous pourrez voir quelques programmes que j'ai développés avec avec p5.js et mon portfolio graphique plus bas sur cette page web.


Note : Processing* est un environnement de programmation qui a été conçu pour la création graphique interactive. C'est un logiciel open source qui repose sur une couche Java orienté objet. Son principe majeur est la simplicité, tant dans la syntaxe du langage que dans la mise en oeuvre des programmes. Il permet de générer des images 2d et 3d et il peut être étendu à l'animation, à la gestion de flux vidéos, à la génération et à la manipulation de sons, à l'interfaçage d'entrées-sorties, etc...


Note : UNITÉ-1* contient plus de 4 350 lignes de code, un fichier source index HTML, 29 fichiers sources Javascript, un dossier data pour toutes les ressources des images et un dossier sounds pour tous les bruitages sonores. Toutes les images et décors du jeu vidéo ont été développées par Claire Méjean, qui assure une remarquable aptitude dans son métier d'infographiste. Ce jeu vidéo contient cinq niveaux au total (Océan, Désert, Montagne, Forêt et agglomération) avant d'arriver à la finale où se trouvent les Boss et leurs vassaux au-dessus de l'Océan.


Note : 4 350 lignes de code, c'est infinitésimal par rapport à des programmes ou application qui font des dizaines de millions de lignes de code, mais aussi les développeurs sont des centaines à programmer sur de tel projet.

Exemple : 4 350 << 15 753 931 lignes de code.


En langage mathématique le symbole << veut dire « beaucoup plus petit que ».


Note : 1942* est un jeu vidéo 2d de type shoot them up à défilement vertical sorti en 1984 sur système d'arcade Z80 Based de Capcom, puis porté par la suite sur de nombreuses autres machines. Il s'agit du premier jeu développé par Yoshiki Okamoto pour Capcom.

article wikipédia.


Voici ces deux versions différentes de ces jeux vidéo, 1942 et UNITÉ-1 un jeu vidéo « rétrogaming » que j'ai programmé avec une couche du langage Java orienté objet dans l'environnement de développement intégré de Processing qui a débuté, en 2013, pour arriver jusqu'au bout du programme, en 2015, puis une seconde version web finalisée cette fois-ci programmée avec le langage Javascript dans l'environnement de développement intégré de P5.js, en 2016, pour pouvoir l'intégrer dans cette page web. Vous pouvez voir les démos ci-dessous.


Retrogaming

Nostalgie de la décennie des années 1980

J'ai du respect pour Yoshiki Okamoto et si je pouvais le rencontrer s'il est toujours de ce monde, je lui dirais que son jeu vidéo original 1942 est tout simplement meilleur sur tous les points de vue que le jeu vidéo que j'ai développé UNITÉ-1 pour plusieurs raisons dont une, c'est que 1942 a été programmé avec le langage de programmation assembleur de bas niveau* sur la base d'un microprocesseur 8 bits, c'est-à-dire pour les connaisseurs que son jeu vidéo a un grain unique et inimitable que les PC avec processeur 64 bits de maintenant ne peuvent pas et ne pourront jamais reproduire à l'original d'un microprocesseur 8 bits de l'époque de la décennie des années 1980.

bas niveau* : un langage de programmation de bas niveau* ne fournit que peu d'abstraction par rapport au jeu d'instructions du processeur de la machine. Les langages de bas niveau sont à opposer aux langages de haut niveau, qui permettent de créer un programme sans tenir compte des caractéristiques particulières (registres, etc) de l'ordinateur censé exécuter le programme.

Le langage machine et le langage d'assemblage sont les archétypes de langages de bas niveau, puisqu'ils permettent de manipuler explicitement des registres, des adresses mémoires, des instructions machines.

article wikipédia.

En gros, dans le jargon des langages de programmation informatique, le langage machine (code binaire) et l'assembleur (code hexadécimal) sont des langages de bas niveau qui sont très proche de la machine qui compose un ordinateur (électronique numérique), ensuite vient les langages C puis C++ toujours de bas niveau mais plus lisible.

Voici un exemple de codes sources de ces différents langages sortis respectivement dans l'ordre, de la décennie des années 1930 à 1980 :

Langage binaire de bas niveau illisible

langage binaire

Langage assembleur de bas niveau illisible

langage hexadécimal

Langage C de bas niveau mais plus lisible

langage hexadécimal

Langage C++ de bas niveau mais plus lisible

langage hexadécimal


1942

1942 sur borne d'arcade : version original de Yoshiki Okamoto (1984)

UNITÉ-1

Voici UNITÉ-1, le second jeux vidéo retrogaming, je viens de finir de le développer fin décembre 2016 où votre objectif sera de détruire cette horde de renégats ayant pris d'ample territoire sur tous les continents, vous devrez tout faire pour les freiner et les anéantir une fois pour toutes, UNITÉ-1 est un jeu vidéo fictif.

UNITÉ-1 remake de 1942 par himalaya2004 (2016)


Vous pouvez cliquer sur l'image ci-dessous pour jouer en ligne.

new game

War in Space

Voici le troisième jeu vidéo, War in Space, je viens de finir de le développer en novembre 2017, ce jeu vidéo contient quatre niveaux avec bruitage sonore, la durée totale du jeu est d'environ 45 minutes en l'ayant programmé avec l'horloge interne du PC, c'est une suite du précédent jeu vidéo UNITÉ-1 qui se déroulait au dessus de la planète terre, pour cette suite logique qui se passe en périphérie de la planète terre dans la zone de l'orbite terrestre basse allant jusqu'à 2 000 kilomètres d'altitude, située entre l'atmosphère et la ceinture de Van Allen, cette fois-ci, Il faudra anéantir cette horde de renégats et leur flotte de véhicule spatiaux et couper toutes les communications de leurs satellites transmettant des ondes radio vers la terre. War in Space est une jeu vidéo fictif.

Note : si vous jouer à ce jeu vidéo, en arrivant entre la fin du niveau deux et un petit peu après le niveau trois, vous vous apercevrez que la musique du jeu s'arrête toute seule, mais les bruitages sonores continue, j'ai décelé un bug* informatique que je n'arrive pas à corriger et je n'ai pas l'esprit à cela pour le moment pour rectifier ce bug de ma part dans le codage de ce programme qui contient plus de 3 130 lignes de code, sinon le jeu est jouable sans problème, en fait, quand la musique du jeu s'arrête, il faut couper le son et le remettre de nouveau si vous le voulez, mais le problème persiste un peu plus loin dans le temps et ainsi de suite.

Note : en informatique, un bug* (mot anglais bug) ou bogue (au Nouveau-Brunswick, au Québec et en France) est un défaut de conception d'un programme informatique à l'origine d'un dysfonctionnement.

article wikipédia.

War in Space par himalaya2004 (2017)


Vous pouvez cliquer sur l'image ci-dessous pour jouer en ligne.

jeu vidéo War in Space

Lunar Lander

Un peu de physique avec Newton et Lunar Lander, de nouveau, je vous présente le quatrième jeu vidéo avec simulation de la gravité et bruitage sonore, je viens de finir de le developper fin décembre 2017, ce jeu contient plus de 2 275 lignes de code et simule l'atterrissage ou l'alunissage d'un spacecraft sur la lune, ce jeu contient dix stages et ressemble beaucoup aux jeux vidéo sur console des années 80, je le voulais vintage, rétrogaming, simple graphiquement et avec des couleurs sobres. Je viens de m'apercevoir que j'aurais dù diviser par dix l'échelle de l'altitude du spacecraft, je le ferais plus tard dans une nouvelle mise à jour de ce jeu vidéo Lunar Lander si j'ai le temps. Une des consoles les plus vintage qui a exister sortie, fin 1982, était la console de jeux « vectrex » qui a cessé d'être produite en 1984 après le krach du jeu vidéo de 1983. Vous pourrez voir ses caractéristiques « ici ».

Lunar Lander par himalaya2004 (2017)


Vous pouvez cliquer sur l'image ci-dessous pour jouer en ligne.

new game

Lives on earth

De nouveau, je vous présente le cinquième jeu vidéo Lives on earth, je viens de finir de le développer au mois d'août 2018, ce jeu video contient plus de 4 350 lignes de code, ce jeu vidéo se passe dans l'espace avec défilement de différentes planètes et fini au-dessus de la planète terre, votre objectif sera de détruire cette horde de renégats ayant semé le désordre sur terre et voulant fuir vers d'autres planète. Lives on earth est un jeu vidéo fictif.

Lives on earth par himalaya2004 (2018).


Vous pouvez cliquer sur l'image ci-dessous pour jouer en ligne.

new game

Galaxian mini par himalaya2004 (2019).

Je vous présente le sixième jeu vidéo Galaxian mini que je viens de finir de le développer au mois d'avril 2019, ce jeu vidéo contient plus de 4 000 lignes de code, ce jeu vidéo retrogaming est un remake de Galaxian et sa suite Galaga sortie en 1979 et 1981 respectivement. Je remercie au passage les conseils de mon ami d'enfance Carlos avec qui nous avons corrigé quelques bugs lors du développement du programme. Vous pourrez voir le listing complet de Galaxian mini en cliquant sur le lien ci-dessous.

Listing des codes sources de Galaxian mini

Galaxian mini

Vous pouvez cliquer sur l'image ci-dessous pour jouer en ligne.
galaxian

Space Invaders

Voici Space Invaders, un jeu vidéo programmé par Tristan Brismontier qui l'a mis sur Internet que j'ai ensuite récupéré en ligne pour lui faire de la rétro-ingénierie (anglais: reverse engineering*), son jeu vidéo est en noir et blanc avec les blocs de défense verte et avec la participation de Carlos, nous avons hacker les codes sources du programme en lui rajoutant 15 fonds d'écran tirés aléatoirement avec le nombre de blocs de défense qui varie suivant les différents niveaux sur le thème de l'espace et nous avons rajouté une icône (on/off) ainsi que les bruitages sonores. Au passage, j'ai redessiné le graphique du canon dans la version hacker, les démos de ces deux jeux vidéo, sont ci-dessous.

Note : reverse engineering* veut dire activité qui consiste à étudier un objet pour en déterminer le fonctionnement interne ou sa méthode de fabrication.

article wikipédia.

SpaceInvader

Space Invaders par Tristan Brismontier

Vous pouvez cliquez sur l'image ci-dessous pour jouer en ligne.

SpaceInvader

Space Invaders version hacker par Carlos et himalaya2004 (2013)

Télécharger la version hacker de Space Invaders « ici ».

Cette version est pour les systèmes Windows mais en haut de cette page web sur la barre des rubriques, vous avez un lien de téléchargement pour la version Linux, pour la versions Mac OS X, la version Linux devrait être compatible car ces deux derniers systèmes son programmé sur un même noyau système commun qui se nomme Unix.



Vous pourrez voir plus bas sur cette page web quelques programmes que j'ai développés avec p5.js, c'est une nouvelle version pour le web sorti, en 2014, de Processing qui remplace l'ancienne version web de Processing.js et vous pourrez visionner les vidéos de mes projets informatiques sur Youtube ou sur votre navigateur préféré (Google ou autre navigateur) en tapant himalaya2004.


Applications de géométrie

Je vous présente une application de bureau cette fois-ci que j'ai programmée avec le langage Java orienté objets dans l'environnement de développement intégré Netbeans, en 2008 et remis au goût du jour, en 2014, dans l'environnement de développement intégré Eclipse qui se nomme MathGéo, ce programme calcule les aires, périmètres, volumes de plusieurs figures géométriques et fait quelque conversion d'unité de mesure. Je vous laisse voir aussi la même application de Mathgéo en version web que j'ai nommé cette fois-ci MathGéométrie que j'ai développé, en 2014, avec les purs langages HTML, CCS3 et Javascript avec la participation de Carlos qui sans lui n'aurait pas vu le jour dans cette version bien définie. Les illustrations des figures géométriques de la version bureau et web, sont de Claire Méjean encore une fois.

MathGéo (2008 - 2014)

Télécharger la version de MathGéo « ici ».

géométrie géométrie géométrie

MathGéométrie (2014)

Cliquer sur l'image ci-dessous pour essayer MathGéométrie en ligne.

géométrie

Note : il vous faudra la machine virtuelle Java d'installé pour que la version bureau de MathGéo puisse s'ouvrir sur votre PC, cette version est multiplate-forme, c'est-à-dire que cette application peut s'ouvrir sur les systèmes Linux, Mac OS X, et Windows.


Système de positionnement par satellites de Galileo

Les vidéos ci-dessous sont des simulations sur le futur système de positionnement par satellite de Galileo européen, j'ai entièrement programmé la première simulation avec une couche du langage Java orienté objet dans l'environnement de développement intégré de Processing, la seconde simulation, je l'ai entierement programmé avec les purs langages HTML, CSS3, et Javascript en utilisant une bibliothèque graphique qui se nomme three.js avec laquelle on peut programmer des applications 3d, par contre j'ai été aidé par le professeur de mathématiques François Foucault qui m'a appris ce que sont que les coordonnées sphériques et bien plus encore et qui servent à repéré un point (Exemple : satellite, projectile, avion ou hélicoptère etc.) autour d'une sphère (la planète terre ou autres planètes du système solaire ou en dehors du système solaire) dans un espace 3d. Nous avons donc dans ces simulations positionnées aux coordonnées sphériques les 30 satellites répartis sur leurs trois orbites respectivement différentes du système Galileo.

Pour arriver à ces résultats, j'ai récupéré toutes les bonnes altitudes, latitudes et longitudes de chaque satellite sur leurs trois orbites respectivement différentes positionné dans l'espace dans un livre de science qui décrit le système de positionnement par satellite de Galileo.

En cliquant sur l'image ci-dessous, vous pourrez savoir les différentes altitudes possibles des satellites.

géométrie

Note : ne fête par attention à la texture plaquée sur la planète terre en rotation dans la simulation ci-dessous, vous verrez que le continent de l'Amérique ne se trouve pas à sa place, c'est parce que, j'ai eu un problème avec les paramètres en retouchant le code source quelques mois après avoir développé ce programme qui date du mois de mai 2012 et que je n'ai pas pu remettre en place à cause de la texture de la planisphère.

Programme Processing de Galileo (2012)


Note : dans la rubrique « satellites artificiels » en bas de cette page web, vous verrez un lien « système de positionnement par satellites de Galileo », cliqué dessus ou « ici » et vous verrez cette simulation que j'ai cette fois-ci programmé, en 2015, avec les purs langages HTML, CSS3, et Javascript en utilisant une bibliothèque graphique qui se nomme three.js avec laquelle on peut programmer des applications 3d.

Programme Javascript de Galileo avec la bibliothèque three.js (2015)

Définition des coordonnées sphériques

On appelle coordonnées sphériques divers systèmes de coordonnées de l'espace qui généralisent les coordonnées polaires du plan. Un point de l'espace y est repéré par la distance à un pôle et deux angles. Ce système est d'emploi courant pour le repérage géographique : l'altitude, la latitude, et la longitude sont une variante de ces coordonnées. Plusieurs systèmes de coordonnées sphériques sont également employés en astrométrie.

Il existe différentes conventions concernant la définition des angles. Ici nous utilisons la convention P(ρ,θ,φ), utilisée en mathématiques, où θ désigne la longitude et est compris entre 0 et 2π, et φ désigne la colatitude et est compris entre 0 et π.

article wikipédia.


Web Programmes avec P5.js

J'ai développé les 18 programmes ci-dessous entièrement avec P5.js, les mathématiques que j'ai utilisées dans ces programmes ne vont pas beaucoup plus loin que les coordonnées polaires, les vecteurs, les dérivées, la trigonométrie avec quelques fonctions trigonométriques comme l'arc tangent par exemple parmi trois jeux vidéo que j'ai développés comme UNITÉ-1, War in Space et Lives on Earth, quelques équations à deux inconnues pour le programme de croisement de segments et les quatre opérations de base que sont l'addition, la soustraction, la multiplication et la division. J'ai aussi utilisé la physique de Newton avec simulation de la gravité pour les mouvements balistiques avec portés, flèche et temps de vol d'un projectile, mais sans les frottements, de même, j'ai utilisé la physique de Newton encore une fois pour le jeu vidéo Lunar Lander, j'ai aussi utilisé la trigonométrie 3d avec les coordonnées sphériques pour la simulation du système de positionnement par satellite de Galileo.

science technique science technique simulation satellites Galileo roue trigonométrique trajectoire parabolique balistique montagne maths trajectoires application géometrique croisement de segment nombre d'or balle rebondissante rock trajectoires plages dans UNITÉ-1 nombre d'or War in Space Lunar Lander Lives on Earth Galaxian Galaxian

Sciences mathématiques et physiques

Ce site web ci-dessous présente les sciences des mathématiques et de physiques dont l'algèbre, le calcul différentiel, le mouvement, etc..., le lien est sur l'image.


mathématiques et physiques

Ce site web ci-dessous par contre présente la science physique (mécanique de Newton) d'une manière ludique avec code source à l'appui pour les développeurs, le lien est sur l'image.

physiques jeux vidéo

Portfolio graphique

Images développées avec 3ds Max (2013)

Ces images photoréalistes d'infographie 3d, je les ai développées avec le logiciel 3ds Max, il regroupe cinq métiers en un à l'intérieur même du logiciel qui est, la lumière, modélisation, texture, animation et effets spéciaux. Vous n'avez pas besoin de connaitre toutes les fonctionnalité de ce logiciel pour réaliser ces images, avec même pas dix pourcents de toute l'étendu des paramètres de ce logiciel, vous pouvez développer ces images sans problème en modélisent touts types d'objets ou décors 3d. C'est sans aucun doute le logiciel 3d le plus connu actuellement. Il est utilisé dans bien des métiers, comme le jeu vidéo, l’architecture ou des simulations avec effets spéciaux tels que la physique comme la gravité, les forces, les particules, les explosions, les feux, les fumées, les fluides, les vents, les differentes atmospheres etc...

désert désert rochers icebergs table salon chaise coussin bouteille parfum bowling relief sphere deux satellites formes géométriques


Images développées avec Blender (2016)

J'ai réalisé ces images photoréalistes cette fois-ci avec le logiciel d'infographie 3d Blender, c'est l'équivalent des deux logiciels phares que sont 3ds Max et Maya. La différence entre ces trois logiciels cités est que Blender peut réaliser tout ce que font 3ds Max et Maya et est en plus il est open source, c'est-à-dire entièrement gratuit, on peut dire que c'est un logiciel professionnel et qu'il est arrivé à maturité depuis ces cinq dernières années jusqu'à aujourd'hui en 2016. La communauté des développeurs de ce logiciel continue à le faire évoluer.

5 crayons à papier 5 crayons à papier barque barque satellite satellite satellite satellite


Océan virtuel avec Maya

Les simulations de ces océans virtuels ci-dessus sont des exemples de presets du logiciel Maya. Je vous laisse juger par vous-même des possibilités de ce logiciel très sophistiqué. Ce logiciel regroupe cinq métiers en un à l'intérieur même du logiciel qui est, la lumière, modélisation, texture, animation et effets spéciaux. Le logiciel Maya est surtout utilisée dans le cinéma en général pour son côté cinématique et 3ds Max est plutôt orienté jeux vidéo pour son côté très poussé sur la modélisation d'objets 3d. Mais ces deux logiciels sont très similaires et proposent la même chose dans leur paramètre cité plus haut, ils ont une interface différente que préféreront les uns par rapport aux autres.




Note : si vous trouvez des fautes ou des améliorations à faire sur ce site web mathgames.fr, veuillez bien me le faire savoir que je puisse corriger sur-le-champ en cliquant sur le lien contact. Merci d'avance et bonne lecture jusqu'à la fin, si vous suivez le fil.


Flèche pour remonter la page