Write page of Quoridor

web/projets/pro_quoridor.php

@@ -23,23 +23,79 @@
                 TIPE 2017
             </h2>
             <p class="lead">
-                Développement d'intelligences artificielles pour le jeu de stratégie quoridor.
+                Développement d'intelligences artificielles pour le jeu de stratégie Quoridor.
                 Ce projet est un travail de groupe réalisé sur l'ensemble de ma seconde année de prépa.
             </p>
         </div>
 
-        <!-- Travaux -->
-        <div class="alert alert-info">
-            <img class="float-left" src="https://img.icons8.com/color/90/000000/road-worker.png" alt="worker flat icon">
-            <p>
-                Mon site web est encore en <strong>développement</strong>. Cette section sera implémentée dans une
-                future version.
-            </p>
-            <p>
-                Repassez plus tard ...
-            </p>
+        <!-- Content -->
+        <h3>
+            <img src="https://img.icons8.com/color/48/000000/term.png" alt="term flat icon">
+            Introduction
+        </h3>
+        <p>
+        Le projet de Travail d'Initiative Personnelle Encadré (TIPE) a lieu pendant la deuxième année de classe préparatoire et
+        constitue une épreuve orale durant les concours.
+        </p>
+        <p>
+        Le thème pour le tétra-concours 2017 était intitulé <em>Optimalité : choix, contraintes et hasard</em>.
+        Avec mon équipe consituée de quatre étudiants, nous avons opté pour la réalisation d'intelligences artificielles
+        sur le jeu de stratégie Quoridor.
+        </p>
+
+        <h3>
+            <img src="/include/images/quoridor_96x96.png" class="rounded-circle" alt="Quoridor icon" height=38 style="margin-bottom:5px">
+            Notre travail
+        </h3>
+        <div class="row">
+            <div class="col-lg-12 col-xl-6">
+                <h4>
+                    Principe du jeu
+                </h4>
+                <p>
+                <strong>Quoridor</strong> est un jeu de stratégie en tour par tour opposant deux joueurs.
+                </p>
+                <p>
+                Chaque joueur cherche à atteindre le bord opposé du plateau. Pendant son tour, il n'est possible d'exécuter qu'une unique action :
+                <strong>déplacer</strong> son pion sur une case adjacente ou placer une <strong>barrière</strong>.
+                </p>
+
+                <h4>
+                    Intelligences artificielles
+                </h4>
+                <p>
+                Plusieurs types d'IA ont été conçues : <em>MinMax</em>, avec élagage <em>AlphaBeta</em>, statistique,
+                ou bien par <em>réseau de neurones</em> entraîné par <em>algorithme génétique</em>.
+                </p>
+
+                <h4>
+                    Code source
+                </h4>
+                <p>
+                Le projet a été implémenté en <em>Python 3</em>. Une interface utilisateur a été produite afin de faire des parties
+                contre nos IA.
+                </p>
+                <p>
+                Il est aussi possible de faire des parties contre une autre personne, en jouant à tour de rôle sur le même ordinateur.
+                </p>
+                <p>
+                L'ensemble du code produit est disponible <a href="https://gogs.jovian-hersemeule.eu/DricomDragon/Quoridor">sur mon instance de <em>Gogs</em></a>, sous licence publique générale GNU
+                (<em>GNU GENERAL PUBLIC LICENSE</em>).
+                </p>
+                <p>
+                Après avoir installé <a href="https://www.python.org/downloads">Python 3</a> sur votre ordinateur, vous pouvez vous-même essayer
+                de vaincre nos IA (attention, certaines sont particulièrement redoutables).
+                </p>
+            </div>
+            <div class="col-lg-12 col-xl-6">
+                <img class="img-fluid mx-auto d-block" 
+                     src="/include/images/quoridor_window_1.png"
+                     alt="Fenêtre du jeu refaite avec Tkinter"/>
+            </div>
         </div>
 
+        <br/>
+
         <!-- Pagination -->
         <ul class="pagination pagination-lg justify-content-center">
             <li class="page-item">