JWE/projet_geoguessr_97x.md

Voici le prompt mis à jour. Les hésitations sur les librairies et les panoramas sont supprimées, et la dimension éducative/Wikipedia est intégrée comme un mécanisme de jeu à part entière (et non plus comme un simple fallback).

---

```
# Mission : JWE — Jeu de géolocalisation souverain type GeoGuessr
## Refonte complète · Svelte + Strapi/SvelteKit · MapLibre · Photos uniques · Éducation Wikipedia

---

## 1. Contexte et ambition

### 1.1 Projet source
- **URL actuelle** : https://labola.o-k-i.net/ORGANISATION-KA-INTERNATIONALE/JWE
- **Objet** : refonte complète pour en faire un jeu de géolocalisation dans l'esprit de GeoGuessr, centré sur 4 régions : **Guadeloupe, Martinique, Guyane, La Réunion**.

### 1.2 Mécanique de jeu verrouillée
- **Pas de Street View, pas de panoramas, pas de 3D.**
- Le joueur voit une **photo unique** d'un lieu (monument, paysage, rue, lieu culturel).
- Il doit placer un marqueur sur une carte pour deviner **la commune** (et par déduction la région).
- Le score est calculé selon la distance entre le marqueur et les coordonnées réelles.
- Après le score : phase éducative basée sur **Wikipedia/Wikidata** (voir §1.3).

### 1.3 Le pivot éducatif : Wikipedia/Wikidata comme cœur du jeu
JWE n'est pas qu'un jeu de score, c'est un outil de **souveraineté documentaire**.
- Si le lieu photographié possède une page Wikipedia : afficher un extrait de l'article, ses coordonnées Wikidata, et un lien "Lire plus sur Wikipédia".
- **Si le lieu n'a PAS de page Wikipedia ou de données Wikidata** : c'est intentionnel et pédagogique. Le jeu doit afficher un écran spécifique expliquant :
  1. Pourquoi ce lieu n'est pas sur Wikipedia (lacune documentaire).
  2. Pourquoi il est vital que les populations locales documentent leurs propres territoires (représentation numérique, décolonisation du savoir, importance pour les modèles d'IA qui s'entraînent sur ces données, tourisme, transmission).
  3. Un appel à l'action : "Contribuer sur Wikipédia" avec un lien vers l'éditeur Wikipédia pré-rempli (ou des liens vers des tutos OKI/Wikimédiens locaux).
- **L'Agent Contenu doit intentionnellement inclure des lieux sans page Wikipedia** pour tester et démontrer cette fonctionnalité.

### 1.4 Cible OKI
- **Souverain** : zéro Google, zéro Mapbox. Carte MapLibre + tiles libres.
- **Éthique** : pas de loot boxes, pas de leaderboard forcé, pas d'anxiété.
- **Performant** : jouable sur téléphone en 4G caribéen.
- **Bilingue** : français / créole pour l'interface.

---

## 2. Stack technique (Verrouillée)

### 2.1 Front-end : Svelte 5 + SvelteKit 2
- Obligatoire. Compilateur léger, CSS scopé natif, SSR, MIT, PWA.

### 2.2 Cartographie : MapLibre GL JS (Verrouillé)
- **Obligatoire.** Pas d'évaluation de Cesium, iTowns ou Three.js à faire.
- MapLibre pour la carte de devinette (placement du marqueur) et la carte récapitulative.
- Style cartographique custom OKI (couleurs, fonts, labels) basé sur des tiles OpenStreetMap auto-hébergées ou libres.
- Zoom contraint aux 4 régions (le joueur ne peut pas scroller la carte en Europe ou aux US, ce qui donnerait un indice).

### 2.3 Back-end : Strapi ou SvelteKit seul (L'Architecte décide)
- **Critère** : qui ajoute les lieux ? Si contributeurs non-devs → Strapi. Si devs uniquement → SvelteKit avec fichiers JSON locaux.
- **Contrainte Wikipedia** : Ne **pas** stocker le texte Wikipedia en base. Le back-end (Strapi ou SvelteKit) doit interroger l'API Wikipedia/Wikidata en temps réel (ou avec un cache court) lors de l'affichage du résultat, à partir de l'ID Wikidata lié au lieu.

### 2.4 Base de données
- SQLite (frugalité OKI).

---

## 3. Design du jeu

### 3.1 Types de parties (Modes)

#### Mode 1 : « Konnèt moniman » (Reconnaître le monument)
- Photo d'un monument. Deviner la commune.
- Pas de limite de temps par défaut. Option timer activable.
- Indices progressifs optionnels (Région → Département → "C'est un fort colonial") avec pénalité de score.

#### Mode 2 : « Kote mwen ye ? » (Où suis-je ?)
- Photo d'un lieu ordinaire (rue, carrefour, bord de mer, forêt guyanaise).
- Deviner la commune. Timer optionnel.

#### Mode 3 : « Défi 5 rounds »
- 5 tours consécutifs mélangeant monuments et lieux.
- Résumé final avec la carte montrant les 5 marqueurs vs positions réelles.

#### Mode 4 : « Aprann » (Explorer)
- Pas de score. Parcourir la carte, cliquer sur les marqueurs, voir les photos et lire les fiches Wikipedia / les appels à contribution.

### 3.2 Système de score

#### Formule (adaptée à la taille des communes)
Les communes DOM sont petites. Un écart de 2 km peut signifier "à côté" ou "dans la commune d'à côté".
```
score = MAX_POINTS × e^(-distance / radius)
```
- `MAX_POINTS` = 5000.
- `radius` par difficulté :
  - Facile : 50 km (tu peux te tromper de commune voisine)
  - Moyen : 15 km (tu dois être dans la bonne commune)
  - Difficile : 5 km (tu dois être dans le bon quartier)
  - Expert : 1 km (précision rue)

#### Bonus / Pénalités
- Bonus temps (si activé) : max 20%.
- Pénalité indice : -10% par indice utilisé.

### 3.3 Schéma de données d'un lieu

```json
{
  "id": "uuid",
  "nom": "Fort Delgrès",
  "nom_creole": "Fò Delgrès",
  "region": "GUADELOUPE",
  "commune": "Basse-Terre",
  "coordonnees": { "lat": 16.0036, "lon": -61.7319 },
  "categorie": "MONUMENT",
  "difficulte": "MOYEN",
  "wikidata_id": "Q2216838",
  "photo": {
    "url": "/assets/fort-delgres.webp",
    "credit": "© Collectif OKI / Wikimedia Commons CC-BY-SA",
    "alt": "Vue de face du Fort Delgrès en pierre grise surplombant la mer"
  },
  "indices": [
    { "niveau": 1, "texte": "Situé dans une capitale régionale" },
    { "niveau": 2, "texte": "C'est un fort historique face à la mer" }
  ]
}
```
*Note : Le texte éducatif vient de l'API Wikipedia via `wikidata_id`. Si `wikidata_id` est null, le front déclenche le mode "Lacune documentaire".*

---

## 4. Répartition des tâches par agent

### Agent Architecte (exécute en premier)
**Sorties attendues** :
1. **Décision Strapi vs SvelteKit seul** (argumentée).
2. **Architecture des tiles** : Source des tiles MapLibre (style OKI, auto-hébergé via tileserver-gl).
3. **Stratégie Wikipedia/Wikidata** : Comment le front/back récupère l'extrait Wikipedia en français à partir du `wikidata_id`. Endpoints API MWAPI à utiliser, stratégie de cache.
4. **Arborescence du projet** complète.
5. **Spécifications API REST** (sécurité anti-triche : ne jamais envoyer les coordonnées au client avant la soumission du marqueur).

### Agent Back-end (si Strapi retenu)
**Tâches** :
1. Strapi sur SQLite, zéro telemetry.
2. Content Type `Lieu` (schéma ci-dessus).
3. Endpoints custom sécurisés (random sans coordonnées, soumission guess).
4. Mise en place d'un proxy/cache léger pour les requêtes Wikipedia (pour ne pas se faire bloquer par l'API Wikimédia et accélérer l'affichage).

### Agent Front-end (SvelteKit) — Le cœur du projet
**Tâches** :

#### 4.1 Carte MapLibre
- Intégration de MapLibre GL JS.
- Style custom OKI (couleurs, typographie).
- Zoom contraint aux 4 régions (bounds géographiques stricts).
- Marqueur draggable pour la devinette.
- Boutons zoom +/- visibles (pas de geste obligatoire).
- Performance : lazy load de MapLibre (ne charger le JS que sur les écrans de jeu).

#### 4.2 L'Écran de jeu (Layout split)
- **Mobile** : Photo en haut (60%), Carte en bas (40%), Bouton "Valider" fixe en zone du pouce (tiers inférieur).
- **Desktop** : Photo à gauche (50%), Carte à droite (50%).
- Timer discret si activé (cercle qui se vide, couleurs douces).
- Bouton "Valider ma position" (action primaire unique, effet Von Restorff).
- Bouton "Passer" (secondaire).
- Bouton "Indice" (tertiaire, affiche le texte et la pénalité).

#### 4.3 L'Écran de résultat (CRUCIAL : Phase éducative)
Après validation, le marqueur vole vers la position réelle (sauf si `prefers-reduced-motion`).

**Cas A : Le lieu a un `wikidata_id` (Données existantes)**
- Afficher le score et la distance.
- Afficher un panneau éducatif contenant :
  - Titre du lieu (lien vers la page Wikipedia).
  - Extrait de l'article Wikipedia (récupéré via API).
  - Commune et Région.
- Ton : "Tu as trouvé ! Apprends-en plus sur ce lieu."

**Cas B : Le lieu n'a PAS de `wikidata_id` (Lacune documentaire)**
- Afficher le score et la distance.
- Afficher un panneau **distinct visuellement** (couleur différente, iconographie spécifique) avec un message pédagogique fort :
  - *Titre* : "Pwen blindé — Sa pa dokimanté" (Point aveugle — Ce n'est pas documenté).
  - *Texte (FR)* : "Ce lieu existe, mais il n'a pas de page sur Wikipédia ni de fiche sur Wikidata. Pour nos régions, c'est un enjeu majeur : si nous ne documentons pas nos propres territoires, notre histoire et notre géographie disparaissent des cartes numériques et des bases de données mondiales (qui alimentent même l'intelligence artificielle)."
  - *Texte (CRÉOLE)* : (Équivalent en créole, à intégrer via le système i18n).
  - *Call to action* : Bouton "Kontribyé sou Wikipédia" (lien vers l'éditeur Wikipédia avec le titre du lieu pré-rempli dans la barre de recherche, ou lien vers un guide OKI "Comment contribuer à Wikipédia").
- **Soigner particulièrement cet écran (Peak-End rule de la doctrine OKI)** : c'est ici que le jeu devient un outil politique et éducatif, pas juste un divertissement.

#### 4.4 Écrans annexes
- **Accueil** : Titre "JWE", 4 cartes régions, choix du mode, bouton "Jouer" en zone pouce.
- **Résultat final** : Carte récapitulative, score total, bouton "Partager" (génère une image canvas à télécharger, pas de share API propriétaire).
- **Explorer** : Carte pleine page avec marqueurs, filtres par région, panneau latéral/bottom sheet avec la fiche Wikipedia ou le message de lacune.

#### 4.5 Technique
- PWA installable.
- Photos en WebP/AVIF, `srcset`, lazy loading.
- Navigation clavier sur la carte.
- i18n (FR / Créole) pour toute l'UI.

### Agent Contenu (exécute en parallèle)
**Tâches** :
1. Produire un **JSON de test de 40 lieux** (10/region).
2. **PIÈGE INTENTIONNEL** : Pour chaque région, inclure **2 à 3 lieux réels qui n'ont PAS de page Wikipedia française** (ex: une petite ravine en Guyane, un morne spécifique en Martinique, un calvaire ou une boutique historique en Guadeloupe, un site naturel à La Réunion). Laisser leur `wikidata_id` à `null` dans le JSON.
3. Pour les 7-8 autres lieux par région : fournir le vrai `wikidata_id` (ex: Q2216838 pour Fort Delgrès).
4. Fournir les URLs de photos Wikimedia Commons réelles (vérifier la licence CC).

### Agent Intégration & QA
**Tâches** :
1. Vérifier l'intégration MapLibre + API Lieux + API Wikipedia.
2. **Tester spécifiquement le Cas B (Lacune documentaire)** : vérifier que le message s'affiche correctement, que le ton est bon, que le lien de contribution fonctionne.
3. Jouer une partie complète.
4. **Checklist d'audit OKI** :
   - [ ] Une seule action primaire par écran
   - [ ] Mobile : bouton Valider en zone du pouce, carte utilisable au doigt
   - [ ] Performance : premier écran < 3s, MapLibre lazy-loadé
   - [ ] Éthique : pas de mécanique dopaminergique, score non punitif
   - [ ] Éducation : les deux cas (Wiki OK / Wiki Manquant) fonctionnent et sont distincts visuellement
   - [ ] Bilinguisme FR/créole présent (y compris dans le message de lacune)
   - [ ] PWA installable
5. Mesures Core Web Vuts mobile 4G.

---

## 5. Doctrine UI/UX OKI (Extraits applicables)

- **Système 1** : L'écran de jeu est immédiatement lisible (Photo | Carte | Valider).
- **Von Restorff** : Le bouton "Valider" est le seul élément fortement coloré.
- **Peak-End** : L'écran de résultat (avec la fiche Wiki ou l'appel à contribution) doit laisser une impression forte et positive. C'est la fin du round, c'est ce dont le joueur se souviendra.
- **Calm technology** : Le timer est informatif, pas anxiogène.
- **Territoire** : Le créole est utilisé dans les micro-interactions ("Bravo !", "Kité sa ye ?", "Pwen blindé"). Les visuels de la carte ne sont pas le default bleu Google, mais un style OKI ancré dans le territoire.

---

## 6. Contraintes transversales

- **Licence** : MIT pour le code. Crédits obligatoires pour les photos Wikimedia.
- **Zéro dépendance propriétaire** : MapLibre (BSD), Svelte (MIT). Aucune clé API payante.
- **Sécurité** : Les coordonnées réelles ne sont jamais dans le payload initial envoyé au client.
- **Git** : Commits atomiques.

---

## 7. Ordre d'exécution

1. **Agent Architecte** → Stack, Schema, Stratégie Wiki/MapLibre.
2. **Agent Contenu** → JSON des 40 lieux (avec le piège Wiki manquant).
3. **Agent Back-end** (si Strapi).
4. **Agent Front-end** → SvelteKit, MapLibre, Mécanique de score, Écrans éducatifs (Cas A & B).
5. **Agent QA** → Audit, test du message de lacune documentaire, rapport.

---

## 8. Livrables finaux

1. Dépôt Git complet.
2. JSON de 40 lieux (avec la structure `wikidata_id: null` pour tester la lacune).
3. Rapport d'audit OKI.
4. Guide de déploiement auto-hébergé (SvelteKit + Tile Server).
5. Guide de contribution ("Comment ajouter un lieu et lier sa page Wikidata").
```