Dossier 2

Monnier Valentin
TSSI
Projet ISN
Projet ISN
29/05/2015
Sommaire
I/ Introduction
Page 3
1. Enjeu de notre projet
2. Problématique
3. Cahier des charges
II/ Principe du jeu
Page 3
III/ Réalisation du jeu
Page 4-5
1. Répartition des tâches
2. Explications des fonctions codées
3. Problème rencontrés
Page 4
Page 4-5
Page 5
IV/ Conclusion
Page 5
Annexes
Page 6-7
I/ Introduction
Cette année scolaire, en terminale S, option ISN, le choix du projet à présenter était
libre. Ce projet est codé par des groupes de 3 à 4 personnes. Il est codé en plusieurs
langages : HTML 5, CSS 3 et Javascript. Nous utilisons l’éditeur TopStyle et Notepad ++.
Pour ma part, je me suis associé à Marine Ferraille et Sasha Moronval.
Notre projet était de recréer sur un support numérique ici notre page web un jeu d'autrefois :
le puissance 4. Notre projet est constitué de 3 parties :
• Le HTML qui permet d'afficher le texte
• Le CSS qui lui permet la mise en beauté de notre site
• Le JavaScript qui lui permet de programmer notre jeu
du Puissance 4
A) Enjeu de notre projet
Les loisirs prennent de plus en plus de place dans notre société. Les jeux vidéos
n’échappent pas à cette règle. Pouvoir jouer sur son ordinateur, sa tablette ou son téléphone
à un jeu qui nous a passionné autrefois intéresse de nombreuses personnes.
B) Problématique
Comment recréer sur un support numérique un jeu d'autrefois ?
C) Cahier des charges
II/ Principe du jeu
Notre jeu est formé d'une grille de 7 lignes et de 7 colonnes possédante donc 49 cases
au total. Le but du jeu est simple : Les deux joueurs jouent chacun leur tour et le gagnant est
celui qui arrive a aligner 4 pions de mêmes couleurs soit verticalement, horizontalement ou
en diagonale.
Pour placer ses pions nous avons instauré 7 boutons en bas de la grille où lorsque nous
cliquons sur celui-ci il mette le pion dans la ligne et donc dans la case voulut.
Dans cette version du puissance 4 nous pouvons jouer que contre l'IA (Intelligence
Artificielle).
III/ Présentation du jeu
1. Répartition des tâches
Au début du projet, afin de bien comprendre de part notre première découverte
avec tous ces types de langages nous avons commencé à coder ensemble notamment sur le
HTML.
Je me suis plus occupé du CSS et de la mise en page de notre site avec Sasha ainsi que des
codes JavaScript sur la programmation de l'alignement des pions.
Marine s'est occupée de la programmation des codes JavaScript sur le placement des pions
avec Sasha.
2. Explications des fonctions codées
Nous avons commencé par coder le HTML :
Tout d'abord, nous nous sommes concerte sur la mise en page de notre site. Quand nous
étions d'accord nous avons commencé a programmer le HTML et commencé à faire la grille
ainsi que la fonction joueur 1 et 2 grâce a une image images d'une case de la grille du
puissance 4 et une image d'un pion jaune et rouge.
Puis par le conseil de notre professeur attitré nous avons commencé à faire plusieurs pages
dans notre site afin d’énoncer les règles du puissance 4, la présentation du projet et enfin du
jeu.
Puis lorsque nous avons fini le HTML nous nous sommes attaqués à la plus grosse partie du
projet qui est l’écriture et la programmation du jeu grâce au JavaScript. Pour cela nous
avons commencé étape par étape en énonçant tout d'abord la grille. Puis au fur et à mesure
que notre écriture du JavaScript avancer nous nous sommes rendu compte que gagner en
alignant horizontalement ces pions seraient difficile. Pour cela nous nous plus focalisé sur le
faite de gagner en alignant ces pions soit horizontalement soit verticalement.
Nous avons aussi voulu commence par tester notre programme qu'avec 2 pions pour vérifier
si notre programme fonctionné bien, puis lorsque nous avons réussi nous l'avions testé pour
3 pions puis finalement avec 4.
3. Problèmes rencontrés
Au cours de notre écriture du JavaScript nous nous sommes rendu compte que de
gagner en ayant les pions horizontalement seraient assez difficile à réaliser.
Notre second problème était que lorsque nous voulions soit sauvegarder la partie ou le
prénom du joueur cela devait nous emmener vers un autre langage sur lequel nous n'avions
pas étudié cette année qui est le langage Python.
IV/ Conclusion
Durant cette année en ISN j'ai appris à coder un site internet ainsi qu'un jeu. Pour
cela il était nécessaire de connaître plusieurs langages : HTML, CSS ainsi que le JavaScript.
À travers le codage et la manière de programmer un jeu j'ai appris énormément, j'ai vu des
fonctions que je ne connaissais pas et découvert des solutions à des problèmes. Néanmoins,
il persiste un problème : le fait de ne pas pouvoir enregistrer la partie ou le prénom du
joueur. On pourrait perfectionner la difficulté du jeu en ajoutant pourquoi pas plusieurs
niveaux de difficulté de l'intelligence Artificielle ou la possibilité de jouer en multijoueurs.
Ce projet d'ISN était plaisant à faire et m'a donné goût à la programmation.
Annexes
Code du jeu :