🐑 Trans' game

Présentation du Jeu & Feuille de Route / Game Presentation & Roadmap

1. Qu'est-ce qu'EcoTransh ? / 1. What is EcoTransh?
🇫🇷 Français

EcoTransh est un quiz éducatif interactif et multijoueur qui emmène les joueurs dans un voyage de transhumance — la tradition ancestrale de déplacer les troupeaux entre les plaines et les pâturages de montagne. Conçu pour les enfants et les adultes curieux, le jeu transforme l'apprentissage en aventure : chaque bonne réponse rapproche le troupeau de sa destination, tandis que les erreurs exposent le troupeau aux dangers du chemin.

"Guidez votre troupeau à travers les montagnes en répondant à des questions sur la transhumance. Apprenez, jouez, protégez votre troupeau !"

Technologies & Support

Caractéristique Détail
Plateforme Application web (navigateur) — mobile & desktop
Temps réel Socket.IO pour le jeu multijoueur synchronisé
Langues 🇫🇷 Français, 🇬🇧 Anglais, 🇷🇴 Roumain
Modes de jeu Solo / Auto-rythmé, Multijoueur par équipes (avec hôte)
Modèle actif Template v3 — Transhumance UNESCO
🇬🇧 English

EcoTransh is an interactive, multiplayer educational quiz that takes players on a transhumance journey — the ancient tradition of moving herds between lowland and mountain pastures. Designed for children and curious adults, the game turns learning into an adventure: each correct answer brings the herd closer to its destination, while mistakes expose them to dangers along the trail.

"Guide your herd through the mountains by answering questions about transhumance. Learn, play, protect your flock!"

Technology & Support

Feature Detail
Platform Web application (browser) — mobile & desktop
Real-time Socket.IO for synchronized multiplayer
Languages 🇫🇷 French, 🇬🇧 English, 🇷🇴 Romanian
Game modes Solo / Self-paced, Team multiplayer (with host)
Active template Template v3 — Transhumance UNESCO
2. Parcours Utilisateur / 2. User Journey
🇫🇷 Français

Étape 1 : Page d'accueil (Les 3 parcours)

L'utilisateur arrive sur la page d'accueil et choisit parmi 3 boutons :

  • 🎮 Rejoindre une partie (Joueur) → Accéder à une session existante
  • 🎯 Lancer une partie (Solo / Auto-rythmé) → Jouer seul, à son propre rythme
  • 🏫 Créer une session (Hôte) → Configurer pour un groupe/classe

Étape 2 : Rejoindre une session

  1. Clique sur "Rejoindre une partie"
  2. Liste des sessions actives affichée
  3. Saisie du mot de passe si nécessaire
  4. Sélection de l'équipe
  5. Redirection vers la salle d'attente

Étape 3 : Créer une session (Hôte)

  1. Configuration du nom, modèle, langue
  2. Configuration des équipes et nombre de joueurs
  3. Lancement de la session

Étape 4 : Salle d'attente

  • Animation de mouton en attendant
  • L'hôte démarre le quiz quand il est prêt

Étape 5 : Le jeu commence !

Le quiz se déroule en rounds suivant ce cycle : Introduction → Questions → Résultats.

┌───────────────────────────┐
│     INTRODUCTION ROUND    │
└──────────────┬────────────┘
               ▼
┌───────────────────────────┐
│         QUESTIONS         │
└──────────────┬────────────┘
               ▼
┌───────────────────────────┐
│         RÉSULTATS         │
└───────────────────────────┘
🇬🇧 English

Step 1: Landing Page (The 3 Journeys)

Users arrive at the landing page and choose between 3 main buttons:

  • 🎮 Join a game (Player) → Access an existing team session
  • 🎯 Launch a game (Solo / Self-paced) → Play alone, at your own pace
  • 🏫 Create a session (Host) → Set up a new team session for a group/class

Step 2: Joining a Session

  1. Click "Join Game"
  2. List of active sessions waiting for players
  3. Enter password if required
  4. Team selection
  5. Redirect to the game waiting room

Step 3: Creating a Session (Host)

  1. Configure: session name, template, language
  2. Team setup and max players per team
  3. Launch session

Step 4: Waiting Room

  • Sheep animation while waiting
  • Host starts the quiz when ready

Step 5: The Game Begins!

The quiz unfolds in rounds following this cycle: Introduction → Questions → Results.

┌───────────────────────────┐
│     ROUND INTRODUCTION    │
└──────────────┬────────────┘
               ▼
┌───────────────────────────┐
│         QUESTIONS         │
└──────────────┬────────────┘
               ▼
┌───────────────────────────┐
│          RESULTS          │
└───────────────────────────┘

3. L'Interface de Jeu / 3. The Game Interface
🇫🇷 Français

