---
issueRef: "#162"
version: 6
updatedBy: {"kind":"agent","agent_id":"57695b92-24d0-4876-837c-76116e70a6ae"}
updatedAt: 1785248859225
---

## #162 — Cadrage UX compaction étape chrono+reps / chrono+score libre (UX, 2026-07-28)

Statut : **cadrage exploitable, avis rendu sur la proposition utilisateur**. Écran concerné : exécution de séance téléphone (module `Séquence` d'étape, [[gametime-ux-exercise-steps]]). La montre n'est pas concernée (cas déjà traité en compact pour l'équivalent montre par #140).

Avis sur la proposition initiale : **globalement bonne direction** (regrouper reps+chrono sur une ligne, alléger les CTA), avec deux ajustements : réduire aussi les titres empilés en légendes courtes sur la même ligne que leur valeur (pas seulement fusionner reps+chrono), et séparer les CTA de contrôle du chrono (Lancer/Réinitialiser, fréquents, faible enjeu) des CTA de navigation d'étape (Passer l'étape / Étape suivante, plus haut niveau) pour éviter une seule rangée de 4 boutons qui redevient dense.

### 1. Hiérarchie d'information
1. Nom de l'étape (inchangé, une ligne, ellipse si trop long).
2. Les deux données de l'étape **sur une seule ligne à deux colonnes** : répétitions à gauche, chrono score à droite (ou l'inverse si le chrono est la donnée qui progresse activement — garder la donnée "vivante" côté où l'œil revient, à trancher avec DevFrontend selon l'existant visuel).
3. Contrôles du chrono (Lancer/Réinitialiser), rattachés visuellement à la valeur du chrono, pas à une rangée globale.
4. CTA de navigation d'étape, en bas, groupés.

### 2. Disposition concrète

**Cas A — étape Répétitions + chrono score d'étape :**
```text
Dribble main droite

RÉPÉTITIONS          CHRONO SCORE
   10                  00:12
                      [▶] [↺]

[ Passer l'étape ]   [ Étape suivante ]
```
- Légendes (`RÉPÉTITIONS`, `CHRONO SCORE`) fusionnées en petite légende juste au-dessus de leur valeur, plus de titre pleine largeur séparé.
- `[▶] [↺]` : icônes seules (pas de texte), ~32dp, rattachées sous la valeur du chrono — réutiliser le même jeu d'icônes que le bouton toggle réduit déjà spécifié pour la montre (#140), pas un nouveau vocabulaire visuel.
- CTA du bas **côte à côte** (`Passer l'étape` en contour/secondaire, `Étape suivante` en plein/primaire) plutôt qu'empilés plein largeur — exception assumée par rapport aux boutons de série (`Terminer la série`/`Passer la série`, eux restent empilés) car le problème à résoudre ici est spécifiquement la hauteur cumulée, pas la clarté de hiérarchie.

**Cas B — étape Temps (décompte) + score libre :**
```text
Pompes tempo

    00:07          Score (paniers)
                     [-]  5  [+]

     [ Passer l'étape ]
```
- Le chrono reste la donnée dominante (plus grande) car il progresse seul et pilote l'avancement automatique (cf. [[gametime-ux-exercise-steps]] : passage auto à 0).
- Le score libre passe d'un champ texte + clavier système à un **stepper +/-** compact (même pattern que le score montre #118), sur la même ligne que le chrono plutôt qu'en dessous.
- Un seul CTA en bas (`Passer l'étape`) : pas d'`Étape suivante` ici, l'avancement est automatique à la fin du décompte.

### 3. À compacter / supprimer / déplacer
- Supprimer les titres pleine largeur (`RÉPÉTITIONS`, `Chrono score d'étape`) en tant que blocs séparés → deviennent des légendes courtes au-dessus de leur valeur, sur la même ligne que l'autre donnée.
- Déplacer `Étape suivante` : il quitte sa position isolée entre le bloc reps et le bloc chrono, rejoint la rangée de CTA du bas.
- Compacter `Lancer`/`Réinitialiser` en icônes seules, rattachées au chrono plutôt qu'en rangée de boutons texte pleine largeur.
- Remplacer le champ texte + clavier du score libre par un stepper +/-, ce qui supprime aussi le risque de clavier system qui recouvre l'écran (cf. point 4).

### 4. Garde-fous lisibilité mobile
- Le stepper +/- évite l'ouverture du clavier système, qui sur petit écran peut masquer le chrono pile au moment où l'utilisateur en a besoin (risque identifié sur le cas B).
- Ne pas descendre le chiffre Anton du chrono/reps sous la taille de lisibilité déjà actée ailleurs dans l'app pour l'effort physique (lecture rapide, doigts/yeux sollicités) — si la place manque, réduire les marges/paddings avant de réduire la taille des chiffres.
- Cibles tactiles des icônes `[▶] [↺]` : conserver un minimum tactile confortable malgré la réduction visuelle (même logique que la réduction 48dp→32dp déjà validée pour le cas montre #140, qui reste un plancher acceptable, pas un objectif à réduire davantage).
- Rangée à deux colonnes : tester sur la largeur d'écran la plus étroite supportée avant de valider — si les deux légendes + valeurs entrent en collision, réduire d'abord l'espacement interne, pas passer les deux CTA de navigation à trois colonnes.

### 5. Libellés / navigation
Aucun nouveau libellé, aucun changement de navigation. Les libellés existants (`RÉPÉTITIONS`, `Chrono score d'étape` → légende courte, `Passer l'étape`, `Étape suivante`, `Score de l'étape (unité)`) sont conservés tels quels, seule leur mise en page change. Pas d'impact sur le module séquence en configuration (formulaire exercice), uniquement sur l'écran d'exécution.
