Guess the IA

Projet Long de Master 1

Party game où quelques joueurs dessinent un mot proposé. Des IA devront reconnaître les dessins des joueurs et générer d'autres dessins. Les joueurs devront essayer d'associer chaque dessins à chaque joueurs sans se faire avoir par l'IA.

Installation

Attention, les commandes sont à éxécuter dans le répertoire src/server.

cd src/server

Pour installer les dépendances de Node.js :

npm install express canvas numjs socket.io cli-progress colors @tensorflow/tfjs-node

Pour télécharger les modèles de sketch_rnn et setup le repertoire de génération :

mkdir generated && mkdir sketch_rnn_model_data && python3 ../notebooks/download_decoder_models.py

Pour mettre en place les clés de chiffrements pour le HTTPS :

mkdir key && cd key && openssl req -x509 -newkey rsa:2048 -keyout keytmp.pem -out cert.pem -days 365

Choisissez une passphrase et gardez la.

openssl rsa -in keytmp.pem -out key.pem

Re-rentrez votre passphrase et remplissez les informations CSR demandées. Pour le champs Common name, mettez soit localhost soit *.ngrok.io selon votre utilisation. Voir la section Utilisation en ligne.

Utilisation

Une fois installé, exécutez cette commande pour lancer le serveur web sur le port 3000 :

node app.js

Utilisation en ligne

Pour pouvoir utiliser le jeu en ligne et permettre à des joueurs hors du réseau local de rejoindre, nous utilisons ngrok qui génère un domaine qui fait un tunel vers localhost:3000. Une fois ngrok installé et le serveur lancé, exécuter la commande :

ngrok http https://localhost:3000

Connectez vous à https://localhost:3000/ et jouez !

Routes

/ : Page d'accueil.
/join : Rejoindre un salon.
/predict : Tester le modèle de classification. (Ouvrez la console de votre navigateur pour afficher le résultat.)
/generate/random : Générer une image de classe aléatoire. Vous pouvez remplacer random par la classe de votre choix. La liste des classe est disponible dans le fichier src/server/classes.json.

Screenshot

Architecture

.
├── docs/								[ Documents ]
│   ├── journal.org
│   └── presentation.md
├── rapport/								[ Rendu de rapport ]
│   ├── preview.jpg
│   ├── rapport.pdf
│   └── rapport.tex
├── src/		    			             		[ Fichiers ]
│   ├── notebooks/							[ Scripts pour l'entrainement et le téléchargement des modèles ]
│   │   ├── QuickDrawClassification_Thumbnails_Convert.ipynb
│   │   ├── QuickDrawClassification_Thumbnails_Training.ipynb
│   │   └── download_decoder_models.py
│   └── server/								[ Serveur Node.js ]
│       ├── app.js							[ Script du serveur web ]
│       ├── classes.json
│       ├── cnn_model/						        [ Modèle CNN de classification ]
│       │   ├── group1-shard1of2.bin
│       │   ├── group1-shard2of2.bin
│       │   └── model.json
│       ├── generate.js							[ Script pour la génération d'image ]
│       ├── generated/							[ Répertoire de sauvegarde des images générées ]
│       ├── img_processing.js						[ Script pour le traitement et la génération d'images ]
│       ├── key/                                                        [ Clés de chiffrements pour le HTTPS ]
│       │   ├── cert.pem
│       │   ├── key.pem
│       │   └── keytmp.pem
│       ├── public/							[ Répertoire de fichiers statiques du serveur web ]
│       │   ├── html/
│       │   │   ├── draw.html
│       │   │   ├── guess.html
│       │   │   ├── index.html
│       │   │   ├── join.html
│       │   │   ├── predict.html
│       │   │   ├── room.html
│       │   │   └── score.html
│       │   ├── js/
│       │   │   ├── draw.js
│       │   │   ├── guess.js
│       │   │   ├── join.js
│       │   │   ├── predict.js
│       │   │   ├── room.js
│       │   │   └── score.js
│       │   └── style/
│       │       └── style.css
│       ├── sketch_rnn.js						[ Bibliothèque de traitement des modèles RNN ]
│       └── sketch_rnn_model_data/					[ Données des modèles RNN de génération ]
│           ├── bicycle.js
│           ├── butterfly.js
│           ├── castle.js
│           ├── cat.js
│           ├── eye.js
│           ├── face.js
│           ├── flower.js
│           ├── hand.js
│           ├── key.js
│           ├── mermaid.js
│           ├── pineapple.js
│           ├── rabbit.js
│           ├── snail.js
│           ├── spider.js
│           └── truck.js
├── presentation-bignon-wang.pdf                                        [ Présentation ]
└── README.md								[ Fichier README ]

Dépendances

Node.js pour le serveur.
Keras, et d'autres outils classiques de ML. Voir les imports des notebooks.
Google Colab pour l'environnement d'entrainement du modèle CNN.
Bootstrap pour le CSS.

Dépendances NPM

Express pour le serveur web;
Socket.io pour implémenter les WebSockets et faire la communication entre client et serveur.
Canvas pour la manipulation de canvas en backend.
NumJS pour des manipulation de matrices.
Cli-progress pour afficher des barres de chargement.
Colors.js pour collorer les affichages.
TensorFlow.js pour exécuter le modèle de classification.

totocptbgn/GuessTheAI