pierre/Ustagammon
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

Identité : pions blancs et noirs avec contour (ADR 0010 amendé) #55

Merged
pierre merged 1 commits from pions-noir-blanc into main 2026-11-11 21:14:57 +00:00
Conversation 0 Commits 1 Files Changed 5
+54 -36
pierre commented 2026-11-11 21:14:55 +00:00
Owner
Copy Link
Copy Source

Pourquoi

Les premiers joueurs ont trouvé que les pions sombres se voyaient mal sur la barre et ont dit préférer le blanc et le noir à l'ivoire et à l'ébène. La session design a mis les deux palettes côte à côte sur le canevas (rangée « Retours des premiers joueurs »), chacune avec un contour clair autour des pions sombres. Pierre a tranché le 2026-11-11 : « C'est vrai que le noir et blanc est pas mal. Surtout le fait d'avoir l'outline est une bonne chose. »

Quoi

  • ADR 0010 : amendement daté (pions blancs et noirs avec contour ; le logo garde ses pions ivoire et noyer).
  • tokens.json :
    • pions du joueur blancs, avec un contour gris foncé ;
    • pions de l'ordinateur noirs, avec un contour gris clair dans les deux thèmes ;
    • dés, points des dés, chiffres sur les piles et videau assortis.
  • Guide de marque : la phrase sur les pions du plateau est mise à jour.
  • Tutoriel (charte) : étape 1 « quinze pions blancs, l'ordinateur quinze pions noirs ».
  • Recette : la règle de lisibilité des pions de l'ordinateur cite le contour gris clair.

Comment

Les contrastes sont calculés (formule WCAG 2) :

  • contour noir sur la barre : 6,8:1 en thème clair et 8,5:1 en sombre (environ 1:1 avant) ;
  • contour blanc sur le fond clair : 3,8:1 ;
  • chiffre sur pion blanc : 16,3:1 ;
  • sélection brique sur pion blanc : 5,7:1.

Le seul couple sous 3:1, le contour blanc sur une flèche en chêne (2,4:1), reste lisible : le pion se détache alors par son fond clair et par le reste de son contour.

Choix et compromis

  • Le logo ne change pas : ses pions ivoire et noyer sont la matière de la marque, distincte des pièces du jeu.
  • Les gris sont neutres, sans teinte chaude, pour un blanc et un noir francs.

Risques et déploiement

Aucun : il n'y a que de la documentation et des valeurs de la charte. Pour revenir en arrière, il suffit d'annuler le commit de fusion.

Comment vérifier

make lint
make test
python3 -c "import json; [print(t['name'], t['value']) for t in json.load(open('docs/identite/charte/tokens.json'))['color']['tokens'] if t['name'].startswith('checker')]"

Hors périmètre

L'application des nouvelles couleurs dans web/app.css et dans docs/tutoriel/regles.md (« pions ivoire », « noyer »). La session de développement s'en charge, avec les retours des joueurs (MR !54).

Generated with Claude Code (https://claude.com/claude-code)

## Pourquoi Les premiers joueurs ont trouvé que les pions sombres se voyaient mal sur la barre et ont dit préférer le blanc et le noir à l'ivoire et à l'ébène. La session design a mis les deux palettes côte à côte sur le canevas (rangée « Retours des premiers joueurs »), chacune avec un contour clair autour des pions sombres. Pierre a tranché le 2026-11-11 : « C'est vrai que le noir et blanc est pas mal. Surtout le fait d'avoir l'outline est une bonne chose. » ## Quoi - **ADR 0010** : amendement daté (pions blancs et noirs avec contour ; le logo garde ses pions ivoire et noyer). - **tokens.json** : - pions du joueur blancs, avec un contour gris foncé ; - pions de l'ordinateur noirs, avec un contour gris clair dans les deux thèmes ; - dés, points des dés, chiffres sur les piles et videau assortis. - **Guide de marque** : la phrase sur les pions du plateau est mise à jour. - **Tutoriel** (charte) : étape 1 « quinze pions blancs, l'ordinateur quinze pions noirs ». - **Recette** : la règle de lisibilité des pions de l'ordinateur cite le contour gris clair. ## Comment Les contrastes sont calculés (formule WCAG 2) : - contour noir sur la barre : 6,8:1 en thème clair et 8,5:1 en sombre (environ 1:1 avant) ; - contour blanc sur le fond clair : 3,8:1 ; - chiffre sur pion blanc : 16,3:1 ; - sélection brique sur pion blanc : 5,7:1. Le seul couple sous 3:1, le contour blanc sur une flèche en chêne (2,4:1), reste lisible : le pion se détache alors par son fond clair et par le reste de son contour. ## Choix et compromis - Le logo ne change pas : ses pions ivoire et noyer sont la matière de la marque, distincte des pièces du jeu. - Les gris sont neutres, sans teinte chaude, pour un blanc et un noir francs. ## Risques et déploiement Aucun : il n'y a que de la documentation et des valeurs de la charte. Pour revenir en arrière, il suffit d'annuler le commit de fusion. ## Comment vérifier make lint make test python3 -c "import json; [print(t['name'], t['value']) for t in json.load(open('docs/identite/charte/tokens.json'))['color']['tokens'] if t['name'].startswith('checker')]" ## Hors périmètre L'application des nouvelles couleurs dans web/app.css et dans docs/tutoriel/regles.md (« pions ivoire », « noyer »). La session de développement s'en charge, avec les retours des joueurs (MR !54). Generated with Claude Code (https://claude.com/claude-code)
pierre added 1 commit 2026-11-11 21:14:56 +00:00
Identité : pions blancs et noirs avec contour (ADR 0010 amendé, choix de Pierre) 145c19ac77 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
pierre merged commit 65ee563794 into main 2026-11-11 21:14:57 +00:00
Sign in to join this conversation.
Reviewers
No Reviewers
Labels
No items
No labels
Milestone
No items
No Milestone
Projects
Clear projects
No projects
Assignees
Clear assignees
pierre (Pierre Martin)
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: pierre/Ustagammon#55