Projet post-WIMP (2012-13) Jeux multijoueurs sur table interactive

Victor RANNAUD, Alex GRANDJEAN, Sabine NOTHEISEN, Gabriel SIMI, Mehdi BENJELLOUN

Dans le cadre de ce projet, nous avons réalisé un prototype d’une table de jeux de société interactive. L’objectif était de créer une table tactile universelle, permettant de jouer à un ou plusieurs jeux, qu’il s’agisse de jeux de société ou de jeux en temps réel.

Contexte

Pour jouer aux jeux de société, il faut un matériel conséquent (plateau, pièces,...) dont certaines parties peuvent être perdues, ce qui peut avoir pour conséquence que le jeu devienne inutilisable. De plus, ce matériel peut rapidement prendre une place importante. Nous souhaitons offrir à l’utilisateur la possibilité d’avoir tous les jeux qu’il aime (à long terme) en ayant un minimum de matériel. L’utilisation d’un ordinateur couplé à la Diamond Touch nous permettra également d’augmenter l’immersion dans le jeu en proposant des effets visuels. Le fait de disposer d’un ordinateur permet également d’apporter un genre de jeux jusqu’ici injouable sur une table : les jeux en temps réel, comme les jeux de stratégie. Par ailleurs, les particularités de la Diamond Touch nous permettront de proposer des jeux qui n’existent actuellement pas sur table, comme par exemple des jeux sur ordinateur qui se jouent contre des intelligences artificielles.

Approche

Matériel

Notre prototype de table de jeux repose sur l’utilisation de la Diamond Touch MERL, une surface tactile capacitive permettant de détecter le touché de plusieurs utilisateurs à la fois, jusqu’à un maximum de quatre, et capable de distinguer le touché de chacun des joueurs.

Diamond Touch avec 4 utilisateurs

Pour fonctionner correctement, le prototype se compose donc des éléments suivants:

une Diamond Touch
un projecteur, afin de projeter le plateau de jeu sur la table
un ordinateur, sur lequel tourne le moteur du jeu

Avec ce matériel, nous avons réalisé un moteur de jeu pour un Phage War multi-joueur : Touch Wars, dont nous allons maintenant voir les règles.

Jeu implémenté : Touch Wars

Touch wars est basé sur le jeu Phage War et suit des règles similaires. Le but du jeu est de conquérir toutes les cellules adverses en envoyant à leur conquête des virus provenant de ses propres cellules. Les virus se multiplient dans les cellules jusqu’à ce que celle-ci atteigne sa capacité maximum. Pour lancer une attaque, il faut sélectionner les cellules que l’on souhaite faire attaquer puis indiquer la cible de l’attaque. La moitié de la population de chacune des cellules choisies sera alors envoyée. Si l’attaque est portée contre une cellule ennemie, les virus se combattent et la cellule revient à celui qui possédait le plus grand effectif. Si elle est envoyée sur une cellule alliée, les virus viennent s’ajouter à ceux déjà présents dans la cellule. La partie s’arrête lorsqu’un joueur a conquis la totalité des cellules du plateau.

Réalisation

La version finale du prototype permet de jouer au Phage War jusqu’à 4 personnes, sur la table tactile. Afin de mesurer l’influence de l’interaction au toucher sur les performances de jeu sur le Phage War, le prototype permet également à un joueur d’utiliser la souris pour jouer.

Moteur du jeu

Le moteur du jeu a été entièrement implémenté en C++, il permet de réaliser des parties de Touch Wars et de charger des plateaux personnalisés créés à partir de fichiers texte. Il contient les classes suivantes:

