diff --git a/front/assets/Background.jpg b/front/assets/Background.jpg
new file mode 100644
index 0000000..edda548
Binary files /dev/null and b/front/assets/Background.jpg differ
diff --git a/front/assets/applause.mp3 b/front/assets/applause.mp3
new file mode 100644
index 0000000..c673fb7
Binary files /dev/null and b/front/assets/applause.mp3 differ
diff --git a/front/assets/downArrowDynamic.png b/front/assets/downArrowDynamic.png
new file mode 100644
index 0000000..59aa507
Binary files /dev/null and b/front/assets/downArrowDynamic.png differ
diff --git a/front/assets/electroSportRock.mp3 b/front/assets/electroSportRock.mp3
new file mode 100644
index 0000000..218f380
Binary files /dev/null and b/front/assets/electroSportRock.mp3 differ
diff --git a/front/assets/favicon.ico b/front/assets/favicon.ico
new file mode 100644
index 0000000..0fbb2dc
Binary files /dev/null and b/front/assets/favicon.ico differ
diff --git a/front/assets/github.png b/front/assets/github.png
new file mode 100644
index 0000000..29d5d1f
Binary files /dev/null and b/front/assets/github.png differ
diff --git a/front/assets/leftArrowDynamic.png b/front/assets/leftArrowDynamic.png
new file mode 100644
index 0000000..b6f17d3
Binary files /dev/null and b/front/assets/leftArrowDynamic.png differ
diff --git a/front/assets/paranoia.mp3 b/front/assets/paranoia.mp3
new file mode 100644
index 0000000..60095d0
Binary files /dev/null and b/front/assets/paranoia.mp3 differ
diff --git a/front/assets/pause.png b/front/assets/pause.png
new file mode 100644
index 0000000..2ebe9df
Binary files /dev/null and b/front/assets/pause.png differ
diff --git a/front/assets/play.png b/front/assets/play.png
new file mode 100644
index 0000000..d26ad38
Binary files /dev/null and b/front/assets/play.png differ
diff --git a/front/assets/restart.png b/front/assets/restart.png
new file mode 100644
index 0000000..f60f945
Binary files /dev/null and b/front/assets/restart.png differ
diff --git a/front/assets/rightArrowDynamic.png b/front/assets/rightArrowDynamic.png
new file mode 100644
index 0000000..dcbcc2c
Binary files /dev/null and b/front/assets/rightArrowDynamic.png differ
diff --git a/front/assets/sound.png b/front/assets/sound.png
new file mode 100644
index 0000000..3a07765
Binary files /dev/null and b/front/assets/sound.png differ
diff --git a/front/assets/staticDown.png b/front/assets/staticDown.png
new file mode 100644
index 0000000..0558e29
Binary files /dev/null and b/front/assets/staticDown.png differ
diff --git a/front/assets/staticLeft.png b/front/assets/staticLeft.png
new file mode 100644
index 0000000..c92eac4
Binary files /dev/null and b/front/assets/staticLeft.png differ
diff --git a/front/assets/staticRight.png b/front/assets/staticRight.png
new file mode 100644
index 0000000..7910a29
Binary files /dev/null and b/front/assets/staticRight.png differ
diff --git a/front/assets/staticUp.png b/front/assets/staticUp.png
new file mode 100644
index 0000000..96dc99e
Binary files /dev/null and b/front/assets/staticUp.png differ
diff --git a/front/assets/upArrowDynamic.png b/front/assets/upArrowDynamic.png
new file mode 100644
index 0000000..3f1a03c
Binary files /dev/null and b/front/assets/upArrowDynamic.png differ
diff --git a/front/ggr.html b/front/ggr.html
new file mode 100644
index 0000000..0d0d534
--- /dev/null
+++ b/front/ggr.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+  <head>
+    <meta charset="utf-8">
+    <link rel="stylesheet" type="text/css" href="./style/styleDDR.css">
+    <link href="https://fonts.googleapis.com/css?family=Monoton" rel="stylesheet">
+    <link rel="shortcut icon" type="image/x-icon" href="./assets/favicon.ico" />
+    <title>Green Green Revolution</title>
+  </head>
+  <body>
+    <span id="modalOverlay">
+      <div id="startGameModal" class="modalMessage">
+        <h3>Green Green Revolution !</h3>
+        <p>Ce jeu est une reproduction du classique DDR.</p>
+        <p>Utiliser les touches directionnelles ou D, F, J et K pour jouer. Vous pouvez aussi pause/resume, restart, et mute/unmute la musique en cliquant sur les icônes à droite du canvas.</p>
+        <button id="redirectButton">Continuer</button>
+      </div>
+      <div id="endGameModal" class="modalMessage">
+        <h3>Merci d'avoir jouer !</h3>
+        <button id="playAgainButton">Rejouer</button>
+      </div>
+    </span>
+
+    <div class="title">Green Green Revolution</div>
+    <section class="canvasArea">
+      <div class="links">
+        <a href="https://github.com/joniboy74prog/nuitdelinfo"><img src="./assets/github.png"></a>
+      </div>
+      <div class="controls">
+        <img id="muteIcon" src="./assets/sound.png">
+        <img id="pauseIcon" src="./assets/pause.png">
+        <img id="restartIcon" src="./assets/restart.png">
+      </div>
+      <div id="score">Score: 0</div>
+      <div class="combo">
+        <p id="comboCount"></p>
+        <span id="comboText">combo</span>
+      </div>
+      <canvas id="ttrCanvas" width="450" height="680"></canvas>
+    </section>
+    <div id="directions">
+      <h4>Comment jouer</h4>
+      <ul>
+        <li>Utiliser les touches directionnelles ou D, F, J et K pour jouer.</li>
+        <li>Essayer d'appuyer sur les bonnes touches lorsque les flèches bougeantes chevauchent les flèches statiques.</li>
+        <li>Un compteur montre le combo actuel.</li>
+        <li>Plus le combo est haut, plus vous obtiendez de points !</li>
+      </ul>
+      <button id="playButton">Jouer</button>
+    </div>
+    <div class="arrowImages">
+      <img id="left" src="./assets/staticLeft.png">
+      <img id="down" src="./assets/staticDown.png">
+      <img id="up" src="./assets/staticUp.png">
+      <img id="right" src="./assets/staticRight.png">
+    </div>
+    <audio id="mainSong" src="./assets/electroSportRock.mp3"></audio>
+    <audio id="endApplause" src="./assets/applause.mp3"></audio>
+  </body>
+  <script src="./src/arrowSprites.js" type="text/javascript"></script>
+  <script src="./src/scriptDDR.js" type="text/javascript"></script>
+</html>
diff --git a/front/index.html b/front/index.html
index 80c10a8..ca2c514 100644
--- a/front/index.html
+++ b/front/index.html
@@ -8,6 +8,8 @@
     <link rel="stylesheet" href="style/init.css">
     <link rel="stylesheet" href="style/navbarHorizontal.css">
     <link rel="stylesheet" href="style/main.css">
+
+    <script src="./src/konami.js" type="text/javascript" defer></script>
 </head>
 <body id="accueil">
 
@@ -26,15 +28,15 @@
 </header>
 
 <main>
-        <h1>Sauvons la planète,</h1>
-        <h2>distinguons la réalité<br>des idées reçues.</h2>
-        <p id="sous-pres">
-            Défiez les idées reçues sur l'écologie avec notre quiz captivant !
-            </br>
-            Testez-vous dès maintenant pour une expérience éducative et
-            amusante.
-        </p>
-        <button id="btnjouer"><a href="./jouer.html">Essayer ce jeu</a></button>
+    <h1>Sauvons la planète,</h1>
+    <h2>distinguons la réalité<br>des idées reçues.</h2>
+    <p id="sous-pres">
+        Défiez les idées reçues sur l'écologie avec notre quiz captivant !
+        </br>
+        Testez-vous dès maintenant pour une expérience éducative et
+        amusante.
+    </p>
+    <button id="btnjouer"><a href="./jouer.html">Essayer ce jeu</a></button>
 </main>
 
 
