La table, refaite à neuf
L'ancienne table servait à éprouver les règles : feutre vert et panneaux parchemin. Voici celle du jeu — un bureau vu du dessus, la fiche de debug au milieu, et trois sièges au lieu de quatre.
Six pages, un seul monde
Le site public et le jeu partagent le même décor : panneaux sombres, sarcelle #62e8d5, or #ffbf79, typo mono pour tout ce qui ressemble à un instrument. On passe de la vitrine à la table sans changer d'univers — et sans changer d'application : c'est le même bundle.
Les pages indexables ne sont pas servies en SPA. Elles sont prerendues au build, en HTML complet, métadonnées comprises : environ 750 fichiers, lisibles par les moteurs qui n'exécutent pas de JavaScript comme par les scrapers de Discord, Slack ou LinkedIn. Le jeu, lui, vit derrière une coquille SPA en noindex.
Le deck
Le catalogue est le morceau le plus lourd du site : chaque carte a sa page, son slug tiré du nom traduit, son image de partage 1200×630 en JPEG, et son dossier mécanique — ce qu'elle fait, contre qui, ce qu'elle coûte si ça tourne mal.
- 334cartes
- 138bugs
- 97équipements
- 39bonus jetables
- 28incidents
- 27combos de rôle
- 19métiers & profils
Une minute sur la table
De l'accueil à la fiche de debug, sans coupure : le portail de jeu, l'arrivée sur le plateau, un ticket qui sort de la pile, le rapport de force, l'appel à un binôme et le routeur de réassignation. Tout est filmé sur la table réelle, contre deux IA.
L'ancienne table était un banc d'essai
La première table n'a jamais eu vocation à être vue : elle servait à éprouver les règles. Un feutre vert, des panneaux parchemin, le duel joué à même la table à droite des pioches — assez pour vérifier qu'une vélocité battait bien des story points, pas assez pour donner envie de s'asseoir.
La refonte a remplacé cette couche-là et rien d'autre : le moteur, les cartes et les règles n'ont pas bougé. 162 fichiers, ~965 lignes de CSS orphelines supprimées après vérification du graphe d'imports, et une poignée de composants échangés contre leurs équivalents plateau.
Retiré — les pièces d'essai
- CombatArena le duel posé sur le feutre
- CombatWindow la fenêtre d'intervention
- PlayedCardReveal / BugReveal deux révélations concurrentes
- DrawDrop la pioche en glisser-déposer
- FeltMark / FeltTech le décor de feutre
- TurnBanner le bandeau de tour
- ~965 lignes de CSS sans référence
Posé — la table de jeu
- SprintBoardFrame le bureau, ses fonds calibrés
- DrawReveal une seule fiche pour toute pioche
- CombatForce le rapport de force, ligne par ligne
- ReassignModal le routeur de tickets
- PairPick / PairRequest / PairWait le binôme, des deux côtés
- TableNotices / BoardChatter ce qui se dit à la table
- OpponentPanels / PlayerPanel les postes de travail
Le plateau fixe la règle. Deux panneaux adverses en face du tien : la table s'arrête donc à trois joueurs, IA comprises. Le plafond ne vit plus qu'à un endroit dans le code, et le lobby, la file d'attente, les IA et les données structurées le lisent de là.
La fiche de debug
C'est la pièce centrale du nouveau plateau. Un bug sort de la pile, la fiche s'ouvre : ta vélocité contre ses story points, décomposée ligne par ligne — base, équipement, combos, jetables, binôme, boosts posés. À droite, ce que la table vient de poser pendant ton debug, et le compte à rebours de la fenêtre d'intervention.
Le détail qui change tout : la fiche dit aussi ce qui arrive si ça rate. L'effet de bord est écrit avant que tu appuies, pas après.
Ce qu'on fait quand c'est à soi
Piocher un ticket — une carte de la pile Tickets, face visible. Si c'est un bug, le debug démarre aussitôt.
Debug — ta vélocité doit être strictement supérieure aux story points. À égalité, le bug tient.
Appeler du renfort — un binôme ajoute sa vélocité et repart avec un goodie. Ou réassigner : le dé, et deux sorties sur six.
Pas de bug ? Piocher en douce, face cachée, ou sortir un bug de sa main pour aller le chercher.
S'équiper, vendre, acheter — 1000 crédits en poche valent un niveau. Jamais le dixième.
Fin de tour — cinq cartes en main maximum, c'est le WIP limit. Le surplus part au plus bas niveau de la table.
Niveau 10 en battant un bug — la seule façon de gagner. Pas en vendant des AirPods.
32 fiches courtes, sur la vraie table
Le didacticiel n'est pas une vidéo ni une page de texte : c'est une partie jouable sur les mêmes composants que la table live. Trois actes — le récit, les règles, la table — puis trente-deux fiches, une idée par fiche, avec au plus un bloc visuel par étape.
Chaque fiche a sa réplique enregistrée. Quand le clip manque, la fiche retombe sur la voix de synthèse du navigateur — c'est le garde-fou le plus fragile du jeu, et il tient à un fichier par étape.
Sous le capot
| Front | React + Vite, Framer Motion. Le site public et la table sont la même application, avec des bundles séparés pour que la vitrine ne charge pas le jeu. |
|---|---|
| Temps réel | Fastify + Socket.IO. Le moteur de jeu vit côté serveur ; les actions passent aussi en HTTP, ce qui rend une partie scriptable de bout en bout. |
| Données | PostgreSQL + Prisma, migrations versionnées. Le catalogue de cartes, lui, est écrit à la main et figé dans un instantané vérifié en CI. |
| Sièges | 3 au maximum, deux humains minimum dans la file. La limite vient du plateau, pas du moteur : il n'affiche que deux postes adverses. |
| Sans compte | Une table d'essai s'ouvre sur un cookie signé marqué guest — jamais interchangeable avec une session. Trois tables par IP et par dix minutes, purge au bout de six heures. |
| SEO | ~750 pages prerendues, sitemaps, JSON-LD connecté, images de partage générées au build. 102 tests refusent un build qui perdrait un titre, une canonique ou un hreflang. |
| Langues | Interface en français, anglais, allemand, espagnol. Pages indexées en français et anglais. Voix du narrateur en français et anglais. |
Le bureau est une arène
2 à 3 joueurs, un code de table à partager, PVP en direct — et des IA pour tenir les sièges vides. Les règles bougent encore et des parties peuvent sauter : c'est écrit en haut du site, et c'est vrai.