N° 05 / 08 — Jeu · Multijoueur
Pepoo Arena
Le party game qui se lance en un clic : poussez vos amis à l'eau avant que l'île ne disparaisse.
- Rôle
- Conception et développement
- Année
- 2026
- Statut
- En lignePerso
- Stack
- Next.js · TypeScript · Canvas 2D · WebSocket · Node.js · PWA
- Liens
- Jouer ↗
01 / 07
Le problème
Un party game devrait se lancer aussi vite qu'on a envie de jouer : pas d'installation, pas de compte, sur ordinateur comme sur téléphone. Un lien, et c'est parti.
02 / 07
Ce que j'ai fait
Quatre modes : chacun pour soi contre trois IA, 2 contre 2, entraînement, et en ligne dans un salon privé où l'on invite jusqu'à 3 amis par code ou par lien.
Six terrains, de l'île tranquille au volcan, jusqu'au dos d'une tortue géante, et onze objets pour que chaque manche parte en vrille. Au clavier et à la souris comme au doigt.
03 / 07
Comment c'est construit
Le moteur sépare strictement la simulation et le rendu : la simulation ne dessine rien, ce qui la rend testable sans navigateur et prête à tourner sur un serveur.
Le rendu est en Canvas 2D, et le multijoueur passe par WebSocket, avec des salons et des instantanés de l'état du jeu.
- Simulation sans rendu
- Salons WebSocket
- Instantanés de l'état
- Rendu Canvas 2D
04 / 07
Les défis
- 01
Une simulation sans écran
La physique et les règles ne dessinent rien : terrains et objets se vérifient par des tests, sans ouvrir le jeu, et le même code peut tourner sur le serveur.
- 02
Du multijoueur sans compte
Un serveur Node.js en WebSocket gère les salons privés, rejoints par code ou par lien, et envoie à chaque joueur des instantanés de l'état du jeu.
- 03
Un lien, et c'est parti
Rien à installer : le jeu s'ouvre dans le navigateur, au clavier comme au doigt, s'installe comme une application (PWA) et soigne son référencement. Il est déployé en conteneur Docker par GitLab CI.
05 / 07
Résultats
En ligne, gratuit, sans inscription : une partie se lance en un clic, sur ordinateur comme sur téléphone.
06 / 07
Ce que j'ai appris
Séparer la simulation du rendu dès le premier jour ne coûte presque rien, et change tout ensuite : on peut ajouter des terrains et des objets en les vérifiant sans ouvrir le jeu.
07 / 07
La stack technique
- Front-end
- Next.jsTypeScriptPWATailwind CSS
- 3D, animation et temps réel
- Canvas 2DWebSocket
- Back-end et API
- Node.js
- DevOps, cloud et tests
- DockerGitLab CI/CDGit
- Produit, SEO et méthodes
- SEO
Projet suivant · 06 / 08
Soie
Soie