La classe Cellule: chaque cellule contient des informations sur sa taille maximale, sa population courante, sa vitesse de multiplication, son propriétaire et sa position sur le plateau. Elles possèdent également un attribut selected utilisé pour afficher ou non la confirmation visuelle indiquant que la cellule est sélectionnée.
La classe Joueur: Cette classe permet de déclarer les différents joueurs de la partie, il peut y avoir jusqu’à 4 joueurs différents. Cette classe contient également les caractéristiques inhérentes à la catégorie de virus choisie telle que la force, la vélocité et la vitesse de multiplication.
La classe Attaque: Cette classe permet de déclarer les attaques d’une cellule à une autre. Elle contient les informations sur la cellule cible et la cellule de départ, le nombre de virus envoyés et le nombre de tics d’horloge restant avant l’arrivée.
La classe Plateau: Cette classe contient l’interface principale du jeu, elle contient la liste des cellules du plateau, la liste des joueurs et la liste de attaques. Une méthode permet de charger un plateau depuis un fichier texte. La méthode game_over() vérifie l’état du plateau et renvoie true si la partie est finie.

A chaque tic d’horloge, tant que l’utilisateur touche la table, on vérifie s’il touche une cellule et on met à jour la liste des cellules sélectionnées, et des attaques lorsqu’une nouvelle attaque a lieu. Quand la partie est finie, une image de victoire s’affiche et il n’est plus possible d'interagir avec la table.

Victoire des rouges

Graphisme

L’interface graphique ressemble à celle du Phage War original, bien qu’étant plus épurée. Cependant, certains effets graphiques ont étés implémentés afin de permettre de mieux suivre le déroulement du jeu.

L’interface graphique a été entièrement implémentée en C++ à l’aide de Qt. Le moteur graphique est composé de plusieurs éléments :

Un ensemble d’arrière-plans correspondants aux différents évènements du jeu (Accueil, Jeu, Victoire d’un jour)
Des buffers (QSpinBox, invisibles à l’écran) qui permettent d’enregistrer à tout moment la position du doigt de chaque joueur.
Des QTimer, qui permettent à la fois d'effectuer la transition entre l'écran d'accueil, la récupération à intervalles réguliers des différentes données et enfin les calculs et la mise à jour du plateau de jeu.
Une fonction PaintEvent qui gère l’affichage en temps réel des évènements et la mise à jour de la scène.
Une fenêtre (un QWidget), affichée en plein écran, dans laquelle la scène est dessinée. La scène est composée des éléments suivants :
- Pour chaque joueur : un certain nombre de cellules de la couleur du joueur, les cellules possédées par ce dernier.
- Pour chaque attaque : un certain nombre de cercles, de la couleur du joueur attaquant, le nombre étant proportionnel à la puissance de l’attaque.
- Pour chaque cellule sélectionnée : un rayon de la couleur du joueur possédant la cellule, qui a pour origine la cellule sélectionnée et pour extrémité le doigt du joueur.


Sélection des cellules	Attaque des cellules

Diamond Touch

Les interactions possibles avec la table sont basées sur les mouvements du Phage War original, et ont été implémentées de façon à obtenir les gestes les plus intuitifs possibles. La sélection d’une cellule s’effectue en posant le doigt dessus. Ensuite, il faut maintenir le doigt sur la Diamond Touch pour sélectionner plusieurs autres cellules alliées. Une fois qu'une ou plusieurs cellules ont été sélectionnées, on positionne le doigt sur la cible souhaitée, puis on lève le doigt. La cible peut être une cellule alliée, afin de la renforcer, ou une cellule ennemie, afin d’essayer d’en prendre le contrôle. Lorsqu’un utilisateur pose deux doigts sur la table, comme la Diamond Touch détecte le maximum de capacitance selon l’axe X et l’axe Y, on n’aura qu’une seule coordonnée selon chacun des axes. Les gestes à deux doigts ou plus ne sont donc pas gérés correctement par le prototype. L’implémentation de la détection de la position des doigts des utilisateurs sur la Diamond Touch permet de d’envoyer 40 positions par seconde, ce qui permet un suivi temps-réel fluide.

Voici une visualisation de la version finale du prototype:

Vue du plateau

