diff --git a/docs/adr/0012-mode-immersif.md b/docs/adr/0012-mode-immersif.md new file mode 100644 index 0000000..706cdb4 --- /dev/null +++ b/docs/adr/0012-mode-immersif.md @@ -0,0 +1,55 @@ +# 0012. Mode immersif : le plateau en paysage, sur demande + +- **Statut** : accepté +- **Date** : 2026-11-03 +- **Décideurs** : Pierre + +## Contexte + +Sur l'écran de jeu en portrait, le plateau n'occupe qu'environ 35 % de l'écran +d'un téléphone (pions de 24 px sur un écran de 390 px de large). Pierre le +trouve peu immersif et a demandé un mode où le plateau prend le maximum de +l'écran. + +Deux pistes ont été maquettées +(https://claude.ai/artifact/CQw6vbDpi6XQqVWQa4sANe, rangée « Mode immersif ») : +le téléphone en paysage, plateau sur toute la hauteur ; ou le portrait avec le +plateau tourné d'un quart de tour. Toutes deux donnent environ 57 % de l'écran +au plateau et des pions de 30 px : le petit côté de l'écran limite la taille +des pions dans les deux cas. + +## Décision + +- Un **mode immersif en paysage** : le plateau occupe toute la hauteur, dans + son orientation habituelle. À gauche : le menu, les comptes de points et la + consigne. À droite : l'aide et les actions. Le fond est en noyer jusqu'aux + bords de l'écran. +- On y entre **par un geste explicite** : un bouton « Plein écran » sur l'écran + de jeu en portrait. On en sort par le menu ou par le retour du téléphone. +- Le bouton force la vue paysage même si le téléphone est tenu droit ou si sa + rotation automatique est verrouillée : passage en plein écran + (`requestFullscreen`), puis verrouillage de l'orientation + (`screen.orientation.lock("landscape")`). +- Si le verrouillage est refusé (navigateur ou système qui ne le permet pas, + iPhone), l'app affiche la vue paysage tournée d'un quart de tour dans l'écran + portrait. Le résultat est le même en main. +- L'écran de jeu en portrait reste la vue par défaut, pour jouer d'une main. + +## Alternatives écartées + +- **Plateau tourné en portrait** : il change la lecture du plateau (numéros de + côté, camps à gauche et à droite) et risque de dérouter les débutants habitués + à une vraie table. +- **Bascule automatique quand on tourne le téléphone** : elle ne marche pas si + la rotation est verrouillée, et elle surprend en cours de partie. Elle reste + possible en plus du bouton, plus tard. + +## Conséquences + +- Le rendu du plateau doit s'adapter à deux mises en page (portrait et paysage) + sans changer le domaine ni le moteur : seule la vue change (ADR 0007). +- `screen.orientation.lock` n'est accepté qu'en plein écran, et pas partout : + la solution de repli par rotation CSS est obligatoire, et elle doit être + testée (`make test-browser`). +- Le plein écran masque la barre d'état du téléphone, ce qui libère encore un + peu de place. diff --git a/docs/adr/README.md b/docs/adr/README.md index 6e2df01..ef00008 100644 --- a/docs/adr/README.md +++ b/docs/adr/README.md @@ -18,3 +18,4 @@ l'ancien passe au statut « remplacé par NNNN ». Voir l'ADR 0001. | [0009](0009-socle-pwa-typescript.md) | Socle : PWA en TypeScript, moteur en WebAssembly | accepté | | [0010](0010-identite-visuelle.md) | Identité visuelle : symbole, logotype, palette | accepté | | [0011](0011-lecons-conseil-et-bilan.md) | Leçons numérotées, conseil du maître après le coup, bilan de fin de partie | accepté | +| [0012](0012-mode-immersif.md) | Mode immersif : le plateau en paysage, sur demande | accepté | diff --git a/docs/feuille-de-route.md b/docs/feuille-de-route.md index 9b6a74f..8632671 100644 --- a/docs/feuille-de-route.md +++ b/docs/feuille-de-route.md @@ -29,7 +29,7 @@ par coup de l'IA en niveau standard, tous les tests au vert. | Étape | Contenu | État | | --- | --- | --- | -| 1. V1 Jouer et comprendre | Charte graphique appliquée à la PWA (ADR 0010, `docs/identite/charte/`), plateau soigné, niveaux, conseil du maître après le coup, bilan de fin de partie, premières leçons numérotées (ADR 0011), analyse, branches, tutoriel, prompts, sauvegarde | ⏳ | +| 1. V1 Jouer et comprendre | Charte graphique appliquée à la PWA (ADR 0010, `docs/identite/charte/`), plateau soigné, niveaux, conseil du maître après le coup, bilan de fin de partie, premières leçons numérotées (ADR 0011), mode immersif en paysage (ADR 0012), analyse, branches, tutoriel, prompts, sauvegarde | ⏳ | | 2. V1.5 Apprendre | Parcours 2, exercices, progression | ⏳ | | 3. V2 Perfectionnement et IA | Parcours 3 et 4, rollouts, révision espacée | ⏳ |