Zone supérieure : Le Voyage Animé

Un paysage défilant en SVG représente le trajet de transhumance : montagnes, arbres, buissons, rochers, fleurs. Un avatar berger avance le long du chemin. L'animation progresse au fil des rounds, représentant visuellement le voyage.

Zone de question

  • Titre du round affiché en haut (ex. : "UNESCO", "TRANSHUMANCE")
  • Texte de la question bien visible
  • Image associée à la question (photos de transhumance, paysages alpins, faune)
  • Numéro de question (ex. : "Question 3/6")

Zone de réponse

  • 4 boutons de réponse disposés en grille (préfixes A / B / C / D)
  • Sélection visuelle : le choix sélectionné est mis en valeur par une icône de berger
  • Un seul clic pour sélectionner, puis bouton "Soumettre" pour confirmer
  • Après soumission : ✅ vert = bonne réponse, ❌ rouge = mauvaise réponse

Chronomètre

  • ⏱ Compte à rebours par question (60 secondes par défaut)
  • 🔊 Son de tic-tac pendant les 20 dernières secondes
  • 🔴 Clignotement rouge pendant les 10 dernières secondes
  • Si le temps expire : la réponse est automatiquement considérée comme incorrecte

Classement (Leaderboard)

  • Panneau latéral affichant le score en temps réel de toutes les équipes
  • Scores triés du plus élevé au plus bas
🇬🇧 English

Upper Area: The Animated Journey

A scrolling SVG landscape represents the transhumance route: mountains, trees, bushes, rocks, flowers. A shepherd avatar walks along the path. The animation progresses with each round, visually representing the journey.

Question Area

  • Round title displayed at the top (e.g., "UNESCO", "TRANSHUMANCE")
  • Question text prominently visible
  • Associated image for the question (transhumance photos, alpine landscapes)
  • Question number (e.g., "Question 3/6")

Answer Area

  • 4 answer buttons arranged in a grid (prefixed A / B / C / D)
  • Visual selection: the selected choice is highlighted with a shepherd icon
  • One click to select, then "Submit" button to confirm
  • After submission: ✅ green = correct, ❌ red = incorrect

Timer

  • ⏱ Per-question countdown (60 seconds default)
  • 🔊 Ticking sound during the last 20 seconds
  • 🔴 Red flashing during the last 10 seconds
  • If time runs out: automatically counted as incorrect

Leaderboard

  • Side panel showing real-time scores for all teams
  • Scores sorted highest to lowest
4. Template v3 — Détail Complet / 4. Template v3 — Full Detail
🇫🇷 Français

Le Template v3 simule un voyage de transhumance à travers 6 rounds thématiques.

Élément Valeur
Nombre de rounds 6
Questions par round 6 à 7
Score de départ 200 brebis
Seuil de sécurité 80%

Détail des Rounds

Round 0 — Introduction

Animation de mouton et présentation du concept.

Round 1 — UNESCO 🏛️

Menace : Attaque de PRÉDATEUR (−3 points)

Récompense : 1 chien de berger

Round 2 — TRANSHUMANCE 🐑

Menace : Passage du MARAIS (−5 points)

Récompense : 1 âne

Round 3 — PRÉPARATION 🎒

Menace : Terrain difficile (−5 points)

Récompense : Eau fraîche et Sel

Round 4 — LA ROUTE 🗺️

Menace : PIÈGES (−1 point)

Récompense : Nourriture

Round 5 — BERGERIE ⛺

Menace : MAUVAIS TEMPS (−4 points)

Récompense : 1 contenant

Round 6 — PÂTURAGE 🌿

Menace : TEMPÊTES (−4 points)

Récompense : 1 conteneur

🇬🇧 English

The Template v3 simulates a transhumance journey across 6 themed rounds.

Element Value
Number of rounds 6
Questions per round 6-7
Starting score 200 sheep
Safety threshold 80%

Round Breakdown

Round 0 — Introduction

Sheep animation and concept presentation.

Round 1 — UNESCO 🏛️

Threat: PREDATOR attack (−3 points)

Reward: 1 shepherd dog

Round 2 — TRANSHUMANCE 🐑

Threat: SWAMP crossing (−5 points)

Reward: 1 donkey

Round 3 — PREPARATION 🎒

Threat: Difficult terrain (−5 points)

Reward: Fresh Water and Salt

Round 4 — THE ROUTE 🗺️

Threat: TRAPS (−1 point)

Reward: Food

Round 5 — SHEEPFOLD ⛺

Threat: BAD WEATHER (−4 points)

Reward: 1 container

Round 6 — GRAZING 🌿

Threat: STORMS (−4 points)

Reward: 1 container

🇫🇷 Français

Résumé du Système de Score

