Pilotez un oiseau à mains libres dans une ville procédurale infinie : penchez les épaules devant la caméra pour virer, battez les bras pour grimper.
Vue d’ensemble
Bird Game est un jeu de vol en monde ouvert entièrement piloté par la posture du corps : la webcam capte les épaules et les bras via MediaPipe PoseLandmarker pour diriger un oiseau bas-poly à travers une ville procédurale infinie faite d’immeubles et d’arbres. Trois signaux, tous issus de la pose : l’inclinaison des épaules fait virer l’oiseau (un vrai virage banké, pas un strafe latéral), les bras écartés en T maintiennent un vol plané neutre, les bras baissés déclenchent un piqué avec bonus de vitesse, et un battement de bras réel (mouvement répété, pas une pose statique) fait grimper l’oiseau.
Le jeu est un pur speedrun : l’objectif est de ramasser 5 pommes le plus vite possible, le chronomètre se fige à la cinquième, et le meilleur temps est sauvegardé localement — avec un fantôme translucide de la meilleure course qui rejoue à vos côtés. Un système d’esquive automatique fait grimper l’oiseau au-dessus des immeubles avant l’impact, et même une collision ratée ne met plus fin à la partie : l’oiseau est simplement replacé au-dessus du toit.
Fonctionnalités
- Pilotage par pose corporelle — MediaPipe PoseLandmarker détecte l’inclinaison des épaules (virage banké) et l’état des bras (plané, piqué, ou battement réel pour grimper).
- Ville procédurale infinie — un monde ouvert diffusé en tuiles autour de l’oiseau, chaque zone régénérée de façon déterministe par sa position, à l’infini.
- Contrôles clavier et tactiles en secours — flèches directionnelles toujours disponibles en priorité sur la pose, joystick tactile analogique sur mobile/tablette.
- Esquive automatique prédictive — l’oiseau grimpe seul au-dessus d’un immeuble détecté sur sa trajectoire, avec un filet de sécurité qui rattrape même les cas ratés sans jamais arrêter la partie.
- Mode speedrun — 5 pommes à ramasser le plus vite possible, chronomètre figé à la victoire, record du meilleur temps conservé en local.
- Fantôme de replay — un double translucide de la meilleure course précédente vole aux côtés du joueur, rejoué localement sans serveur.
- Éclairage golden hour — ciel dégradé, lumière rasante et halo de soleil dynamique qui suit la trajectoire de vol.
Sous le capot
La détection de pose tourne dans un Web Worker dédié via MediaPipe PoseLandmarker : l’inclinaison des épaules est lissée par moyenne mobile exponentielle, et l’état des bras est classé soit par pose statique (plané, piqué), soit par détection de mouvement pour le battement qui déclenche la montée. Le délégué CPU est forcé pour cette détection — le délégué GPU peut silencieusement renvoyer des points de repère vides depuis un Worker sur certains navigateurs macOS.
La ville repose sur un monde à origine flottante : l’objet 3D de l’oiseau ne bouge en réalité jamais en X/Z, c’est le monde entier qui défile autour de lui, ce qui évite toute perte de précision flottante lors d’une session d’exploration sans limite. La ville est diffusée comme une grille de tuiles recyclées autour de l’oiseau, dont le contenu — immeubles, arbres, pommes — est entièrement déterminé par une graine dérivée de la position de la tuile : revisiter une zone régénère exactement le même paysage.
Le virage n’est pas un lacet instantané : l’inclinaison des épaules pilote d’abord un angle d’inclinaison cible (roulis), et la vitesse de virage est ensuite dérivée algébriquement de cet angle de banque réel de l’oiseau — un vrai virage coordonné, avec le temps de mise en roulis qui a un vrai coût ressenti, plutôt qu’un lacet immédiat calé sur l’inclinaison brute des épaules.
Contrôles
| Touche / geste | Action |
|---|---|
| ← / → | Vire à gauche / à droite (priorité clavier) |
| ↑ / ↓ | Monte / descend |
| Épaules inclinées (webcam) | Virage banké, progressif |
| Bras en T (webcam) | Vol plané neutre |
| Bras baissés (webcam) | Piqué + bonus de vitesse |
| Battement des bras (webcam) | Montée |
| Joystick tactile | Virage analogique (X) + monter/piquer/planer (Y) — mobile/tablette |
Stack technique
- Three.js — scène 3D, modèle d’oiseau animé, caméra suiveuse
- MediaPipe PoseLandmarker (Tasks Vision) — capture de la pose corporelle, dans un Web Worker
- getUserMedia — accès à la webcam
- Web Audio API — sons de jeu générés procéduralement, aucun fichier audio
- Canvas texture procédurale — routes et fenêtres d’immeubles, sans image vendue
- localStorage — meilleur temps et trajectoire du fantôme de replay
- Vanilla JS — zéro framework, dépendances chargées depuis des CDN, aucun build
Cas d’usage
Une démonstration portfolio de contrôle par pose corporelle, doublée d’un vrai mini-jeu speedrun jouable sans webcam grâce au clavier ou au joystick tactile — pensé pour fonctionner aussi bien sur ordinateur que sur mobile et tablette.
Pas de manette, pas de clavier obligatoire — juste vos épaules et le ciel qui défile.