Voici deux vidéos permettant de voir la joie des utilisateurs et ce qu'il se passe sur l'écran:
Vidéo des utilisateurs en train de jouer
Vidéo du plateau de jeu tel qu'il est projeté sur la DiamondTouch

Évaluation du prototype

Pour faire l’évaluation de notre prototype, nous avons utilisé deux groupes de 5 personnes, chacun appartenant à une population différente :

La population A, dont les membres n’avaient aucune expérience du jeu Phage War.
La population B, dont les membres avaient déjà une assez grande expérience du jeu Phage War.

Chaque expérience a été réalisée avec les membres d’une même population, et le protocole était le suivant : un des individus était placée devant l’ordinateur, et contrôlait ses cellules à l’aide d’une souris classique, tandis que 3 autres individus étaient placés devant la Diamond Touch, et contrôlaient leur cellules de manière tactile. Dans un cas comme dans l’autre, les résultats ont été très clairs : on observe une quasi-totalité de victoires des joueurs utilisant la Diamond Touch. En effet, moins de 10% de l’ensemble des parties jouées ont été remportées par un joueur utilisant la souris. Ces chiffres sont par ailleurs valables peu importe le nombre de joueurs utilisant la table, ce qui indique que la gêne envisagée entre les différents utilisateurs de la table est assez minime.

Suite à cette évaluation, il apparaît que, les joueurs comprennent rapidement les différents mouvements possibles (à partir du moment où on leur explique les règles). Par contre, chaque joueur n’utilise instinctivement qu’une seule main pour jouer. Tous les utilisateurs reconnaissent qu’il est plus amusant de jouer avec la Diamond Touch et que la sélection et le déplacement sont moins aisés avec la souris. En effet, utiliser une interface tactile permet de tirer profit de la proprioception afin de faire un geste plus précis et plus rapide. De plus, comme les cibles à toucher sont relativement grandes, la précision apportée par le pointeur de souris n’est pas décisive.

Voici plusieurs points qui ont été mis en lumière lorsque nous avons fait essayer notre prototype à des personnes extérieures au projet :

Réaction d’une utilisatrice qui joue à la souris après avoir fait deux parties avec le Diamond Touch “C’est super dur à la souris!”
Certains utilisateurs ayant déjà joué à la version en ligne du Phage War, puis jouant ensuite beaucoup avec la Diamond Touch et rejouant à la souris avec notre interface ont trouvé le retour à la souris très contraignant.
Certains utilisateurs s’attendent à recevoir une confirmation visuelle des actions qu’ils réalisent.
Certains utilisateurs essaient de sélectionner des cellules qui ne sont plus à eux (mauvaise compréhension des règles).
Après quelques parties, les utilisateurs font des expériences avec le toucher à deux doigts.

L'expérience nous confirme la pertinence de notre approche.

Conclusion

Au final, le prototype est fonctionnel et ne présente pas de bogue majeur. Suite au retour des utilisateurs, nous avons rajouté un affichage à la fin de la partie qui annonce le vainqueur de la partie. Il faudrait rajouter un système plus efficace pour montrer à l’utilisateur qu’il a bien sélectionné une cellule : pour le moment les bords de la cellule s’épaississent lorsqu’on la sélectionne, mais cet effet ne semble pas suffisamment marqué et les utilisateurs ne semblent pas le remarquer rapidement.

Une amélioration possible pour notre prototype serait de gérer les interactions à plusieurs doigts. En effet, le projet initial prévoyait d’intégrer des mouvements à deux doigts. Ceci aurait permis de proposer un plus large éventail de mouvements possibles, et d’autoriser des mouvements impossibles à réaliser avec une simple souris.

Enfin, nous pourrions développer des nouveaux jeux à ajouter sur notre table, afin de disposer d’une base de donnée de jeux disponibles avec la table interactive. Le projet initial envisageait notamment d’implémenter le jeu de société Blokus, qui n’a pas pu être développé par manque de temps.