Score de départ : 200 brebis
    │
    ├── Points : +1 point par bonne réponse (1 seule bonne réponse par question)
    │
    ├── Round terminé avec 100% → 🎉 Récompense narrative (score bonus : +0 actuellement)
    │
    ├── Round terminé avec ≥ 80% → ✅ En sécurité ! Pas de pénalité
    │
    └── Round terminé avec < 80% → ⚠️ Menace appliquée :
         ├── Pénalité variable : −1 à −5 brebis selon le round
         └── Feedback visuel : image de la menace (prédateur, marais, orage...)

Écran Final

À la fin des 6 rounds :

  • 🏆 Classement final avec confettis d'animation
  • Équipe gagnante mise en valeur
  • Statistiques détaillées par joueur et par round
  • Possibilité de retourner à l'accueil
🇬🇧 English

Score System Summary

Starting Score: 200 sheep
    │
    ├── Points: +1 point per correct answer (only 1 correct answer per question)
    │
    ├── Round completed with 100% → 🎉 Narrative Reward (bonus score: +0 currently)
    │
    ├── Round completed with ≥ 80% → ✅ Safe! No penalty
    │
    └── Round completed with < 80% → ⚠️ Threat applied:
         ├── Variable penalty: −1 to −5 sheep depending on the round
         └── Visual feedback: threat image (predator, swamp, storm...)

Final Screen

At the end of the 6 rounds:

  • 🏆 Final Leaderboard with animation confetti
  • Winning team highlighted
  • Detailed statistics per player and per round
  • Possibility to return to Home

5. Recommandations & Améliorations / 5. Recommendations & Improvements
Ces suggestions visent à enrichir l'expérience sans dénaturer le concept existant. / These suggestions aim to enrich the experience without changing the core concept.
5.1 Format d'Image Carré / Square Image Format

Situation actuelle : Ratios variés créant des incohérences.

Recommandation : Standardiser toutes les images au format 1:1.

Toutes les nouvelles images devraient être en 800×800px.

Current state: Varied aspect ratios causing inconsistencies.

Recommendation: Standardize all images to 1:1 format.

All new images should be provided in 800×800px.
5.2 Récompenses Progressives / Progressive Rewards

Situation actuelle : Les récompenses sont purement narratives avec un impact de score de +0.

Recommandation : Introduire un système progressif par paliers.

Option A — Sélecteur de récompenses

  • Mode "Toutes les récompenses" : 100% = toutes les récompenses.
  • Mode "Choix parmi X" : Le joueur choisit X récompenses parmi Y proposées.

Option B — Récompenses par palier de score

Résultat Récompense
100% correct Toutes les récompenses + bonus spécial
≥ 80% correct 1 récompense standard (chien, âne, eau, etc.)
≥ 60% correct 1 récompense mineure (herbes, petite ration)
< 60% correct Aucune récompense + menace

Idées thématiques

Round Récompenses possibles
UNESCO 🐕 Chien, 📜 Certificat, 🗺️ Carte
Transhumance 🫏 Âne, 🔔 Cloche, 🧢 Chapeau
Préparation 💧 Eau, 🧂 Sel, 💊 Trousse

Current state: Rewards are purely narrative with a score impact of +0.

Recommendation: Introduce a tiered reward system.

Option A — Reward Selector

  • "All Rewards" Mode: 100% = all rewards.
  • "Choice of X" Mode: Player chooses X rewards among Y offered.

Option B — Rewards by Score Tier

Result Reward
100% correct All rewards + special bonus
≥ 80% correct 1 standard reward (dog, donkey, water, etc.)
≥ 60% correct 1 minor reward (herbs, small ration)
< 60% correct No reward + threat

Thematic Ideas

Round Possible Rewards
UNESCO 🐕 Dog, 📜 Certificate, 🗺️ Map
Transhumance 🫏 Donkey, 🔔 Bell, 🧢 Hat
Preparation 💧 Water, 🧂 Salt, 💊 Kit
5.3 Échange et Partage / Trading & Sharing

Concept : Les coéquipiers peuvent partager ou échanger des récompenses, renforçant l'esprit d'équipe.

  • Partage de ressources (eau, nourriture, chien) à la fin des rounds.
  • Transformation du score individuel en ressource collective de survie.
"En transhumance, l'entraide entre bergers est essentielle. Aucun berger ne survit seul dans les montagnes ; partager ses ressources, c'est assurer la survie de tout le convoi."

Concept: Teammates can share or trade rewards, reinforcing team spirit.

  • Share resources (water, food, dog) at the end of rounds.
  • Transform individual score into a collective survival resource.
"In transhumance, mutual aid between shepherds is essential. No shepherd survives alone in the mountains; sharing your resources ensures the survival of the entire convoy."
5.4 Ordre de Marche / Marching Order

Concept : La position dans la file influe sur le destin du groupe.

Position Rôle Secours
🏃 Éclaireur Balisage / Évite pièges Prioritaire (on l'attend)
🎒 Porteur Logistique : Transporte les provisions et médicaments. Exemple : Peut apporter rapidement nourriture et médicaments aussi bien à l'avant qu'à l'arrière. Soutenu (protégé)
🛡️ Arrière Protection / Traînards Isolé (personne ne revient)

Concept: Postion in the line influences the group's fate.

Position Role Rescue
🏃 Scout Pathfinding / Avoids traps Priority (others wait)
🎒 Carrier Logistics: Transports provisions. Example: Can quickly bring food/medicine to both front and rear. Supported (protected)
🛡️ Rearguard Protection / Stragglers Isolated (no one turns back)
5.5 Bonus de Rapidité / Speed Bonus

Concept : Points bonus basés sur la vitesse de réponse de l'équipe.

  • ⚡ < 15s : +3 bonus / Succès critique
  • 🏃 < 30s : +1 bonus / Succès standard
  • 🐢 > 45s : Pas de bonus / Efficacité réduite

Applications : Efficacité soins, protections, choix récompenses.

Concept: Bonus points based on team response speed.

  • ⚡ < 15s: +3 bonus / Critical Success
  • 🏃 < 30s: +1 bonus / Standard Success
  • 🐢 > 45s: No bonus / Reduced Efficiency

Applications: Healing efficiency, protection, reward choices.

5.6 Type d'Animal / Animal Type

Concept : Sélection de l'animal du troupeau.

  • 🐑 Mouton : Classique
  • 🐐 Chèvre : Agile, résistant aux toxines
  • 🫏 Âne : Porteur

Concept: Selection of the herd animal.

  • 🐑 Sheep: Classic
  • 🐐 Goat: Agile, toxin resistant
  • 🫏 Donkey: Carrier
5.7 Domaine & Hébergement / Domain & Hosting

Note : L'infrastructure actuelle est offerte probono pendant le développement.

Recommandation : Acquérir un domaine propre et un hébergement dédié pour sécuriser l'application et la base de données.

Note: Current infrastructure is provided pro bono during development.

Recommendation: Acquire a dedicated domain and hosting to secure the app and database.

5.8 Carte du Voyage / Journey Map

Concept : Remplacer ou compléter le monde défilant par une carte vue du dessus.

  • Vue d'ensemble du parcours complet.
  • Visualisation de la progression et anticipation.
Travail en cours (WIP) : Le nombre de stations doit encore être ajusté pour correspondre exactement au nombre de rounds (ou proposer des versions adaptées). D'autres corrections mineures sont prévues.

Cliquer pour voir l'état actuel (v3)

Concept : Replace or complement the scrolling world with a top-down map.

  • Overview of the entire route.
  • Visualization of progress and anticipation.
Work in Progress (WIP) : The number of stops needs to be reduced to match the number of rounds (or have multiple versions to fit different round counts accordingly). Other fixes are ongoing.

Click to view current stage (v3)

5.9 Idées Supplémentaires / Additional Ideas
  • 🌤️ Météo Dynamique : Aléas affectant les rounds.
  • 📖 Anecdotes & Faits : Encadrés éducatifs après chaque réponse.
  • 🎵 Ambiance Sonore : Cloches, vent, bêlements.
  • 🌤️ Dynamic Weather : Random events affecting rounds.
  • 📖 Fun Facts : Educational boxes after each answer.
  • 🎵 Ambient Sound : Bells, wind, bleating.
5.10 Base de Données Analytique / Analytics Database

Recommandation : Créer une base SQLite anonyme.

Données Utilité
Réponses Équilibrage pédagogique, temps reflexion
Appareils Optimisation UX / Mobile
Progression Engagement joueurs

Recommendation: Create an anonymous SQLite database.

Data Use
Answers Pedagogical balancing, thinking time
Devices UX optimization / Mobile
Progression Player engagement
5.11 Jeu en Équipe sans Hôte / Team Game Without Host

Concept : Permettre de lancer une partie en équipe sans hôte dédié.

  • L'initiateur crée la session.
  • Les autres rejoignent et se déclarent "Prêts".
  • Lancement automatique quand tout le monde est prêt.

Concept: Allow launching a team game without a dedicated host.

  • Initiator creates the session.
  • Others join and declare themselves "Ready".
  • Automatic launch when everyone is ready.
5.12 Gestion des Joueurs (Kick) / Player Management (Kick)

Note : Actuellement, l'hôte peut voir les joueurs mais pas les exclure.

Recommandation : Ajouter un bouton "Kick" pour gérer les intrus ou erreurs.

Note: Currently, the host can see players but cannot exclude them.

Recommendation: Add a "Kick" button to manage intruders or errors.