Skip to content

Ecrans

Jump to bottom
IlanAMG edited this page Oct 14, 2026 · 70 revisions

Écrans

Statut : 🟡 Brouillon · Màj : 2026-10-14 · Tickets : #383 (brouillon, à valider)

Cette page est le miroir textuel des maquettes réalisées dans Claude Design. Chaque écran porte un identifiant stable (E-xx pour le mobile, A-xx pour l'admin web) utilisé dans les parcours utilisateurs, les tickets et les noms de routes. Quand une maquette change, cette page change, puis une entrée est ajoutée au Design-Changelog.

Référence visuelle validée : accueil E-01 (2026-09-22), résultats E-04 (2026-09-23), recherche E-02 et filtres E-03 (2026-09-23), fiche parcours E-05 (2026-09-23) (vue carte, sheet remontée, tap sur un parcours, composants, recherche, filtres, composants recherche et filtres, fiche parcours, composants fiche, canevas Claude Design Découverte, Sortie, Compte, Éditeur et Sandbox). La maquette de 2025 (design-proto.png) n'est plus une référence.

Navigation

Trois onglets : Accueil, Parcours, Profil. Bouton flottant Créer sur l'accueil. Les fiches et l'éditeur s'ouvrent en modales plein écran au-dessus des onglets (expo-router : groupe (tabs) et routes modales). Transitions : treize modèles, M-01 à M-13, dans Direction-Artistique › Mouvement (D-030, D-042) ; chaque écran les cite dans sa ligne Transitions ; au changement d'onglet, seule la barre bouge (M-13), le contenu change sans animation.

Mobile

E-18 — Premier lancement

🟢 Validé en entier le 2026-09-28 (ticket #185, planches 1 à 3 : écran de lancement, icône de l'app, position, mesure d'audience, rappels, D-060 ; états, texte agrandi et contrôle accessibilité, D-061) · écran de lancement · position · mesure d'audience · recevoir un rappel · autorisation des notifications · icône de l'app · rappels désactivés (E-08) · réglages, mesure d'audience (E-09) · lancement lent · hors connexion · position approximative · politique hors connexion, retirée en D-063 · mesure d'audience coupée (E-09) · notifications coupées (E-09) · texte agrandi, mesure d'audience · texte agrandi, recevoir un rappel · texte agrandi, hors connexion · texte agrandi, rappels désactivés (E-08) · texte agrandi, réglages (E-09) · contrôle accessibilité · Claude Design

  • Rôle : ce qui se passe entre le toucher de l'icône et l'accueil utilisable, puis la première demande de rappels. Rien n'est demandé avant d'être utile, jamais deux fenêtres l'une sur l'autre.
  • Icône de l'app (D-060) : le logo source (logo-widoo.svg, fourni par Ilan), sans texte : fond #5A7FCF (blue-on-strong), W en un trait de 126 px à bouts ronds, dégradé #FAF9F6 → #BFD7EA, ombre portée légère ; les deux branches sortent du cadre, que le masque coupe. iOS : un PNG de 1024 px sans transparence ni coins arrondis (iOS pose son masque), et les variantes iOS 18 sombre (fond transparent, W en dégradé #C9D6F5 → #6F8FD8, même ombre) et teintée (W en niveaux de gris, sans ombre). Android : icône adaptative, fond #5A7FCF uni et premier plan du W au cadrage du logo sur 108 dp (les branches dépassent déjà le calque, les boucles restent dans la zone sûre de 66 dp) ; calque monochrome (le W d'une couleur, sans ombre) pour les icônes à thème. À l'export, retirer shape-rendering="crispEdges" du tracé (bords crénelés).
  • Écran de lancement (retour d'Ilan) : fond #5A7FCF, le W du logo, le carré du logo pris à la largeur de l'écran et centré : les deux branches sortent de l'écran, à gauche et en haut à droite. Même cadrage que l'icône, qu'iOS agrandit au lancement. Barre d'état claire ; il reste bleu en mode sombre. iOS : splash.png (W seul, fond transparent, 1290 × 2796) en cover sur #5A7FCF. Android 12 et plus : écran du système, l'icône dans un disque de 192 dp sur fond blue (#4E74C8) pour que le disque se lise, sans second écran. Fondu de 200 ms vers l'accueil dès que la carte est prête, au plus tard après 2 s ; ensuite l'accueil en chargement (E-01, D-061).
  • Ordre au premier lancement (choix d'Ilan) : écran de lancement → accueil en chargement et demande de la position (fenêtre du système) → carte centrée (sur vous, ou sur Paris après un refus) → sheet « Mesure d'audience ». Les notifications ne sont demandées qu'au premier « Programmer ».
  • Accueil au premier lancement : sans compte : « Bonjour », bouton connexion à la place de l'avatar (user dans un disque blanc, ouvre E-10), aucun filtre rapide actif, pas de compteur sur le bouton filtres.
  • Position : fenêtre du système au premier affichage de la carte, sans écran avant. Texte de la demande (NSLocationWhenInUseUsageDescription) : « Widoo s'en sert pour centrer la carte sur vous, trier les parcours par distance et vous guider pendant une sortie. Elle n'est jamais enregistrée sur nos serveurs. » Position « quand l'app est active » seulement. Refus : l'accueil sans position (E-01, états).
  • Mesure d'audience : sheet sur l'accueil une fois la carte centrée, sans poignée, qui ne se ferme ni en glissant ni sur le voile : il faut choisir. « Mesure d'audience » ; « Avec votre accord, Widoo mesure l'usage de l'app pour l'améliorer, avec PostHog, hébergé dans l'Union européenne. Les rapports de plantage restent envoyés, sans information sur vous. » ; « Vous pourrez changer d'avis dans les Réglages. » ; lien « Politique de confidentialité » (arrow-square-out sur la maquette ; ouvre la politique en écran natif, E-19, D-063). « Refuser » (surface, texte ink) et « Accepter » (blue, retour d'Ilan) côte à côte, même taille (48 px), « Accepter » à droite. Tant qu'aucun choix n'est fait, seuls les rapports de plantage partent. Remplace la bannière provisoire du code. Retrait : Réglages › Confidentialité (E-19, D-063).
  • Rappels (premier « Programmer ») : tant que le téléphone n'a jamais posé la question, la sheet de programmation (E-06) se ferme puis « Recevoir un rappel ? » s'ouvre sur la fiche, avec poignée : cloche pleine blue-ink dans un disque blue-soft de 64 px, « Nous vous prévenons la veille à 18:00, puis une heure avant le départ. », « Activer les rappels » (bouton bleu, 52 px) ouvre la fenêtre du système, « Plus tard » (texte, 48 px), le glisser ou le voile la ferment ; vient ensuite le toast « Sortie programmée ». La sheet ne revient pas d'elle-même. Refus ou « Plus tard » : « Rappels désactivés » dans Votre sortie (E-08), avec « Activer ».
  • Fenêtres du système : dessinées pour iOS (position : texte de la demande, aperçu « Précise : activée », « Autoriser une fois », « Autoriser lorsque l'app est active », « Ne pas autoriser » empilés ; notifications : « Ne pas autoriser » et « Autoriser » côte à côte) ; Android : boîtes du système du même rôle, non dessinées.
  • Transitions : fondu de l'écran de lancement vers l'accueil ; sheets qui montent du bas (M-02).
  • États (D-061, choix d'Ilan) : lancement lent : l'accueil en chargement (E-01) remplace l'écran de lancement après 2 s, la demande de position vient au premier affichage de la carte. Premier lancement hors connexion : rien en cache, carte en fond uni sans rues ni marqueurs, en-tête « Hors connexion » (wifi barré), gabarit des états de E-01 : « Pas de connexion », « Widoo a besoin d'internet pour charger les parcours autour de vous. », « Réessayer », recharge seule au retour du réseau ; la position est demandée quand même. La sheet « Mesure d'audience » attend le premier accueil chargé, à ce lancement ou au suivant, jamais sur un état d'erreur ou hors connexion ; rien n'est envoyé d'ici là. Position approximative (« Précise » désactivée) : zone blue à 12 % bordée de blue plein (1,5 px) à la place du point, « Autour de Paris 10e » dans l'en-tête, ni bandeau ni nouvelle demande ; la position précise est demandée au lancement d'une sortie (E-07), pour cette sortie seulement (« Pour vous guider d'une étape à l'autre pendant cette sortie. »). Politique de confidentialité hors connexion : le texte est gardé dans l'app et s'ouvre normalement (D-063, textes légaux en écrans natifs) ; le toast « Page indisponible hors connexion » de D-061 est retiré (Sandbox).
  • Texte agrandi et lecteur d'écran (D-061) : au plus grand réglage standard (D-046), la sheet « Mesure d'audience » grandit et tient dans l'écran, « Refuser » et « Accepter » restent côte à côte (48 px au moins ; au-delà de l'écran, règle des sheets hautes) ; « Recevoir un rappel ? » sur deux lignes, boutons pleine largeur ; hors connexion, la sheet d'état monte pour garder « Réessayer » au-dessus de la barre d'onglets ; toasts à 1,3. Lecteur d'écran : « Se connecter, bouton » ; en-tête « Bonjour, Autour de Paris 10e, 22 degrés » ou « Bonjour, hors connexion » ; zone « Votre position, approximative » ; sheet « Mesure d'audience » en dialogue, focus sur le titre, le geste d'échappement ne la ferme pas (un choix est demandé) ; « Recevoir un rappel ? » en dialogue, geste d'échappement = « Plus tard » ; toasts annoncés sans déplacer le focus. Tableau complet : contrôle accessibilité.

E-01 — Accueil

🟢 Validé le 2026-09-22, révisé le 2026-09-22 (D-004), le 2026-09-23 (D-010, D-014) et le 2026-09-28 (D-071 : recentrage, raison du classement), puis le 2026-10-09 (D-082 : recentrage visible dans tous les états ; D-083 : Retour Android) ; pass terminé le 2026-09-29 (ticket #210, planche 2, D-073) · maquette · sheet remontée · sections quand il pleut · zone choisie · filtres appliqués · pass terminé · texte agrandi · composants · Claude Design

  • Rôle : écran principal, découverte autour de l'utilisateur. La carte occupe tout l'écran ; les résultats vivent dans une bottom sheet à trois crans organisée en sections (E-04). Il n'y a plus de vue liste séparée ni de bascule carte / liste. À l'ouverture, aucun parcours n'est sélectionné.
  • Barre du haut (flottante sur la carte) : avatar (ou bouton connexion), « Bonjour {prénom} » avec, en dessous, la position courante et la météo sur la même ligne (icône épingle, « Paris 10e · République · ☀ 22 °C »), bouton notifications rond à droite. Ni logo ni wordmark dans l'interface.
  • Recherche : pilule blanche « Qu'est-ce qu'on fait aujourd'hui ? » avec le bouton filtres intégré à droite (disque gris clair, badge bleu du nombre de filtres actifs). Tap sur la pilule : recherche E-02 ; tap sur le bouton filtres : panneau E-03.
  • Chips (une seule rangée défilante, 36 px, texte 13, zone tactile 44 px) : Gratuit, puis les publics (Couple, Solo, Famille…), puis Extérieur (icône banc), puis les ambiances (Culture, Nature, Gastronomie…) aux teintes de leur famille ; chip active en encre avec coche ; mêmes icônes que dans le panneau E-03. Plus de chip météo ni de bandeau météo : la météo pilote une section de la sheet.
  • Carte : bord à bord, style clair ; marqueur = vignette photo du parcours (coins arrondis, liseré blanc) + étiquette de durée blanche en heures (« 7 h », jamais « Journée ») ; bouton « Rechercher dans cette zone » (pilule blanche) et recentrage (disque blanc) juste au-dessus de la sheet. Le tap sur un marqueur est décrit dans E-04. Recentrer (D-071, #229) : la carte revient sur l'utilisateur et la recherche se relance tout de suite, comme à l'ouverture, sans passer par « Rechercher dans cette zone » ; une zone choisie dans E-02 est quittée (comme avec la croix de la pilule), les filtres restent. Recentrage toujours visible (D-082, #319, #229) : le bouton de recentrage est affiché dans tous les états où la carte l'est (résultats, aucun résultat, hors connexion, position désactivée, zone choisie), sans clignoter quand la carte se déplace ou qu'une recherche se termine ; seul « Rechercher dans cette zone » se masque, quand la recherche vient d'être faite ou qu'il n'y a pas de connexion. Seule exception : pendant la sélection d'un parcours, recentrage et bouton de zone sont masqués (E-04). Raison : retour de Paul sur appareil le 2026-10-09 ; c'est en arrivant sur une zone vide qu'on a le plus besoin de revenir sur soi. Écarté : masquer le recentrage pour alléger l'état vide.
  • Bottom sheet : au repos, 120 px visibles au-dessus de la barre d'onglets : poignée, titre de section « À proximité » avec sous-titre fin « N parcours », lien « Voir tout » en bleu, début du carrousel de cards. Remontée : les sections s'empilent (À proximité, toujours en tête ; la section météo ; Les Signature Widoo ; …), chacune avec titre, sous-titre, « Voir tout » et un carrousel horizontal de cards ; « Voir tout » ouvre la liste complète de la section (E-04). Les sections suivent les composantes de la recommandation (proximité, contexte, Signature, fraîcheur).
  • Zone choisie, filtres appliqués, météo (2026-09-23 : zone choisie, filtres appliqués, pluie) :
    • Zone choisie dans E-02 : la carte se recadre sur la zone (environ 3 km) sans épingle ni marqueur de lieu ; la pilule affiche la zone en gras avec une croix qui ramène « autour de moi » ; la section devient « Autour de Canal Saint-Martin · 18 parcours » ; pas de « Rechercher dans cette zone » (la recherche vient d'être faite), recentrage visible ; la ligne de position reste celle de l'utilisateur.
    • Filtres appliqués depuis E-03 : les filtres actifs passent en tête de la rangée de chips (encre et coche), les autres suivent ; badge du bouton filtres au nombre de filtres ; sous-titre de section « 9 parcours · 3 filtres » ; un tap sur une chip active la retire sans rouvrir le panneau.
    • Météo : « À proximité » reste toujours la première section ; la section météo vient en deuxième. Beau temps : « Parfait sous ce soleil · Extérieur · 22 °C ». Pluie : « À l'abri de la pluie · Intérieur · pluie cet après-midi », parcours majoritairement en intérieur. Temps neutre : pas de section météo. La ligne de position affiche l'icône du temps (soleil jaune, nuage de pluie bleu) et la température.
  • Card de parcours (carrousel, 270 px, hauteur fixe 348 px) : photo en tête avec note (étoile jaune) en pastille blanche et favori en disque blanc ; Vérifié (pastille verte translucide) et Signature (parcours de l'équipe Widoo : pastille bleue translucide, bleu encre #3A4FA8 sur bleu pâle, D-014) posés sur la photo ; un parcours Premium ajoute sa pastille encre à couronne dorée à côté de la note, en haut à gauche (D-014) ; titre sur deux lignes au plus ; ligne ambiance (point de couleur) · arrondissement · quartier ; ligne créateur (avatar 22 px et « Par {prénom} », logo Widoo et « Par Widoo » pour les parcours de l'équipe, appui → E-16) ; budget en chiffre clé (« ≈ 25 € par pers. », « ≈ 5 € » pour un petit montant, ou « Gratuit » si le total est nul ; lecteur d'écran « environ 25 euros par personne » ; somme des coûts arrondie à 5 €, voir Orchestration, D-032) ; tags durée (horloge) et distance (marche). Parcours sans avis : pastille blanche « Nouveau » à la place de la note, et pas de Vérifié tant qu'il n'est pas vérifié ; créateur certifié : sceau bleu après le prénom sur la ligne créateur (D-023). Variante liste 358 px, hauteur 388, tag public en plus. Tri Recommandé : raison du classement à droite du budget, sur la même ligne, en texte seul (12 px 600, blue-ink, sans icône ni fond) : « Moment idéal » (good_timing) ou « Récent » (fresh) ; rien pour les autres clés (top_rated, verified, official répètent la note, Vérifié ou « Par Widoo ») ni quand reason vaut null (D-071, #222, planche).
  • Barre d'onglets : pilule blanche flottante avec une légère ombre portée (seule ombre autorisée dans l'app), onglets Accueil / Parcours / Profil en disques gris clair à icônes normales, au trait (Phosphor Regular) ; onglet actif en pilule noire libellée avec l'icône pleine en bleu Widoo, seule icône pleine de la barre (mappings.uiIcons : tab-home, tab-outings, tab-profile « fill quand actif », planche « Icônes », D-025, D-043). Au changement d'onglet, la pilule noire glisse jusqu'à l'onglet choisi avec un léger rebond et le libellé se déroule depuis l'icône ; pas de vibration (M-13, D-042).
  • Texte agrandi (repris en D-047) : la météo passe seule sur une deuxième ligne sous la position ; placeholder court « Qu'est-ce qu'on fait ? » ; chips, pilules et compteur plafonnés à 1,3 (le compteur reste rond) ; cards à hauteur libre ; sheet au repos relevée pour garder l'en-tête de section entier. Règles complètes : Direction-Artistique › Accessibilité.
  • États (maquettés le 2026-09-23 : chargement, aucun résultat, erreur, hors connexion, géolocalisation refusée) : tous les messages vivent dans la sheet, jamais en bandeau sur la carte ni en toast.
  • Pass terminé (D-073, #210, choix d'Ilan : un message à la réouverture, aucune notification) : à la première ouverture après la fin du pass 7 jours, toast d'information au-dessus de la barre d'onglets, « Votre pass est terminé », « Les parcours Premium sont de nouveau verrouillés. », action « Prolonger » (E-17) ; 6 s comme les toasts à action, une seule fois. C'est un changement de droits, pas un état de chargement : la règle des états ci-dessus ne s'applique pas. Les parcours achetés seuls restent débloqués.
    • Chargement initial : carte sans marqueurs, sheet au repos avec le titre de section et « Recherche autour de vous… », trois squelettes de card gris chaud aux cotes exactes de la card (blocs #E8E7E2 sur #F6F5F1, léger balayage animé) ; aria-busy sur le carrousel.
    • Aucun résultat : la sheet monte (haut à 470 px) et remplace les sections par un message centré : icône carte + loupe dans un disque gris chaud de 56 px, titre « Aucun parcours par ici avec ces filtres » (« Aucun parcours par ici » sans filtre actif), texte d'explication, bouton bleu « Élargir la zone » (rayon × 2), lien bleu « Retirer les N filtres » quand des filtres sont actifs. Recentrage visible ; « Rechercher dans cette zone » masqué tant que la carte n'a pas bougé depuis la recherche (D-082).
    • Erreur de chargement : même gabarit, icône nuage barré, « Impossible de charger les parcours », « Vérifiez votre connexion puis réessayez. », bouton « Réessayer ». Sans connexion et sans cache : titre « Pas de connexion ».
    • Hors connexion avec cache : les derniers résultats chargés restent (marqueurs et cards) ; bandeau gris chaud de 40 px sous la poignée, icône wifi barré, « Hors connexion · résultats du 22 sept. à 14:02 ». « Rechercher dans cette zone » masqué (pas de connexion), recentrage visible (D-082).
    • Géolocalisation refusée : carte centrée sur Paris, ligne de position « Paris · position désactivée » (épingle barrée), même bandeau avec « Position désactivée · autour de Paris » et le lien « Activer » (demande système, ou Réglages si déjà refusée), sous-titre « N parcours · Paris », cards sans tag de distance, tri sans composante distance. Zone et recentrage visibles (D-082).
    • Carte déplacée : bouton « Rechercher dans cette zone » (validé avec E-01).
  • Comportement : la zone et les filtres sont conservés quand la sheet monte ou descend ; la sélection d'un parcours et l'échange carte ↔ sheet sont spécifiés dans E-04, comme le bouton Retour d'Android (E-04 › Retour Android, D-083).
  • Transitions (D-030) : card vers fiche (M-01) ; sheet à trois crans (M-04) ; appui sur un marqueur et zone choisie (M-07) ; chips (M-08) ; chargement (M-09) ; « Voir tout » (M-03).

E-02 — Recherche géographique

🟢 Validé le 2026-09-23 (planches 1 à 4 du ticket #70 : recherche, zone choisie, états, contrôle accessibilité) · texte agrandi, saisie · texte agrandi, résultats · contrôle accessibilité · champ vide · saisie · aucun résultat · zone choisie · hors connexion · hors connexion, saisie · chargement · zones indisponibles · erreur · composants · Claude Design

  • Rôle : choisir une zone (quartier, arrondissement, station, ville) pour y voir les parcours, ou retrouver un parcours par son titre. Widoo cherche des parcours dans une zone : aucune adresse ni aucun lieu isolé n'est proposé, aucune épingle de lieu n'est posée sur la carte.
  • Ouverture : tap sur la pilule de recherche de l'accueil : la sheet monte au cran plein, le champ prend le focus et le clavier s'ouvre ; chips et sections disparaissent. Champ gris chaud de 48 px (loupe, texte indicatif « Quartier, station ou parcours », croix d'effacement pendant la saisie) et lien bleu « Annuler », qui redescend la sheet au cran précédent sans rien changer. Défiler masque le clavier.
  • Champ vide : « Recherches récentes » (zones, 10 au plus, stockées sur le téléphone, croix pour en retirer une, lien « Tout effacer »), puis « Parcours consultés récemment » (les 3 derniers : vignette 44 px, titre, point d'ambiance · quartier · note).
  • Saisie (debounce 300 ms) : deux groupes. « Zones » d'abord : quartiers, arrondissements, stations, villes (géocodage limité à la France, sans adresse ni point d'intérêt), chaque ligne avec une icône carte, le type, l'arrondissement et le nombre de parcours (« Quartier · Paris 10e · 18 parcours »). Puis « Parcours » dont le titre ou les tags correspondent (2 ou 3 lignes et le lien « Voir les N parcours »). La partie tapée est en gras. Tap sur un parcours : fiche E-05.
  • Aucun résultat : message centré (icône carte et loupe dans un disque gris chaud), « Aucune zone ni parcours pour « {saisie} » », aide « Cherchez un quartier, un arrondissement, une station ou le nom d'un parcours. » Pas de bouton : on corrige la saisie.
  • Zone choisie : la sheet redescend au repos et la carte se recadre sur la zone (environ 3 km) ; seuls les parcours de la zone s'affichent, sans épingle. La zone s'affiche dans la pilule de l'accueil (détail dans E-01) et entre dans les recherches récentes.
  • États (2026-09-23) : les messages de la recherche sont des lignes discrètes sous le champ ou dans un groupe (icône 16 px et texte 13 px gris #5F6B80, lien bleu à droite, sans fond ; le bandeau gris de 40 px de l'accueil a été jugé trop gros ici).
    • Hors connexion, champ vide : ligne « Hors connexion · recherche indisponible » (wifi barré) ; les recherches récentes et les parcours consultés restent affichés et utilisables (stockés sur le téléphone ; une zone récente ouvre l'accueil sur les parcours déjà chargés en cache, recadré sur l'emprise gardée, sans nouveau géocodage : le téléphone ne garde que le nom et l'emprise de la zone, jamais la réponse de Mapbox, D-081 ; retirer et « Tout effacer » marchent sans réseau). Au retour du réseau, la ligne disparaît.
    • Hors connexion, saisie : aucune requête ; la ligne reste, avec l'aide « Effacez la saisie pour retrouver vos recherches récentes et les parcours consultés, disponibles sans réseau. » Pas de recherche dans le cache. Si le réseau revient pendant la saisie, la recherche part avec le texte tapé.
    • Chargement : après le debounce, les résultats précédents restent affichés et un anneau bleu de 20 px remplace la croix d'effacement ; au premier caractère, les récentes restent jusqu'aux premiers résultats. Au-delà de 5 s sans réponse : état d'erreur.
    • Erreur partielle : zones (/geocode) et parcours sont deux requêtes lancées en parallèle et affichées indépendamment. Si les zones échouent, le groupe Zones garde son titre et affiche « Zones indisponibles pour le moment » (nuage barré) avec « Réessayer » (relance seulement les zones, zone tactile 44 px) ; les Parcours s'affichent normalement. Cas inverse : « Parcours indisponibles pour le moment » dans le groupe Parcours.
    • Erreur totale : message centré sur le gabarit de l'erreur de l'accueil, « La recherche ne répond pas », « Réessayez dans un instant. Vos recherches récentes restent disponibles en effaçant la saisie. », bouton bleu « Réessayer » (relance la même saisie) ; le clavier reste ouvert.
    • Lecteur d'écran : pendant la requête, le champ annonce « Recherche en cours » et la liste est en aria-busy, puis « N zones, N parcours » ; les lignes d'état et le message d'erreur sont en status.
  • Texte agrandi (repris en D-047) : le champ grandit avec le texte (hauteur minimale 48 px) ; le texte indicatif se raccourcit en « Zone ou parcours » ; titres et sous-titres des lignes passent à la ligne, jamais coupés ; dans une ligne de parcours, le point d'ambiance reste en tête et le sous-titre (ambiance, quartier, note) passe à la ligne d'un bloc ; le clavier système ne grandit pas, les résultats se lisent en faisant défiler. Règles : Direction-Artistique › Accessibilité.
  • Lecteur d'écran : champ « Rechercher une zone ou un parcours, champ de recherche » ; « Effacer la recherche », « Annuler la recherche », « Effacer toutes les recherches récentes » ; groupes annoncés comme titres ; ligne de zone « {zone}, {type}, {arrondissement}, N parcours » ; croix « Retirer {zone} de l'historique » ; ligne de parcours « Parcours {titre}, {ambiance}, {quartier}, note {note} sur 5 ».
  • Transitions (D-030) : la sheet monte au cran plein avec le clavier (M-04, déplacée par l'app) ; « Annuler » la redescend ; zone choisie : sheet au repos et recadrage (M-07) ; résultats en fondu (M-08) ; anneau pendant la recherche (M-09).

E-03 — Filtres complets

🟢 Validé le 2026-09-23 (planches 2 à 4 du ticket #70 : panneau, compteur, zéro résultat, accueil filtré, états, contrôle accessibilité) · texte agrandi · aucun parcours, texte agrandi · contrôle accessibilité · panneau · compteur en calcul · aucun parcours · accueil filtré · nombre indisponible · hors connexion · composants · Claude Design

  • Rôle : combiner tous les critères. Taxonomie et logique de combinaison : Filtres-et-Recherche.
  • Ouverture : tap sur le bouton filtres de la pilule de recherche. Sheet modale presque plein écran (haut à 60 px), voile encre à 40 %. En-tête collé : « Filtres » et « N actifs » en gris, bouton fermer rond de 44 px, filet bas.
  • Groupes : Public, Budget par personne, Durée, Déplacement, Ambiance, Conditions, chacun avec son titre (17 px, 800) et ses chips de 36 px qui passent à la ligne ; plusieurs choix possibles dans chaque groupe. Budget en montants (Gratuit, Jusqu'à 25 €, 25 à 70 €, Plus de 70 €) et durée en heures (Jusqu'à 2 h 30, 2 h 30 à 5 h, 5 à 12 h, Plus de 12 h) ; des curseurs pourront remplacer ces deux groupes plus tard.
  • Icônes des chips : une icône par valeur, sauf Budget et Durée où le montant et les heures suffisent, à une exception : « Gratuit » prend l'étiquette (tag), comme sa chip rapide sur l'accueil (D-053). Culture, Nature, Shopping et Gastronomie reprennent le glyphe et la teinte de leur famille sur la carte (colonnes sur prune, arbre sur vert, sac sur violet #ECE7F8 / #5A3FA8, couverts sur corail), comme sur l'accueil. Romantique (tulipe), Insolite (étincelle), Instagrammable (appareil photo), Détente (fauteuil) et Sportif (haltère) prennent une teinte tirée de leur point d'ambiance, mood-*-ink sur mood-*-soft (retour d'Ilan, D-050), comme dans l'éditeur (E-11). Les autres valeurs sont en gris chaud avec une icône encre : Solo (personne), Couple (cœur), Famille (deux personnes), Entre amis (trois personnes), Dog friendly (patte), Kids friendly (ballons), À pied (marcheur), Vélo, Métro, Voiture, Sans réservation (calendrier barré), Accessible PMR (fauteuil roulant), Intérieur (maison), Extérieur (banc), Beau temps (soleil), Jour de pluie (nuage de pluie). Chip active : encre, la coche remplace l'icône.
  • Barre collée en bas : lien souligné « Réinitialiser » et bouton bleu « Voir N parcours » (52 px) ; le nombre est recalculé à chaque tap (requête count, debounce 300 ms). Le bouton applique les filtres, ferme le panneau et filtre l'accueil (E-01). Fermer sans appliquer garde les filtres d'avant l'ouverture.
  • Compteur en calcul : le bouton garde sa place et sa couleur, affiche un spinner et « Calcul en cours », et reste utilisable (un tap applique, l'accueil se charge avec ses squelettes).
  • Aucun parcours : bouton gris désactivé « Aucun parcours » ; au-dessus, dans la barre, « Aucun parcours ne réunit tous ces critères. Essayez de retirer : » puis jusqu'à trois filtres actifs, chacun avec le nombre de parcours qu'il ferait regagner (« × Plus de 12 h +12 »), du plus au moins utile ; un tap retire le filtre et relance le calcul. Côté API : un comptage « tous les filtres sauf un » pour chaque filtre actif.
  • États (2026-09-23) :
    • Nombre indisponible (comptage en erreur ou sans réponse après 5 s) : le bouton reste bleu et utilisable, libellé « Voir les parcours » sans chiffre ; au-dessus, dans la barre collée, une ligne discrète (nuage barré, 13 px gris) « Nombre de parcours indisponible pour le moment ». Le comptage est retenté au tap suivant sur une chip ; s'il répond, retour à « Voir N parcours ». Appliquer charge l'accueil filtré normalement.
    • Hors connexion : même bouton sans chiffre, ligne « Hors connexion · sur les parcours déjà chargés » (wifi barré). Appliquer filtre les résultats en cache de l'accueil (bandeau hors connexion de l'accueil conservé) ; si rien ne correspond, l'accueil montre son état vide. Pas de suggestions « Essayez de retirer » hors connexion (elles demandent le comptage serveur).
  • Texte agrandi (repris en D-047) : titres de groupe agrandis, chips plafonnées à 1,3 (composant dense) et passant à la ligne ; barre collée : la rangée « Réinitialiser » + bouton est en flexWrap: 'wrap-reverse' avec un bouton de base 220 px, si bien que le bouton monte en pleine largeur et « Réinitialiser » passe dessous, centré, dès que la place manque, sans branche sur fontScale ; à zéro résultat, phrase et suggestions s'empilent au-dessus du bouton grisé.
  • Lecteur d'écran : panneau en dialog « Filtres, N actifs » ; chaque groupe en fieldset avec sa légende ; chips en boutons à bascule (aria-pressed) ; bouton en aria-busy pendant le calcul, puis annonce du nouveau total ; suggestion « Retirer {filtre}, N parcours de plus ».
  • Transitions (D-030) : sheet modale et voile (M-05) ; chips (M-08) ; compteur sans animation du chiffre, anneau en calcul (M-09) ; appliquer : la sheet se ferme et l'accueil charge (M-09).

E-04 — Résultats (bottom sheet, sélection sur la carte, liste « Voir tout »)

🟢 Validé le 2026-09-23 (planches 1 à 4 : sheet à trois crans, tap sur un parcours, tap sur une étape, liste « Voir tout » et tri, états, contrôle accessibilité), révisé le 2026-09-23 (D-014 : parcours Premium sans abonnement) et le 2026-09-25 (D-041 : largeur de la tooltip, #155), puis le 2026-09-28 (D-071, recette v0.2 : autres parcours masqués, étapes rapprochées, raison du classement, tri sans position, Retour Android), puis le 2026-10-09 (D-083 : Retour Android en un seul niveau ; D-084 : étapes rapprochées sans zoom minimal au cadrage), puis le 2026-10-14 (D-089 : résumé compact pendant la sélection, tout le tracé cadré au-dessus) · tap parcours · tap Premium sans abonnement · tap étape · étapes rapprochées · règles des étapes rapprochées · raison du classement · mi-hauteur avec raison · Voir tout avec raison · texte agrandi, raison · mi-hauteur · plein · Voir tout · sheet de tri · tri sans position · Voir tout, chargement · aucun résultat · erreur · page suivante · texte agrandi, tap · texte agrandi, Voir tout · contrôle accessibilité · Claude Design

  • Rôle : résultats de la zone affichée sous la carte, en sections ; sélection d'un parcours depuis la carte ; liste complète d'une section.
  • Trois crans de la sheet (@gorhom/bottom-sheet) : repos (120 px au-dessus de la barre d'onglets : poignée, en-tête « À proximité · N parcours · Zone », début du carrousel) ; mi-hauteur (haut à 296 px : sections empilées) ; plein (sous la barre d'état : la barre du haut est couverte, la pilule de recherche et la rangée de chips passent dans la sheet, épinglées en tête, recherche en gris chaud sur blanc, disque filtres blanc). Zone et filtres conservés à chaque cran.
  • Tap sur un parcours (marqueur) : la carte se recadre sur le parcours ; le marqueur photo disparaît, remplacé par une tooltip encre ancrée sur l'étape 1 (le départ) ; le tracé bleu et les étapes s'affichent. La sheet revient au repos et son contenu devient le résumé du parcours. Résumé compact et cadrage (D-089, #305) : au repos, le résumé ne montre que le titre, la note et le bouton bleu « Voir le parcours », à toutes les tailles de texte ; la vignette, ambiance · quartier, le créateur, le prix et les tags durée et distance suivent sous le bouton et se lisent en remontant la sheet. La carte cadre tout le tracé dans la place laissée entre la tooltip du départ et le résumé, sans limite de zoom (D-084) : un long parcours peut sortir de son quartier. La maquette « tap parcours » montre encore le résumé entier : ce texte prime. « Rechercher dans cette zone » et le recentrage sont masqués pendant la sélection, comme les marqueurs des autres parcours, qui ne couvrent plus le tracé (fondu fade, retour à la désélection ; D-071, #230) : pour passer à un autre parcours, on revient d'abord à la recommandation. Tap ailleurs sur la carte : tooltip fermée, tracé retiré, sheet de retour sur la recommandation. Le bouton Retour d'Android fait exactement la même chose (D-083, voir Retour Android ci-dessous).
  • Tooltip (un seul gabarit, une seule ouverte à la fois) : bulle encre #14171F avec flèche vers le point, à la largeur de son titre sur une ligne : 260 px au moins, 80 % de l'écran au plus (312 px sur 390), le titre passant sur deux lignes au-delà (D-041) ; centrée sur son ancre quand c'est possible, sinon ramenée dans l'écran à 16 px du bord, la flèche restant sur l'ancre ; titre = nom du parcours (deux lignes max) et note (étoile jaune) à droite ; ligne d'étape = photo du lieu (48 px, rayon 10), nom du lieu, « Étape i/n · catégorie · durée sur place » ; bouton « Voir plus » en pilule blanche pleine largeur. « Voir plus » et « Voir le parcours » ouvrent la fiche E-05 (à l'étape concernée pour une étape).
  • Étapes sur la carte : l'étape 1 est le départ, les suivantes 2, 3, 4… ; chaque étape est une pastille de 28 px (34 px quand elle est tapée), liseré blanc, couleur de famille et icône de catégorie (places.category) : Gastronomie #F2592A (restaurant couverts, café tasse, bar verre, boulangerie pain) ; Culture #7A2A4A (musée colonnes, galerie cadre, monument tour) ; Nature #2A8A62 (parc arbre, point de vue sommets, balade marcheur) ; Shopping #5A3FA8 (boutique sac) ; Loisirs #128A87 (activité éclair, spectacle billet) ; Autre #5F6B80 (épingle). Toutes ≥ 3:1 sous l'icône blanche. Tap sur une étape : sa tooltip s'ouvre (même gabarit), le parcours reste sélectionné et la sheet garde le résumé. Étapes rapprochées (D-071, #230, maquette, règles) : chaque étape se touche sans zoomer, à 100 % comme à 150 % de texte, zones tactiles de 44 px conservées. (1) Quand deux zones se chevauchent, le tap va à l'étape dont le centre est le plus proche du doigt, jamais à celle dessinée par-dessus. (2) La tooltip se place au-dessus de son étape ; si elle couvrait une autre étape du parcours, départ compris, elle passe en dessous, flèche en haut. (3) Si les deux côtés couvrent une étape, la carte zoome sur l'étape touchée (M-07), jusqu'au zoom 17, jusqu'à libérer un côté. (4) Cadrage à la sélection : tout le tracé, sans zoom minimal imposé. Révisé le 2026-10-09 (D-084, #230) : le tap va à l'étape la plus proche du doigt ; la tooltip d'une étape ne couvre jamais une étape voisine : au-dessus par défaut, « dessous, flèche en haut » quand « dessus » en couvrirait une. Écarté : le zoom minimal au cadrage (ancien zoom 13), qui dézoome ou zoome arbitrairement selon le parcours et aggrave le recadrage trop large à 150 % (#305).
  • Parcours Premium sans abonnement (D-014) : au tap, la carte se recadre mais n'affiche ni tracé ni étapes ; le départ est une pastille encre à couronne dorée (34 px, liseré blanc) ; la tooltip garde son gabarit : titre et note, photo du parcours (48 px), « Parcours Premium » précédé d'une couronne dorée et « 4 étapes en 7 h », sans aucun nom d'étape. « Voir plus » et « Voir le parcours » ouvrent la fiche (étapes verrouillées, E-05). Abonné, le tap validé ne change pas. Lecteur d'écran : « {titre}, parcours Premium, 4 étapes en 7 heures ».
  • Liste « Voir tout » : route de la pile Accueil (barre d'onglets conservée), retour sans perdre l'état de la sheet (#62). En-tête : bouton retour en disque gris clair, grand titre de la section (« À proximité », 26 px), sous-titre « Autour de République · rayon 2 km » (« Autour de Paris » sans position). Ligne épinglée au défilement, sous l'en-tête, avec un filet bas : nombre de parcours à gauche (« 24 parcours »), pilule de tri à droite (36 px gris chaud, icône tri, libellé du tri courant, chevron). Liste verticale de cards 358 px (variante liste, tag public), pas de 12, défilement infini. Tant que le tri reste Recommandé, la card porte la raison du classement comme dans le carrousel (E-01, D-071) ; aucune avec les autres tris.
  • Sheet de tri : ouverte par la pilule, voile encre à 40 %, sheet blanche « Trier par », groupe radio : Recommandé (« Proximité, qualité et contexte du moment »), Distance (« Du plus proche au plus loin »), Durée (« Du plus court au plus long »), Note (« Les mieux notés d'abord ») ; radio cochée en bleu ; le choix s'applique immédiatement, ferme la sheet et se mémorise pour la session. Sans position : « Distance » reste visible mais grisée, avec le lien « Activez la localisation pour trier par distance » qui ouvre la demande de position ; Recommandé se calcule sans composante distance et se décrit « Qualité et contexte du moment » (D-071, #166). La forme « tri en rangée de chips » a été écartée.
  • États de « Voir tout » : chargement (ligne épinglée « Recherche… », trois squelettes 358) ; aucun résultat (« 0 parcours », message centré avec « Élargir la zone » et « Retirer les N filtres ») ; erreur (« — », message avec « Réessayer ») ; page suivante (défilement infini : la liste a défilé, le grand titre est parti, la ligne épinglée reste collée sous la barre d'état, ligne de 56 px en bas avec un anneau bleu et « Chargement… ») ; fin de liste sans indicateur.
  • Texte agrandi (repris en D-047) : cards à hauteur libre alignées sur la plus haute, tags sur deux rangées, raison du classement seule sur la ligne sous le budget (D-071), pilules à hauteur minimale, composants denses plafonnés à 1,3 ; la tooltip se réduit au nom et à la note, à sa largeur maximale (312 px, nom sur deux lignes), et la carte se recadre sur le tracé ; le résumé reste compact comme à 100 % (titre, note, « Voir le parcours », D-089) et ajoute sous le pli l'étape que la tooltip ne montre plus : l'étape, la vignette, le créateur, le prix et les tags se lisent en remontant la sheet. Règles complètes : Direction-Artistique › Accessibilité.
  • Lecteur d'écran : la raison du classement termine le libellé unique de la card, après la distance (« …, 3 heures, 4,2 kilomètres, moment idéal », D-071) ; marqueur « {titre}, {durée} » ; étape « Étape i sur n, {lieu}, {catégorie}, sélectionnée » ; tooltip en dialog nommé « Parcours {titre}, étape i sur n, {lieu} » ; résumé en région « Parcours sélectionné » ; messages d'état en status ; squelettes en aria-busy.
  • Retour Android (D-083, #228, remplace l'ordre par niveaux de D-071) : avec un parcours sélectionné, le Retour fait exactement ce que fait un tap ailleurs sur la carte : tooltip fermée, tracé retiré, marqueurs revenus, sheet de retour sur la recommandation. Une tooltip d'étape touchée n'est pas un niveau à part : un seul Retour ferme toute la sélection. Sans sélection, le Retour garde le comportement du système (quitter l'accueil, l'app passe en arrière-plan), quel que soit le cran de la sheet. « Voir tout » est un écran de la pile de navigation : le Retour le ferme comme n'importe quel écran ; la sheet de tri et les panneaux suivent aussi la pile. iOS n'a pas de Retour : rien ne change. Écarté : un Retour par niveau (tooltip d'étape, puis sélection, puis cran de la sheet), jugé trop long.
  • Transitions (D-030) : crans (M-04) ; appui sur un marqueur : recadrage, tooltip, résumé (M-07) ; « Voir le parcours » depuis la vignette (M-01) ; « Voir tout » (M-03) ; tri (M-05) ; défilement infini (M-09).

E-05 — Fiche parcours

🟢 Validé le 2026-09-23 (planches 1 à 3 du ticket #71 : fiche, états, contrôle accessibilité ; D-013 et D-014) ; report de l'éditeur validé le 2026-09-26 (ticket #181, D-052) ; déblocage à l'unité validé le 2026-09-29 (ticket #210, planche 1, D-072 ; sans compte, planche 2, D-073) ; six cas limites tranchés le 2026-10-14 (D-092) · ouverture · infos · étapes · fin et avis · lieu signalé · étape signalée · parcours privé · Premium sans abonnement · étapes verrouillées et déblocage à l'unité · achat à l'unité en cours · parcours débloqué · pass activé · débloqué sans compte · parcours retiré · chargement · erreur · texte agrandi, ouverture · texte agrandi, étapes · texte agrandi, avis · composants · contrôle accessibilité · crédit d'une photo libre · crédit déplié · étape éphémère, lien affilié, métro · accès calculé · une étape terminée · composants du report · texte agrandi, parcours Premium · Claude Design 🟢 Vérification communautaire (ticket #77) : validée en entier le 2026-09-26 (planches 1 à 3, D-056 à D-058) · étape à vérifier · dépliée · signaler le parcours · motifs · un lieu a changé · quel lieu · parcours signalé · retour au signaleur · sans compte · reprise · déjà signalé · hors connexion · texte agrandi, dernière vérification · texte agrandi, motifs · texte agrandi, quel lieu · texte agrandi, signalé · contrôle accessibilité · Claude Design 🟢 Traduction automatique (ticket #203) : validée le 2026-09-29 (D-076) · parcours traduit · texte d'origine · avis traduits · avis dans leur langue · texte agrandi, parcours traduit · contrôle accessibilité · Claude Design

  • Rôle : donner envie puis expliquer comment réaliser.
  • Ouverture : modale plein écran au-dessus des onglets, qui monte du bas, depuis « Voir plus » (tooltip de la carte), « Voir le parcours » (résumé) ou une card. « Voir plus » sur une étape ouvre la fiche à cette étape, dépliée. Fermeture : chevron bas en haut à gauche ou glisser vers le bas.
  • Haut : photo pleine largeur sur 380 px, carrousel (« 1 / 6 », glisser horizontal), Vérifié, Signature (parcours de l'équipe Widoo, pastille bleue) et Premium (pastille encre à couronne dorée) posés dessus comme sur la card, boutons blancs de 44 px : fermer, partager, favori. Barre d'état en blanc sur la photo. Dessous, sur une feuille blanche à coins arrondis : titre (26 px), ambiance · quartier, note et « 128 avis » (lien vers les avis), créateur (« Par Widoo » avec le logo, appui → E-16), quatre tuiles d'infos clés (durée, budget par personne affiché « ≈ 25 € par pers. » ou « Gratuit », lu « environ 25 euros par personne », distance, nombre d'étapes) à largeur selon leur contenu, début de la description et « Lire la suite ».
  • Au défilement : la photo part et une barre blanche prend sa place : fermer, titre sur une ligne, partager, favori (disques gris chaud).
  • Infos : description complète ; « Pour qui » (publics) et « Conditions » avec les chips et icônes du panneau de filtres, en lecture seule ; quand le parcours n'est pas PMR, la phrase fixe « Pas accessible en fauteuil roulant. », sans texte du créateur (D-050 ; la planche infos, antérieure, montre encore une précision après les deux-points, D-092) ; « En pratique » en lignes (marche, effort, accès en transport, budget).
  • Étapes : titre « Les étapes » avec le nombre « (4) » à côté, élément séparé plus petit et gris, centré sur le titre ; « Départ conseillé à 10:00 » dessous ; lien « Voir sur la carte » à droite. Timeline verticale : heure suggérée, pastille de famille et icône de catégorie identiques à la carte, nom et catégorie, durée à droite, chevron ; pointillés entre les pastilles jusqu'à « Fin du parcours » (pastille encre, drapeau, heure de fin) ; trajet entre deux étapes « 15 min à pied (1,1 km) ». Tap sur une étape : elle se déplie, une seule à la fois : photo, « Ouvert » en vert puis « aujourd'hui, 10:00 – 19:00 » (« Fermé aujourd'hui » à la place de « Ouvert » quand le lieu est fermé ce jour-là, D-092), coût, réservation avec « Réserver » à la ligne, vérification « Vérifié par 12 visiteurs le 20 sept. » (« Vérifié par l'équipe Widoo le 25 sept. » pour un lieu vérifié par l'équipe, sans visiteur compté, D-092), conseil du créateur sur fond gris chaud (« Le conseil de {prénom} », pour tout créateur, Widoo compris).
  • Pas de carte ni de Google Maps dans la fiche : « Voir sur la carte » ramène à l'accueil avec le parcours sélectionné (E-04). Google Maps n'apparaît qu'une fois le parcours lancé (E-07).
  • Créateur et avis : encart gris chaud (logo ou avatar, nom suivi du sceau bleu s'il est créateur certifié (D-023), « 42 parcours publiés », « Voir le profil » → E-16) ; avis : note moyenne et nombre, les trois derniers (initiale, prénom, date, note en chiffre après une étoile « ★ 5 », texte), sans réponse ni fil, lien « Voir les 128 avis ». Sans avis (D-092) : la section Avis est masquée ; en haut, la pastille « Nouveau » remplace la note, comme sur la card ; le lien « Signaler ce parcours » reste, sous l'encart créateur.
  • Barre collée : « Programmer » (gris chaud, icône horloge, E-06) et « C'est parti » (bleu, Go, E-07) à parts égales. Pas de prix dans la barre : il est dans les tuiles. Parcours déjà programmé : « Programmer » devient la date (« Sam. 26, 10:00 », icône calendrier coché) et ouvre « Votre sortie » (E-08, D-035).
  • Rédaction : pas de point médian « · » en dehors de la ligne ambiance · quartier reprise des cards ; retour à la ligne, parenthèses ou « le » à la place.
  • Lieu signalé : ligne discrète sous les tuiles, sans fond, en ambre foncé #8C5A00 (icône triangle 16 px, texte 13 px) : « Café Lomi signalé, peut-être fermé », lien bleu « Voir l'étape » qui descend à l'étape et la déplie ; plusieurs lieux : « 2 lieux signalés », le lien mène au premier. Le parcours reste proposé, la barre ne change pas. Dans la timeline : point d'alerte « ! » ambre foncé sur la pastille, visible replié ; déplié : encadré ambre pâle #FFF4D6 en tête du détail (« Signalé fermé par 3 visiteurs le 22 sept. Vérifiez avant d'y aller. »), horaires dits « Horaires habituels » (plus de « Ouvert » en vert), vérification « Dernière visite sans problème le 18 sept. ».
  • Vérification communautaire (D-056, ticket #77) : la fiche informe, elle ne demande rien : on ne confirme ni ne signale un lieu sans y être allé (choix d'Ilan) ; un lieu se confirme ou se signale sur place (E-07) ou après la sortie (E-15). Étape stale : « Dernière vérification il y a 4 mois » en petit sous la ligne de l'étape (13 px muted, sceau seal-check au trait green-ink, 16 px), repliée comme dépliée ; le détail n'a alors pas de ligne « Vérifié par… ». Lieu jamais vérifié : « Pas encore vérifié », sans sceau. Ni pastille ni question ; rien sur les cards (E-01, E-04, choix d'Ilan). Signaler ce parcours : lien gris (drapeau, 14 px 600 muted) sous « Voir les 128 avis ». Sheet « Signaler ce parcours », titre du parcours dessous, motifs en radios : « Un lieu a fermé ou a changé », « Contenu choquant ou inapproprié », « Lieu dangereux ou interdit d'accès », « Publicité déguisée », « Photos ou textes copiés », « Informations fausses », « Autre » (champ de 80 caractères) ; « Lu seulement par l'équipe Widoo. Le créateur ne sait pas qui a signalé. » ; « Envoyer » actif avec un motif, et un texte pour « Autre ». « Un lieu a fermé ou a changé » : le bouton devient « Choisir le lieu » et ouvre « Quel lieu ? » (étapes du parcours en radios avec leur pastille, précision facultative de 80 caractères, « Envoyer » ; caret-left revient aux motifs). Après l'envoi : toast « Merci, c'est signalé. », « L'équipe Widoo va regarder ce parcours. », et le lien devient « Vous avez signalé ce parcours » (drapeau plein, non cliquable). Retour au signaleur : notification quand l'équipe a traité un signalement et corrigé quelque chose (« Merci pour votre signalement », « Café Lomi est bien fermé. Les 3 parcours qui y passent vont être corrigés. ») ; rien si le signalement n'est pas retenu. États (D-057, choix d'Ilan) : sans compte, la sheet E-10 « Connectez-vous pour signaler ce parcours » (« Le compte est gratuit. Il nous aide à écarter les faux signalements. »), puis reprise sur les motifs, rien de choisi, « Envoyer » grisé tant qu'aucun motif n'est choisi ; déjà signalé il y a moins de 7 jours, ligne figée « Vous avez signalé ce parcours le 24 sept. » (drapeau plein, non cliquable) jusqu'à 7 jours ou jusqu'à la décision de l'équipe, puis le lien revient ; hors connexion, le signalement est gardé et part au retour du réseau, toast d'information « Signalement enregistré », « Il partira au retour du réseau. », et la ligne « Vous avez signalé ce parcours » s'affiche tout de suite. Pas de lien sur ses propres parcours. Texte agrandi et lecteur d'écran (D-058) : « Dernière vérification » passe à la ligne, jamais coupée, sceau aligné sur la première ligne ; la sheet des motifs, plus haute que l'écran, s'arrête sous la barre d'état et fait défiler motifs, champ et rappel au-dessus d'un fondu de 32 px, « Envoyer » collé en bas ; « Quel lieu ? » garde sa hauteur tant qu'il tient ; toast et barre collée à 1,3. La ligne « Dernière vérification » est dite dans le libellé de l'étape (« …, 45 minutes, dernière vérification il y a 4 mois, replié ») et masquée seule ; motifs et lieux en groupes radio (« Un lieu a fermé ou a changé, bouton radio, 1 sur 7 ») ; « Envoyer, estompé, choisissez un motif » ; toasts annoncés. Tableau complet : contrôle accessibilité.
  • Parcours privé (lien partagé) : pastille blanche « Privé » avec un cadenas à la place de Vérifié et Signature ; ligne discrète sous le titre « Partagé par Camille, visible seulement avec le lien » ; le reste de la fiche est identique.
  • Signature et Premium : Signature = tout parcours créé par l'équipe Widoo (pastille bleue) ; Premium = parcours réservé aux abonnés (routes.access = premium), quel que soit son créateur, Widoo ou utilisateur (pastille encre à 86 % avec couronne dorée et « Premium » en blanc). Les deux se cumulent. Ce qui rend un parcours Premium reste à définir (nombre d'étapes, choix manuel de l'équipe).
  • Parcours Premium sans abonnement : la fiche reste lisible (photo, titre, tuiles, description, infos, créateur, avis). Dans la barre, un seul bouton encre « Débloquer avec Premium » (couronne dorée) remplace Programmer et C'est parti. Les étapes sont en aperçu verrouillé : l'étape 1 (départ) visible et dépliable ; les suivantes gardent l'heure, la pastille de catégorie, la durée et le trajet à pied, mais leur nom et leur détail sont remplacés par la catégorie et « Réservé à Premium », avec un cadenas à la place du chevron. Après « Fin du parcours », encart gris chaud (révisé le 29 septembre, #210, D-072, choix d'Ilan) : couronne dorée sur disque encre, « Parcours Premium », « Débloquez les 3 autres étapes. » ; bouton blanc cerclé (control-border) « Débloquer ce parcours · 1,99 € », qui achète ce parcours directement (fenêtre du store, sans E-17) ; dessous, le pass mis en avant, lien bleu encre « De passage à Paris ? Pass 7 jours, 2,99 € », qui ouvre E-17 pass présélectionné. Prix du store ; tant que l'achat n'est pas branché (#67), sans prix du store, « Débloquer ce parcours » est désactivé et le lien du pass absent (état provisoire, D-092). Le bouton de la barre ouvre E-17 dans l'ordre du profil. Achat à l'unité : le bouton passe à l'anneau « Achat en cours » (annoncé occupé), lien et barre inactifs ; annulation sans message ; réussi, la fiche se déploie sur place (étapes complètes, « Programmer » et « C'est parti ») avec le toast « Parcours débloqué », « Les 4 étapes sont à vous. », le focus restant sur les étapes ; échec, en attente et hors connexion comme E-17 (D-044). Un parcours débloqué garde sa pastille Premium, sans verrou nulle part. Une fois abonné ou pendant un pass, la fiche normale revient. Sans compte (D-073, recommandation du chef de projet reprise par Ilan) : juste après un déblocage à l'unité, la sheet de connexion (E-10) monte sur la fiche déployée : « Parcours débloqué » (coche green-ink), « Créez un compte pour garder ce parcours », « Sans compte, il reste sur ce téléphone seulement et se perd si vous en changez. », les trois choix, « Plus tard » ; compte créé : toast « Ce parcours est gardé sur votre compte. ». Rien après un pass ou un abonnement, qui se restaurent par le store. Sur la carte, voir E-04.
  • Parcours retiré : ouvert depuis un favori, un lien ou une notification : plus de photo ni de barre ; message centré (œil barré) « Ce parcours n'est plus disponible », date du retrait, bouton « Voir des parcours proches » (accueil centré sur sa zone) et lien « Retirer des favoris » s'il y est ; fermer en haut à gauche. Parcours introuvable (404, D-092) : supprimé avec le compte de son auteur, lien faux ou lien privé révoqué : même écran, sans date ni « Voir des parcours proches » (sa zone n'est pas connue), jamais la ligne d'erreur avec « Réessayer ».
  • Chargement : ce qui est déjà connu (photo, titre, note, créateur, tuiles) s'affiche tout de suite ; description et étapes en barres grises, sans spinner ; les boutons restent actifs, un tap attend la fin du chargement.
  • Erreur : la partie connue reste affichée ; à la place de la description, ligne discrète grise (nuage barré) « Impossible de charger le détail du parcours » et « Réessayer » ; hors connexion, même ligne avec le wifi barré et « Hors connexion ». Les boutons restent actifs, un tap relance le chargement.
  • Texte agrandi (repris en D-047) : titre sur deux lignes ; note, avis et créateur passent à la ligne ; tuiles d'infos, pastilles sur la photo et barre collée plafonnées à 1,3 (les deux boutons restent côte à côte) ; tuiles à largeur selon leur contenu (flexGrow: 1, flexBasis: 'auto') pour tenir sur une ligne ; colonne des heures en largeur minimale de 44 px qui s'élargit avec le texte ; « Voir sur la carte » passe sous le titre de section quand la place manque (flexWrap) ; noms d'étape sur plusieurs lignes, jamais coupés ; le titre de la barre du haut reste sur une ligne et se coupe (il répète le titre de la fiche et se lit en entier). Encart d'un parcours Premium (D-074) : « Débloquer ce parcours » et son prix sur deux lignes, prix dessous, sans le point ; le lien du pass sur deux lignes. La photo garde ses 380 px ; aucun nouveau reflow sur fontScale. Règles : Direction-Artistique › Accessibilité.
  • Lecteur d'écran : dialogue « Fiche du parcours {titre} », focus sur le titre à l'ouverture, geste d'échappement pour fermer ; photos en élément ajustable « Photo 1 sur 6 » ; infos clés en liste ; étape en bouton avec état déplié (« Étape 2 sur 4, 10 heures 35, Musée de Montmartre et jardins Renoir, Musée, 2 heures 30, replié ») ; étape verrouillée lue « …, réservée à Premium », pas un bouton ; « Réserver » annoncé comme lien vers le site du lieu ; chaque avis « note 5 sur 5 » ; lignes d'état en status ; description en chargement busy. Tableau complet des libellés et contrastes : contrôle accessibilité.
  • Parcours traduit (D-076, ticket #203, choix d'Ilan) : un parcours écrit dans une autre langue que celle de l'app (français ou anglais, D-062) se lit dans sa traduction (route_translations). Sous la description : « Traduit automatiquement de l'anglais » (la langue d'origine est nommée) et, à droite, « Voir l'original ». Cette bascule vaut pour tout le parcours : titre, description, conditions, À prévoir, textes des étapes et parcours en cours (E-07) ; la ligne devient « Texte d'origine, en anglais » et le lien « Voir la traduction ». Le choix est gardé sur le téléphone, pour ce parcours seulement. Ne se traduisent jamais : noms des lieux, étiquettes (Pour qui, Conditions, En pratique, qui restent dans la langue de l'app), chiffres, audio. Un parcours lu dans sa langue d'origine ne change pas : ni ligne, ni lien. Style : Direction-Artistique › Traduction automatique.
  • Avis traduits (D-076, choix d'Ilan : traduits d'office, bascule globale) : sous la note, « Avis traduits automatiquement » et « Voir les originaux », dès qu'un avis au moins est dans une autre langue ; sous le prénom d'un avis traduit, « 17 sept., traduit de l'anglais ». « Voir les originaux » montre chaque avis dans sa langue (« Avis dans leur langue d'origine », « Voir les traductions ») ; choix gardé pour les avis de ce parcours, indépendant de celui du parcours. Un avis est traduit à sa première lecture, puis gardé en cache (review_translations).
  • Traduction, texte agrandi et lecteur d'écran (D-076) : la ligne suit le réglage ; l'action passe dessous, à droite, quand elle ne tient plus (D-039). La ligne est lue comme texte après la description ; « Voir l'original, bouton, afficher le texte d'origine, en anglais » ; après la bascule, le focus reste sur le bouton et « Texte d'origine affiché » est annoncé (status). Les textes d'origine sont balisés dans leur langue (lang, accessibilityLanguage), pour que le lecteur d'écran change de voix. Contrôle : contrôle accessibilité de la traduction, aucun couple en échec.
  • Transitions (D-030) : ouverture depuis une card (M-01), sinon modale (M-02) ; de la photo à la barre (M-10) ; étape dépliée (M-08) ; « Voir l'étape » : défilement animé en 350 ms puis dépli ; carrousel photo au doigt ; favori (M-12) ; « Programmer » et « C'est parti » (M-02) ; créateur (M-03).
  • Report de l'éditeur (D-052, ticket #181) : crédit d'une photo libre de Wikimedia Commons, choix d'Ilan : « © J. Moreau » court et toujours visible, discret (pastille encre à 40 %, texte blanc à 72 %, retour d'Ilan), l'appui ouvre une bulle « Photo de J. Moreau », « Licence CC BY-SA 4.0 », « Voir sur Wikimedia Commons » ; les photos des créateurs n'en ont pas (couverture : à gauche de « 1 / 6 » ; photo d'une étape dépliée : en bas à droite) ; « Lien affilié » en petit texte gris sous « Réserver » quand le créateur a coché « C'est un lien affilié » ou pour un lien partenaire de Widoo (choix d'Ilan, mention gardée après vérification : LCEN art. 20, DSA art. 26) ; étape éphémère : « Jusqu'au 17 janv. » sur la ligne de l'étape, après la catégorie, et « Jusqu'au dimanche 17 janvier 2027 » sous les horaires (l'année seulement si ce n'est pas l'année en cours) ; trajet dit par son mode : « 20 min en métro (1,4 km) », icône du mode, le détail reste à Google Maps ; « En pratique » : accès calculé, « Métro Abbesses, ligne 12 » et « à 50 m du départ » ; la date de fin passée, le parcours est à corriger : ligne ambre « Une étape s'est terminée le 17 janvier » sous les tuiles, « Voir l'étape », comme un lieu signalé. Détail : composants du report.

E-06 — Programmer

🟢 Validé le 2026-09-25 (planches 1 à 3 du ticket #73 : sheet de programmation, lieu fermé, autre date, sortie programmée, D-035 ; états, D-038 ; texte à 150 % et contrôle accessibilité, D-039) ; report de l'éditeur validé le 2026-09-26 (ticket #181, D-052) ; programmer pendant un pass validé le 2026-09-29 (ticket #210, planche 2, D-073) · jour et heure · préparation et programme · lieu fermé à l'arrivée · autre date · sortie programmée · sans compte · modifier une sortie · programme indisponible · hors connexion · texte agrandi, jour et heure · texte agrandi, programme · texte agrandi, lieu fermé · texte agrandi, autre date · contrôle accessibilité · composants · composants, états · lien affilié, étape éphémère, métro · après la date de fin · après la fin du pass · texte agrandi, pass terminé avant la sortie · composants du report · Claude Design

  • Rôle : fixer le jour et l'heure d'une sortie et la préparer.
  • Ouverture : « Programmer » dans la barre collée de la fiche (E-05) ouvre une sheet modale sur la fiche (choix d'Ilan, M-05), sans croix : on la ferme en glissant vers le bas ou sur le voile. Sans compte, la sheet E-10 d'abord, « Connectez-vous pour programmer ce parcours » ; après la connexion, la sheet Programmer s'ouvre (D-038). Parcours Premium sans abonnement ni pass : pas de « Programmer » (D-014), sauf s'il a été débloqué à l'unité.
  • En-tête : « Programmer la sortie » et le titre du parcours.
  • Quel jour ? : chips « Aujourd'hui », « Demain », le surlendemain (« Dim. 27 ») et « Autre date » ; le jour choisi en encre avec une coche, comme une chip active. « Autre date » ouvre un calendrier dans la sheet (étape suivante, fondu) : titre « Choisir une date » avec retour, mois par mois, jours passés inactifs, jour choisi en encre, bouton « Choisir le samedi 10 octobre », mention « Les horaires des lieux sont vérifiés pour la date choisie. ».
  • Départ : l'heure au centre d'une pilule gris chaud, moins et plus par 15 min (disques blancs de 44 px) ; un appui sur l'heure ouvre la roue du système. Heure proposée : le départ conseillé du parcours.
  • Ouverture des lieux : ligne verte « Fin vers 17:00. Tous les lieux seront ouverts. » quand tout est ouvert. Lieu fermé au jour ou à l'heure choisis (choix d'Ilan : prévenir et proposer) : alerte ambre (alert sur alert-soft) « Café Lomi sera fermé à votre arrivée », « Vous arriveriez vers 18:25, il ferme à 18:00. », avec une suggestion chiffrée soulignée (« Partir à 14:00 », qui règle l'heure, alignée à droite, D-039) ; l'étape est marquée « Fermé à votre arrivée (ferme à 18:00) » dans le programme. On peut programmer quand même. Lieu fermé ce jour-là : même alerte (« Fermé le lundi ») avec le prochain jour où tout est ouvert.
  • Pendant un pass (D-073, #210, choix d'Ilan : alerte et déblocage) : parcours Premium programmé pour une date après la fin du pass : alerte ambre au sablier (hourglass-medium), comme une étape qui se termine avant la sortie (D-052), « Votre pass se termine avant cette sortie », « Il prend fin le lundi 5 octobre à 18:40. Le 10, ce parcours sera de nouveau réservé à Premium. », bouton blanc cerclé (control-border, 44 px) « Débloquer ce parcours · 1,99 € » : achat direct, toast « Parcours débloqué », l'alerte disparaît. On peut programmer quand même. Jamais d'alerte pour un abonné.
  • À préparer : toujours avant le programme, ici et dans « Votre sortie » (retour d'Ilan) : réservations conseillées (« Réserver le Musée de Montmartre », « Conseillé le week-end, 15 € par pers. », lien « Réserver » vers le site du lieu) et conseils du parcours (« Prévoir des chaussures confortables ») ; cases de 24 px à cocher, compteur « 1 sur 2 ».
  • Le programme : la timeline de la fiche recalculée pour le jour et l'heure choisis (voir Orchestration) : heure, pastille de catégorie, nom, catégorie, durée, trajet à pied, « Fin prévue vers 17:00 ».
  • Programmer : bouton bleu collé en bas, qui dit le jour et l'heure (« Programmer samedi 26 à 10:00 ») ; en défilant, la sheet s'étire jusque sous la barre d'état. Ensuite : la sheet se ferme, toast « Sortie programmée », « Samedi 26 septembre à 10:00 », avec « Voir » (ouvre « Votre sortie ») ; sur la fiche, « Programmer » devient la date (« Sam. 26, 10:00 », icône calendrier coché) et ouvre « Votre sortie ».
  • Rappels : notification la veille à 18:00 et une heure avant le départ. Au premier « Programmer », tant que le téléphone n'a jamais posé la question, la sheet « Recevoir un rappel ? » demande l'autorisation (E-18, D-060).
  • Modifier une sortie (D-038) : « Changer » dans « Votre sortie » rouvre la même sheet, titrée « Modifier la sortie », avec le jour et l'heure de la sortie ; le bouton dit le changement (« Déplacer au dimanche 27 à 11:00 ») ; ensuite toast « Sortie déplacée » avec « Voir », rappels recalés.
  • États (D-038) : programme indisponible (calcul des heures en échec) : bloc surface « Programme indisponible pour l'instant » à la place du programme, « Réessayer » aligné à droite ; on peut programmer quand même, les heures et l'ouverture des lieux sont vérifiées à l'ouverture de « Votre sortie ». Hors connexion : ligne discrète en tête (« Hors connexion. Les horaires des lieux ne peuvent pas être vérifiés. »), jour, heure et préparation lisibles, bouton « Programmer » inactif et « Reconnectez-vous pour programmer la sortie. ».
  • Transitions : sheet modale (M-05) ; « Autre date » en étape suivante dans la sheet (fondu enchaîné et hauteur) ; toast (M-06).
  • Texte agrandi (D-039, repris en D-047) : la sheet s'arrête sous la barre d'état ; chips des jours plafonnées à 1,3, sur deux rangées ; heure à 29 px ; titres de section en flexWrap, la valeur (« 1 sur 2 », « Départ 10:00, fin vers 17:00 ») passe dessous ; « Réserver » passe sous le libellé, à droite ; colonne des heures du programme élargie (règle de E-05) ; bouton collé plafonné à 1,3, sur une ligne ; jours du calendrier dans leurs disques de 44 px. Alerte de fin du pass (D-074) : titre sur deux lignes, bouton de l'alerte à hauteur libre, prix sous le libellé, sans le point ; bouton collé « Programmer samedi 10 à 10:00 ».
  • Lecteur d'écran : dialogue « Programmer la sortie, {titre} » ; chips en boutons à bascule (« Demain, samedi 26 septembre, sélectionné ») ; groupe « Heure de départ » avec « Partir 15 minutes plus tôt » et « plus tard », la nouvelle heure est annoncée ; ouverture des lieux annoncée à chaque changement (status), lieu fermé à l'apparition (alert) ; cases « Réserver le Musée de Montmartre, case à cocher, non cochée » et « Réserver, lien, ouvre le site du lieu » ; programme en liste ; calendrier en grille (« 10 octobre, sélectionné ») ; bouton inactif hors connexion suivi de la phrase qui l'explique. Détail : contrôle accessibilité.
  • Report de l'éditeur (D-052, ticket #181) : « Lien affilié » en petit texte gris sous « Réserver » quand le créateur a coché « C'est un lien affilié » ou pour un lien partenaire de Widoo (choix d'Ilan, mention gardée après vérification : LCEN art. 20, DSA art. 26), aligné à droite dans « À préparer » ; « Jusqu'au 17 janv. » sur la ligne de l'étape dans le programme ; trajet dit par son mode (« 20 min en métro (1,4 km) ») ; programmer après la date de fin d'une étape ou d'un lieu éphémère : alerte de lieu fermé, sablier, « Une étape se termine avant votre sortie », le nom et la date, puis la dernière date possible, qui règle le jour (« Choisir le samedi 16 janvier ») ; on peut programmer quand même. Détail : composants du report.

E-07 — Parcours en cours (Go)

🟢 Validé le 2026-09-25 (planches 1 à 3 du ticket #74 : page immersive, contenu de l'étape, sheet du parcours, carte, mini-lecteur, D-029 ; états, D-033 ; texte à 150 % et contrôle accessibilité, D-034) ; report de l'éditeur validé le 2026-09-26 (ticket #181, D-052) · en route · sur place · en faisant glisser · contenu de l'étape · contenu, suite · arrivée suggérée · carte du parcours · le parcours étiré · mini-lecteur · de la photo au contenu · composants · lancement sans compte · un autre parcours en cours · signaler · signaler, fermé · signaler, autre chose · signalé en un appui · signalé sur place · étape signalée · étape passée · le parcours après une étape passée · retard · dernière étape · arrêter · hors connexion · notification du matin · composants, états · texte agrandi, en route · texte agrandi, sur place · texte agrandi, étape signalée · texte agrandi, contenu de l'étape · texte agrandi, le parcours étiré · texte agrandi, mini-lecteur · texte agrandi, signaler · contrôle accessibilité · crédit d'une photo libre · Pratique, jusqu'au, lien affilié · photos libres, trajet en métro · le parcours, jusqu'au, métro · composants du report · Claude Design 🟢 Traduction automatique (ticket #203) : validée le 2026-09-29 (D-076) · étape traduite · bas de l'étape · texte agrandi, parcours traduit · contrôle accessibilité · Claude Design

  • Rôle : accompagner la sortie étape par étape, comme l'écran « En cours de lecture » d'une app de musique : l'étape occupe l'écran, le parcours reste à portée dans une sheet. Widoo ne guide pas : les itinéraires s'ouvrent dans Google Maps.

  • Ouverture : « C'est parti » sur la fiche (E-05) ou Go depuis Parcours › À venir (E-08) ; un parcours non programmé démarre maintenant. Le compte est demandé au lancement (D-029) : sans compte, la sheet E-10 s'ouvre (« Connectez-vous pour lancer ce parcours », dessinée en planche 2) et le parcours démarre une fois connecté. Modale plein écran au-dessus des onglets, qui monte du bas.

  • Page immersive : seule page sombre de l'app (surface-strong, voir Direction-Artistique › Parcours en cours). En haut, la photo de l'étape en plein cadre sur 600 px sous un voile dégradé vers l'encre, renforcé en haut, et un second voile ancré au haut du texte, qui le suit quand le texte grandit (D-034) ; barre d'état en blanc ; sur la photo, disques encre à 40 % : réduire en mini-lecteur (chevron bas, à gauche) et carte du parcours (à droite), titre du parcours au centre.

  • Statut et étape : en route, « En route vers l'étape 1 » (marcheur) ; sur place, « Étape 2 sur 4, vous y êtes » (épingle pleine). Dessous, le nom de l'étape (30 px) et une ligne : « Balade, 20 min, à 900 m de vous » en route, « Musée, 2 h 30 prévues, jusqu'à 13:10 environ » sur place.

  • Progression : façon lecteur : un segment par étape, pastille de 12 px à la position actuelle, « Départ 10:00 » à gauche et « Fin vers 17:00 » à droite.

  • Commandes (ordre et style fixes) : en route, « Itinéraire » à gauche (verre blanc à 14 %, Google Maps à pied jusqu'à l'étape) et « J'y suis » à droite (blanc). Sur place, « Tout allait bien ici ? » avec Oui et Signaler (verre), ignorable, puis un seul bouton blanc « Étape suivante : Café Lomi ». Sous les commandes, « Découvrir l'étape » (caret bas) dit que la page continue ; un appui fait défiler jusqu'aux sections.

  • Arrivée : manuelle, par « J'y suis » (D-029). App ouverte, à moins de 100 m de l'étape (seuil proposé), la pastille bleue « Vous semblez être sur place » apparaît au-dessus du statut ; rien ne se valide seul et il n'y a pas de localisation en arrière-plan.

  • Vérification : Oui confirme le lieu (poids 2, voir Creation-et-Moderation) ; Signaler ouvre le choix du motif (planche 2). Un lieu sans réponse est reproposé dans E-15.

  • Contenu de l'étape : une seule page qui défile. Tout monte ensemble, la photo défile plus lentement et s'assombrit (jusqu'à 65 %, D-034) ; quand le titre passe sous la barre du haut, un en-tête compact encre apparaît (vignette, nom, statut ; réduire et carte restent). Glisser vers le bas ou toucher l'en-tête ramène la photo. Sections en cartes surface-strong-raised de rayon 20, titres 17 px, dans cet ordre :

    • Pratique : « Ouvert » en vert et horaires du jour, prix, réservation et « Réserver », vérification (« Vérifié par 12 visiteurs le 20 sept. ») ;
    • Écouter : hors MVP (décision d'Ilan, D-029) ; la maquette montre la section, l'app ne la construit pas ;
    • Le mot de {prénom} : texte libre du créateur, 6 lignes puis « Lire la suite » ;
    • À ne pas manquer : 1 à 3 points numérotés ;
    • En images : jusqu'à 5 photos, en défilement horizontal ;
    • Ensuite : étape suivante (nom, catégorie, durée, heure prévue), trajet à pied, « Le chemin de {prénom} » quand le créateur a écrit une note de transition, et, sur place, le bouton « Étape suivante ».

    Pratique et Ensuite viennent du lieu, du parcours et de l'orchestration ; le créateur n'écrit que le reste, dans l'éditeur (E-12), et tout y est facultatif : une section vide n'apparaît pas.

  • Sheet « Le parcours » : entrouverte en bas de la page, elle montre le haut de la même liste qu'une fois étirée, jamais un autre contenu. Titre, « Départ 10:00, fin vers 17:00 », puis la timeline de la fiche : heure, pastille de catégorie, nom, état (« Fait à 10:22 » et coche verte, « Vous y êtes » ou « Prochaine étape » en bleu, à venir), trajet à pied entre deux étapes, « Fin prévue vers 17:00 ». Étirée (jusqu'à 110 px du haut, page voilée derrière), elle finit par « Terminer la sortie » (bleu, vers E-15) et « Arrêter le parcours » (lien, sans note, alerte de confirmation). Plus de lien Google Maps pour tout le parcours (D-032).

  • Google Maps : étape par étape seulement (D-032) : « Itinéraire » ouvre Google Maps à pied jusqu'à l'étape suivante ; plus de lien pour tout le parcours. URL construite côté serveur (/me/planned/:id/maps-url, voir Orchestration).

  • Carte du parcours : le disque carte pousse une page par-dessus l'étape. Carte plein écran qui passe sous la sheet : étapes numérotées aux couleurs de leur famille, étape faite cochée, étape en cours sélectionnée, votre position en bleu ; flèche retour en haut à gauche, titre du parcours au centre ; bloc encre de l'étape en cours (statut, nom, commande du moment) posé au-dessus de la sheet, qui reste la même.

  • Mini-lecteur : « Réduire » replie E-07 en une barre encre de 64 px au-dessus de la barre d'onglets, sur tous les onglets : photo, statut, nom de l'étape, fine barre de progression, ombre de la barre d'onglets. Un appui rouvre E-07. Sur l'accueil, la sheet au repos et les boutons de la carte remontent de sa hauteur.

  • Transitions (M-02, M-03, M-04, M-08, M-10, M-11, M-12 ; voir Direction-Artistique › Mouvement) :

    • ouverture et réduction : la modale monte du bas, comme la fiche ; « Réduire », ou glisser vers le bas quand la photo est en haut, la fait descendre et se fondre dans le mini-lecteur ; un appui sur le mini-lecteur la fait remonter ;
    • de la photo au contenu : défilement continu, photo à demi-vitesse (parallaxe) sous un voile qui fonce, en-tête compact en fondu quand le titre passe sous la barre du haut ; « Découvrir l'étape » lance le même défilement, animé ;
    • carte : page poussée de droite à gauche par-dessus l'étape, retour de gauche à droite par la flèche ou par le geste retour depuis le bord gauche ;
    • sheet : deux crans (entrouverte, étirée) ; elle suit le doigt et se cale sur le cran le plus proche, le voile de la page suit sa hauteur ;
    • changement d'étape : après « J'y suis » ou « Étape suivante », statut, nom et photo changent en fondu enchaîné, la pastille de progression glisse, la ligne de la timeline change d'état ;
    • pastille « Vous semblez être sur place » : fondu et léger glissé vers le bas ;
    • réglage système « Réduire les animations » : fondus seulement, sans parallaxe ni glissé.

    Durées et courbes : mappings.motion (D-030).

  • États (planche 2, D-033) :

    • lancement sans compte : « C'est parti » ouvre la sheet E-10 « Connectez-vous pour lancer ce parcours » ; une fois connecté, E-07 s'ouvre ; fermer la sheet ne lance rien ;
    • un seul parcours à la fois : en lancer un autre ouvre l'alerte système « Un parcours est déjà en cours » (« Arrêter « {titre} » et lancer celui-ci ? Vous le retrouverez dans vos parcours passés. », « Annuler » et « Arrêter et lancer ») ;
    • signaler sur place (façon Waze, demande d'Ilan, D-036) : sheet « Qu'est-ce qui ne va pas ? » avec le nom du lieu et une grille de sept motifs (disques gris chaud de 72 px, icône Phosphor pleine en couleur, libellé dessous) : Fermé, Horaires faux, Mal placé, Travaux ou accès difficile, Complet ou longue attente, Plus comme décrit, Autre. Un appui envoie, sauf Fermé (précision « Aujourd'hui », « Temporairement », « Définitivement », choix entouré de bleu avec une coche, puis « Annuler » ou « Signaler ») et Autre (« Autre chose ? », texte de 80 caractères, « Lu par l'équipe Widoo, jamais publié. », « Signaler » inactif tant qu'il est vide). Sans croix ; même sheet dans E-15 et depuis la fiche (E-05). Ensuite « Signalé : fermé temporairement » (ou le motif) à la place de la question, toast « Merci, c'est signalé. » avec « Annuler », point « ! » ambre sur la pastille dans la sheet ; la sortie continue ;
    • étape signalée fermée par d'autres visiteurs (choix d'Ilan) : alerte d'étape ambre au-dessus du titre (« Café Lomi est peut-être fermé », « Signalé par 2 visiteurs aujourd'hui, à 11:40. Vérifiez avant d'y aller. ») avec « Passer cette étape » ; les commandes ne changent pas ;
    • étape passée : sans confirmation ; cap sur l'étape suivante, heures et fin recalculées, segment de progression à 45 %, toast « Café Lomi passé » avec « Annuler » ; dans la timeline, tiret à la place de l'heure et « Passée », trajet direct vers l'étape suivante. Une étape passée ne compte pas comme faite mais n'empêche pas de noter (précision d'Ilan) ;
    • retard (choix d'Ilan) : heures et fin recalculées à chaque étape ; alerte d'étape quand l'étape sera fermée à l'arrivée ou laissera moins de la moitié du temps prévu (« Café Lomi ferme à 16:00 », « Vous arriverez vers 15:50, il restera 10 min. ») avec « Passer cette étape » ; sinon seule « Fin vers » change ;
    • dernière étape : sur place, le bouton devient « Terminer la sortie » (blanc, drapeau), vers E-15 ;
    • arrêter : alerte système « Arrêter le parcours ? », « Vous le retrouverez dans vos parcours passés, avec les étapes déjà faites. », « Continuer » et « Arrêter » ; le parcours rejoint les parcours passés, marqué « Arrêté », sans note, relançable (choix d'Ilan) ; E-07 et le mini-lecteur se ferment ;
    • hors connexion (choix d'Ilan) : tout le parcours est gardé sur le téléphone au lancement (textes, photos, timeline) ; pastille « Hors connexion, la sortie continue » sous la barre du haut ; J'y suis, Oui et Signaler sont gardés (« Réponse gardée, envoyée au retour du réseau ») ; « Itinéraire » ouvre Google Maps, qui gère seul le hors connexion ;
    • clôture automatique : une sortie restée ouverte se clôt à 4:00 le lendemain ; à 10:00, notification « Comment était « {titre} » ? », « Votre sortie d'hier est close. Une note aide les prochains visiteurs. », qui ouvre E-15 ; envoyée seulement si la note est possible et pas encore donnée ;
    • toasts : posés sur la sheet blanche, jamais sur la page sombre ;
    • parcours Premium : rien de particulier ; si l'abonnement prend fin pendant la sortie, elle continue jusqu'au bout ; relancer un parcours Premium sans abonnement ouvre E-17.

  • Parcours traduit (D-076, ticket #203, choix d'Ilan) : les textes de l'étape (Le mot de {prénom}, À ne pas manquer, Le chemin de {prénom}, note de réservation) suivent la bascule de la fiche (E-05). En bas du contenu de chaque étape, sous Ensuite : « Traduit automatiquement de l'anglais » (on-strong-muted) et « Voir l'original » (info-on-strong, comme les liens de E-07), qui bascule tout le parcours, fiche comprise. L'audio n'est jamais traduit : sa langue est dite sous son titre (« En anglais, à écouter en marchant ») et dans le libellé du bouton (« Écouter Emma, en anglais, 1 minute 40 ») ; « Écouter » reste hors MVP (D-029). Hors connexion, la traduction et l'original sont gardés au lancement : la bascule marche sans réseau. Texte agrandi : la ligne sur deux lignes, action à droite ; dans Ensuite, « Étape suivante : Café Lomi » plafonné à 1,3 passe sur deux lignes centrées, le nom du lieu d'un seul bloc (espace insécable). Lecteur d'écran : la ligne est lue à la fin du contenu de chaque étape ; textes d'origine balisés dans leur langue.

  • Texte agrandi (D-034, repris en D-047) : le bloc de la page immersive (statut, nom, ligne, progression, commandes) grandit vers le haut sur la photo, qui ne change pas ; le voile ancré au haut du texte le suit ; commandes visibles au repos (choix d'Ilan). « Itinéraire » et « J'y suis » à la largeur de leur contenu, en flexWrap: 'wrap-reverse' : côte à côte en texte agrandi, J'y suis passe au-dessus quand ils ne tiennent plus (choix d'Ilan) ; « Étape suivante : Café Lomi » sur une ligne. « Tout allait bien ici ? », Oui et Signaler passent à la ligne ; l'alerte d'étape grandit, son lien reste sur sa ligne. Barre du haut et en-tête compact plafonnés à 1,3 (titre sur deux lignes, nom de l'en-tête sur trois lignes au plus). Sheet « Le parcours » : titre et horaires passent à la ligne, colonne des heures qui s'élargit (règle de E-05), noms sur plusieurs lignes. Mini-lecteur plafonné à 1,3, nom sur une ligne coupée, nom complet dans son libellé (choix d'Ilan). Sheet « Signaler » : elle monte jusque sous la barre d'état, libellés des motifs sur trois lignes au plus, disques inchangés. Aucun nouveau reflow sur fontScale. Règles : Direction-Artistique › Accessibilité.

  • Contrastes sur photo (D-034) : textes posés sur la photo contrôlés au pire cas (photo remplacée par du blanc sous les voiles). Deux échecs corrigés sur les écrans validés : titre de la barre du haut (1,90:1, voile du haut renforcé : 4,81:1) et statut au-dessus du nom (2,39:1, voile ancré au haut du texte : 8,61:1) ; pendant le défilement, la photo s'assombrit jusqu'à 65 %. Valeurs : mappings.immersive (tokens version 10).

  • Lecteur d'écran : E-07 est un dialogue « Parcours en cours, {titre} » ; focus sur le statut et le nom, lus en un seul en-tête (« En route vers l'étape 1 sur 4. Place des Abbesses. Balade, 20 minutes, à 900 mètres. ») ; « Réduire, le parcours continue, bouton » et « Voir le parcours sur la carte, bouton » ; progression lue comme une barre (« 1 étape faite sur 4, départ 10:00, fin vers 17:00 », « 1 passée ») ; « Itinéraire vers Place des Abbesses, ouvre Google Maps, lien » et « J'y suis, Place des Abbesses, bouton », même ordre de lecture quand ils s'empilent ; « Vous semblez être sur place » annoncé une fois par étape, sans déplacer le focus (choix d'Ilan) ; vérification en groupe, réponse annoncée ; alerte d'étape annoncée à l'apparition, « Passer cette étape, Café Lomi, bouton », toast « Café Lomi passé » avec « Annuler » atteignable ; « Hors connexion, la sortie continue » annoncé une fois ; sheet « Le parcours » ajustable (« Agrandir », « Réduire »), étapes lues avec leur état (« passée », « signalée fermée ») ; mini-lecteur « Parcours en cours, étape 2 sur 4, {nom}, vous y êtes. Rouvrir, bouton » ; sheet « Signaler » en dialogue, motifs en boutons (« Complet ou longue attente, bouton, envoie le signalement »), précision de Fermé en groupe radio, champ de Autre avec son compteur (« 43 caractères sur 80 ») ; alertes système lues par le système. Oui, Signaler, « Passer cette étape » et « Découvrir l'étape » en hitSlop jusqu'à 44 px ; chaque geste a son bouton (Réduire, flèche retour de la carte, « Découvrir l'étape », crans de la sheet). Tableau complet : contrôle accessibilité.

  • Report de l'éditeur (D-052, ticket #181) : crédit d'une photo libre de Wikimedia Commons, choix d'Ilan : « © J. Moreau » court et toujours visible, discret (pastille encre à 40 %, texte blanc à 72 %, retour d'Ilan), l'appui ouvre une bulle « Photo de J. Moreau », « Licence CC BY-SA 4.0 », « Voir sur Wikimedia Commons » ; les photos des créateurs n'en ont pas (photo en grand : sous le bouton carte, en haut à droite ; « En images » : en bas à droite de chaque photo libre) ; Pratique : « Jusqu'au dimanche 17 janvier 2027 » sous les horaires, « Lien affilié » sous « Réserver » en gris clair ; Ensuite et sheet « Le parcours » : trajet dit par son mode, « Jusqu'au 17 janv. » après l'état de l'étape ; « Itinéraire » ouvre Google Maps dans le mode du trajet (à pied, à vélo, en transport, en voiture). Détail : composants du report.

E-15 — Fin de parcours

🟢 Validé le 2026-09-25 (planches 1 à 3 du ticket #74 : écrans, états, texte à 150 % et contrôle accessibilité ; D-029, D-033, D-034) · sortie terminée · note donnée · composants · close automatiquement · sortie partielle · texte agrandi, sortie terminée · texte agrandi, note et lieux · contrôle accessibilité · Claude Design

  • Rôle : clore la sortie, demander une note sans l'imposer, recueillir les vérifications oubliées.
  • Ouverture : « Terminer la sortie » dans la sheet de E-07. Page blanche plein écran dans la même modale, sans croix : on en sort par « Terminer ».
  • Récapitulatif : « Sortie terminée », le titre du parcours, trois tuiles : étapes faites (« 4 sur 4 »), durée de sortie (« 6 h 50 »), heure de fin (« 16:50 »).
  • Note : « Votre note », cinq étoiles de 40 px dans des zones de 52 px, pleines une fois choisies, en contour gris contrôle sinon (D-034) ; avant, « Touchez une étoile. La note est facultative. » ; après, le libellé de la note (Décevant, Moyen, Bien, Très bien, Parfait). Demandée, jamais obligatoire (D-029) : « Terminer » reste actif sans note, et un parcours non noté se note plus tard depuis Parcours › Passés. La note s'ouvre dès que la moitié des étapes est faite, même si d'autres ont été passées (D-033).
  • Commentaire : proposé une fois la note donnée : « Un mot pour les autres ? », facultatif, 280 caractères avec compteur, « Publié avec votre prénom sur la fiche. ».
  • Lieux non vérifiés : s'il en reste, « Ces lieux étaient-ils ouverts ? » et « Vous n'avez pas répondu en chemin. Cela aide les prochains visiteurs. » ; une ligne par lieu (nom, catégorie) avec Oui et Signaler (poids 1,5) ; Signaler ouvre la même sheet que E-07 (D-036).
  • Pas de note personnelle : retirée par Ilan (D-029), ni ici ni dans E-08.
  • Terminer : bouton bleu collé en bas ; enregistre la note, le commentaire et les réponses, ferme la modale ; le parcours passe dans Passés et le mini-lecteur disparaît.
  • Transitions : E-15 remplace E-07 dans la même modale en fondu enchaîné (M-08) ; « Terminer » fait descendre la modale (M-02).
  • États (planche 2, D-033) :
    • close automatiquement : ouverte par la notification du matin ; « Votre sortie d'hier », « {titre}, close automatiquement cette nuit » ; tuiles étapes faites, durée, « dernière étape » ; l'étape passée est rappelée (« Café Lomi passé ») ; note proposée dès la moitié des étapes faites ; lieux non vérifiés : seulement les étapes faites ;
    • sortie partielle : moins de la moitié des étapes faites, pas d'étoiles ; encadré « Note à partir de 2 étapes faites » (« Un parcours se note quand au moins la moitié de ses étapes est faite, même si vous en passez d'autres. Vous pourrez le relancer depuis vos parcours passés. ») ;
    • hors connexion : « Terminer » fonctionne, la note et les réponses partent au retour du réseau ;
    • parcours déjà noté lors d'une sortie précédente : la note existante s'affiche et se modifie (une note par utilisateur et par parcours).
  • Parcours traduit (D-076) : rien ne change sur l'écran ; le titre suit la bascule de la fiche. L'avis est publié dans la langue où il est écrit, puis traduit pour les lecteurs de l'autre langue (E-05).
  • Texte agrandi (D-034, repris en D-047) : tuiles et barre collée plafonnées à 1,3, comme la fiche ; titre, commentaire et lieux passent à la ligne ; compteur « 100 / 280 » jamais coupé ; lieux non vérifiés dans le défilement, « Terminer » collé en bas.
  • Lecteur d'écran : « Sortie terminée » (ou « Votre sortie d'hier ») en en-tête ; tuiles en liste (« 4 étapes faites sur 4 », « 6 heures 50 de sortie », « fin à 16:50 ») ; « Votre note » en groupe radio, chaque étoile « 4 sur 5, Très bien » ; « Un mot pour les autres, facultatif, champ de texte, 100 caractères sur 280 » ; « Oui, Café Lomi était ouvert, bouton » et « Signaler Café Lomi, bouton » ; « Note à partir de 2 étapes faites » lu comme texte ; « Terminer, bouton ». Oui et Signaler des lieux en hitSlop jusqu'à 44 px. Ouverte par la notification, focus sur le titre. Tableau complet : contrôle accessibilité.

E-16 — Profil public de créateur

🟢 Validé le 2026-09-24 (planches 1 à 3 du ticket #72 : écrans, états, texte à 150 % et contrôle accessibilité ; D-023, D-025 et D-028), révisé le 2026-10-14 (D-091 : sorties sur ses parcours) · profil public · créateur certifié · profil minimal · profil de Widoo · chargement · erreur · indisponible · composants · composants, planche 2 · texte agrandi, profil public · texte agrandi, créateur certifié · contrôle accessibilité · Claude Design

  • Rôle : voir qui a créé un parcours, lui faire confiance et découvrir ses autres parcours.
  • Ouverture : depuis « Par Camille » sur une card ou « Voir le profil » dans une fiche (E-05). Même page que E-09, sans « Modifier le profil » ni encarts ; en haut, retour et partager le profil.
  • Contenu : en-tête (photo ou initiale, prénom, badge Créateur certifié s'il l'a, quartier et ancienneté, bio), chiffres (seulement ceux qui existent), À la une (les parcours choisis par le créateur, section absente s'il n'en a choisi aucun), anecdotes intercalées, « Tous ses parcours » triables et filtrables par ambiance comme sur E-09. Aucun bouton de contact ni d'abonnement au MVP.
  • Sur le terrain (D-056) : comme mon profil (E-09), avec « Confirmés pendant ses sorties. Les prochains visiteurs savent à quoi s'attendre. » ; absente à zéro.
  • Créateur certifié : appui sur « Créateur certifié » ou sur le sceau, pour un visiteur comme sur son propre profil : sheet « Créateur certifié », « Camille propose des parcours fiables : elle remplit les critères de Widoo. », les trois critères cochés avec les valeurs du créateur (8 parcours vérifiés, note 4,8, 23 sorties sur ses parcours ; D-091), « Critères vérifiés chaque nuit. L'équipe Widoo peut aussi attribuer ou retirer le badge. », bouton « Compris » ; on ferme aussi en glissant vers le bas.
  • Profil minimal : initiale, prénom, ancienneté ; seul chiffre « 1 parcours publié » (au singulier) ; ni bio, ni anecdotes, ni badge, ni À la une ; « Ses parcours (1) » sans tri ni filtre (ils apparaissent à partir de 4 parcours). Card d'un parcours sans avis : pastille « Nouveau » à la place de la note, pas de Vérifié tant qu'il n'est pas vérifié.
  • Sans parcours publié : un visiteur n'y arrive pas depuis l'app ; par un lien, il voit l'en-tête et « Aucun parcours publié pour l'instant ».
  • Profil de Widoo : ouvert depuis « Par Widoo » : logo à la place de l'avatar, sceau certifié à droite du nom (pas de pastille Signature sur le profil, retouche d'Ilan), « L'équipe Widoo, à Paris », bio éditoriale ; chiffres : parcours publiés et note, pas de sorties sur ses parcours pour un compte d'équipe ; À la une et tous les parcours comme pour un créateur.
  • Chargement : l'initiale et le prénom, connus par la card ou la fiche, s'affichent tout de suite ; le reste en barres grises, sans spinner. Même traitement pour mon profil au premier chargement.
  • Erreur : photo et prénom gardés quand on les a, puis bloc centré (nuage barré, « Impossible de charger le profil », « Vérifiez votre connexion puis réessayez. », « Réessayer »). Hors connexion : wifi barré, « Hors connexion », « Le profil s'affichera au retour du réseau. ».
  • Profil indisponible : profil masqué ou compte supprimé, ouvert par un lien partagé ou une notification : bloc centré (œil barré, « Ce profil n'est pas disponible », « Il a été masqué ou le compte a été supprimé. », « Explorer les parcours » vers l'accueil). Depuis l'app on n'y arrive pas : la ligne créateur devient « Par Membre Widoo », icône neutre, sans appui ni sceau.
  • Texte agrandi (repris en D-047) : comme mon profil (E-09) : chiffres en trois colonnes, libellés sur deux lignes ; cards traitées comme sur E-01. Sheet Créateur certifié plus haute que l'écran : elle s'arrête sous la barre d'état, son contenu défile et « Compris » reste collé en bas avec un filet. Aucun nouveau reflow sur fontScale. Règles : Direction-Artistique › Accessibilité.
  • Lecteur d'écran : « Retour, bouton » ; « Partager le profil de Camille, bouton » ; identité en un seul élément (« Camille, créateur certifié, Paris 11e, sur Widoo depuis mars 2026 ») ; chiffres en liste ; sheet Créateur certifié en dialogue, un élément par critère (« 3 parcours vérifiés ou plus, 8, rempli ») ; chargement busy, erreur et profil indisponible en status ; « Par Membre Widoo » lu comme texte, sans action vers le profil. Tableau complet : contrôle accessibilité.
  • Transitions (D-030) : page poussée depuis la fiche ou une card (M-03) ; sheet Créateur certifié (M-05) ; chargement (M-09).

E-17 — Premium

🟢 Validé en entier le 2026-09-25 (ticket #75, planches 1 à 3 : page Premium, piste A, D-040 ; états de l'achat, D-044 ; texte agrandi, contrôle accessibilité et ruban encre, D-046) ; trois formules validées le 2026-09-29 (ticket #210, planche 1 : pass 7 jours, déblocage à l'unité, D-072 ; pendant un pass, planche 2, D-073 ; états, texte agrandi et contrôle accessibilité repris avec les trois formules, planche 3, D-074) · depuis un parcours, visiteur · seulement ce parcours · depuis un encart, résident · pendant un pass · achat en cours · achat réussi · achat impossible · achat en attente · essai déjà utilisé · restauration · rien à restaurer · hors connexion · texte agrandi · texte agrandi, les formules · texte agrandi, encart · texte agrandi, achat impossible · contrôle accessibilité · Claude Design

  • Rôle : présenter l'abonnement quand on le demande ou quand on en a besoin, avec une page qui donne envie. Tout est gratuit, favoris, programmations et création compris, sauf les parcours Premium (D-023, création gratuite depuis le 28 septembre, D-072).
  • Ouverture : « Débloquer avec Premium » et l'encart d'un parcours Premium (E-05, E-04) ; « Débloquer avec Premium » d'une sortie Premium programmée après la fin de l'abonnement (E-08, D-038) ; « De passage à Paris ? Pass 7 jours, 2,99 € » de l'encart d'un parcours Premium, qui ouvre E-17 pass présélectionné (D-072) ; « Prolonger », dans les Réglages pendant un pass et dans le toast de fin du pass (D-073) ; l'encart Widoo Premium (en tête des Réglages, en bas de mon profil et de Modifier le profil, pour un compte gratuit).
  • Forme (choix d'Ilan, D-040) : page plein écran qui monte du bas (M-02), sans barre d'onglets, croix « Fermer » en haut à gauche. Seule page au fond bleu de l'app (blue), avec le ruban du logo en grand, encre à 16 %, en filigrane (ruban-widoo.svg) ; textes en blanc. Le ruban était blanc à 16 % jusqu'à la planche 3 : le texte blanc qui passait dessus tombait à 3,40:1 ; en encre, le pire cas est à 5,65:1 (choix d'Ilan, D-046).
  • Haut de page selon l'ouverture : depuis un parcours, sa photo inclinée avec la pastille Premium et « Débloquez les 3 autres étapes » (le nombre suit le parcours), « « {titre} » et tous les parcours Premium, en entier » ; depuis un encart, trois photos, « Widoo Premium », « Tous les parcours Premium en entier, pour un séjour ou toute l'année. » (E-17 ne s'ouvre plus depuis « Créer un parcours », D-072).
  • Avantages (D-072) : un seul, dans un disque de verre, sous les formules depuis un encart : « Tous les parcours Premium, en entier » (couronne dorée), « Toutes les étapes, programmables, avec le départ guidé. » ; depuis un parcours, le titre le dit déjà. « Création de parcours sans limite » est retiré (création gratuite).
  • Formules (D-072, #210, variante A choisie par Ilan) : trois cartes sur le même plan, groupe radio, carte choisie blanche, les autres plus sombres : « Pass 7 jours », « 2,99 € », « une seule fois », pastille « Idéal pour un séjour » (blue-soft, texte blue-ink) ; « Annuel », « 29,99 € par an » (le montant facturé est le plus visible), « soit 2,50 € par mois » en petit, pastille dorée « Le plus avantageux » ; « Mensuel », « 3,99 € par mois ». Depuis un parcours, en plus, une ligne plus basse (52 px) « Seulement ce parcours », « 1,99 € ». Le pass est une vraie formule, jamais une petite ligne (demande d'Ilan : touristes et gens de passage). Ordre et présélection selon le profil, calculés sur le téléphone, rien n'est envoyé : visiteur (téléphone réglé dans une autre langue que le français, ou région hors de France) : pass en tête et présélectionné, puis annuel, mensuel ; sinon annuel en tête et présélectionné, puis mensuel, pass. Le lien du pass de l'encart d'un parcours présélectionne le pass. Prix lus dans le store, jamais en dur. Écartée : deux profils en onglets (« De passage », « J'habite ici »), rangée dans le Sandbox.
  • Essai et achat : essai gratuit de 7 jours sur les deux abonnements (choix d'Ilan). La ligne au-dessus du bouton et le bouton surface-strong à couronne dorée suivent la formule choisie : abonnement, « 7 jours gratuits, puis 29,99 € par an. Sans engagement, annulable jusqu'à 24 h avant la fin de l'essai. » et « Essayer gratuitement » ; pass, « 2,99 € une seule fois. Premium pendant 7 jours, sans abonnement : rien ne se renouvelle. » et « Prendre le pass 7 jours » ; parcours seul, « 1,99 € une seule fois. Ce parcours reste débloqué, sans limite de durée. » et « Débloquer ce parcours ». Acheter ne demande pas de compte (règle 5.1.1(v) d'Apple : pas de connexion imposée sans fonction qui l'exige) ; le compte, facultatif, garde les achats sur tous les appareils (D-072). En bas : « Restaurer les achats », Conditions, Confidentialité (exigences des stores).
  • Achat (D-044, choix d'Ilan) : le bouton (« Essayer gratuitement », « Prendre le pass 7 jours » ou « Débloquer ce parcours ») ouvre la fenêtre du store (système) par-dessus E-17 ; dessous, le bouton passe à l'anneau « Achat en cours », croix, cartes et liens inactifs. Annulation dans le store : retour à E-17 sans message. Réussi : E-17 redescend (M-02) et on revient là où on était, l'action faite (fiche débloquée ; encart retiré), toast de succès : abonnement, « Bienvenue dans Premium » (« Toutes les étapes sont débloquées. » depuis un parcours) ; pass, « Pass Premium activé », « Jusqu'au lundi 5 octobre, 18:40. » (7 jours à la minute près) ; parcours seul, « Parcours débloqué », « Les 4 étapes sont à vous. » (D-072). Échec (paiement refusé, erreur du store) : on reste sur E-17, toast d'erreur « Achat impossible », « Le store n'a pas pu finaliser l'achat. », « Réessayer ». En attente d'une validation (contrôle parental, paiement différé) : toast d'information « Achat en attente », « Premium s'activera dès sa validation. » (« Le pass s'activera dès sa validation. » pour un pass, « Le parcours se débloquera dès sa validation. » pour un parcours seul, D-074). Mêmes états pour les quatre formules (D-074).
  • Essai déjà utilisé (choix d'Ilan) : annuel et mensuel seulement, le pass et le parcours seul ne changent pas (D-074) ; selon le droit du compte du store à l'offre d'introduction ; sans ce droit, prix seul, bouton « S'abonner », ligne « 29,99 € par an, renouvelé automatiquement. Sans engagement, annulable à tout moment. » (suit l'abonnement choisi) ; aucune mention de l'essai passé ; même page après un abonnement expiré.
  • Restaurer les achats : le lien passe à l'anneau « Restauration en cours », le bouton est inactif ; abonnement trouvé : comme un achat réussi, toast « Premium restauré » ; pass en cours trouvé : toast « Pass Premium restauré », « Jusqu'au lundi 5 octobre, 18:40. » (D-074) ; les parcours achetés seuls suivent le compte Widoo et ne passent pas par la restauration du store (D-073, correction de D-072) ; rien trouvé : toast d'information « Rien à restaurer », « Aucun pass ni abonnement Widoo sur ce compte App Store. » (D-074 : la phrase dit ce que le store peut rendre) (« Google Play » sur Android) ; erreur : toast « Restauration impossible » avec « Réessayer ».
  • Hors connexion (choix d'Ilan) : page lisible avec les derniers prix connus (squelette s'ils n'ont jamais été chargés) ; « Hors connexion : reconnectez-vous pour acheter. » à la place de la ligne d'offre (« acheter » depuis D-074 : le pass et le parcours seul ne sont pas des abonnements) ; bouton grisé (skeleton, texte muted), « Restaurer les achats » inactif ; tout redevient actif au retour de la connexion, sans message.
  • Déjà abonné : E-17 ne s'affiche jamais.
  • Pendant un pass (D-073) : ouvert par « Prolonger » : sous « Widoo Premium », « Votre pass se termine le lundi 5 octobre à 18:40. Prolongez-le, ou passez à l'abonnement. » ; le pass en tête et présélectionné quel que soit le profil, « Jusqu'au 12 octobre » sous son nom, sans pastille ; un nouveau pass s'ajoute au bout du premier : ligne « 2,99 € une seule fois. 7 jours de plus, jusqu'au lundi 12 octobre, 18:40 ; rien ne se renouvelle. », bouton « Prolonger de 7 jours », toast « Pass prolongé », « Jusqu'au lundi 12 octobre, 18:40. ». Un abonnement pris pendant le pass commence tout de suite.
  • Lecteur d'écran : bouton « Achat en cours » annoncé occupé, « Restauration en cours » annoncé comme état ; toasts annoncés sans déplacer le focus (l'échec en alerte) ; après l'achat, le focus revient sur le titre de la page d'origine.
  • Transitions : page qui monte du bas (M-02), redescend à la fermeture.
  • Texte agrandi (D-046) : au plus grand réglage standard, photo réduite à 96 px de haut (trois photos réduites depuis un encart) ; titres plafonnés à 1,2 ; quatre cartes à hauteur libre, le prix sous le libellé (D-074) ; ligne d'offre et bouton collés, bouton plafonné à 1,3, « Restaurer les achats », Conditions et Confidentialité en fin de page ; quand le contenu passe sous la barre, elle prend le fond blue avec un fondu de 32 px et le haut de la carte Annuel dépasse au premier écran ; toast entier plafonné à 1,3, posé au-dessus de la ligne d'offre. Contrôle : contrôle accessibilité de la révision du freemium (D-074, aucun couple en échec ; il remplace celui du 25 septembre, ancien).

🟡 Brouillon #383 du 2026-10-14, à valider par Ilan, voir Compte-et-Monetisation › Fin de la limite de création : aucune maquette à reprendre ; E-17 garde toutes ses ouvertures, seule la raison liée à la création (create_limit, source create des analytics) disparaît du contrat et du catalogue.

E-08 — Mes parcours (onglet Parcours)

🟢 Validé le 2026-09-25 (planches 1 à 3 du ticket #73 : segments, prochaine sortie, favoris, parcours passés, créations, « Votre sortie », D-035 ; sans compte, vides, actions et statuts, D-038 ; texte à 150 % et contrôle accessibilité, D-039) ; création gratuite, fin de l'abonnement et du pass revues le 2026-09-29 (ticket #210, planche 2, D-073) · à venir · favoris · passés · créés · votre sortie · votre sortie, suite · sans compte · à venir vide · favoris vides · passés vides · créés vides · annuler la sortie · sortie annulée · favori retiré · parcours pas fait · refusé et retiré · abonnement terminé · pass terminé · hors connexion · texte agrandi, à venir · texte agrandi, passés · texte agrandi, créés · texte agrandi, votre sortie · contrôle accessibilité · composants · composants, états · rappels désactivés, 2026-09-28 (#185, D-060) · texte agrandi, rappels désactivés, 2026-09-28 (D-061) · Claude Design

  • Rôle : l'espace personnel : sorties à venir, favoris, parcours passés, créations.
  • Onglet : « Parcours », icône map-trifold, pleine quand l'onglet est actif ; titre de page « Parcours » (30/36 800).
  • Segments : « À venir », « Favoris », « Passés », « Créés » (choix d'Ilan), dans une piste gris chaud, segment actif en encre ; une liste par segment.
  • À venir : la prochaine sortie en grande card (photo avec « Demain, 10:00 », titre, « Samedi 26 septembre, 10:00 à 17:00 environ », « 1 chose à préparer », bouton « C'est parti »), puis « Plus tard » en lignes (photo de 64 px, titre, date et heure). Un appui ouvre « Votre sortie ».
  • Favoris : les cards de liste validées (358 px), cœur plein ; nombre de parcours, les plus récents en premier.
  • Passés : une ligne par sortie : date (« Fait le samedi 19 septembre ») et votre note (étoile, « 5 », « Votre note, Parfait ») ; « Noter » en bouton bleu quand la sortie n'a pas été notée (ouvre E-15) ; parcours arrêté : pastille « Arrêté » et « Relancer » en gris chaud (D-033). Un appui ouvre la fiche. Pas de note personnelle (D-029).
  • Créés : « Créer un parcours » en bleu en tête : la création est gratuite et sans limite (D-073) ; trois parcours en relecture au plus (E-14). Une ligne par création avec son statut en pastille : « Brouillon » (draft, « Modifié il y a 2 jours »), « En relecture » (pending), « Publié » (published, note et nombre de programmations), « À corriger » (changes_requested ou needs_fix, avec la raison), « Privé » (private, « Visible par lien seulement »). Un appui ouvre l'éditeur, ou la fiche pour un parcours publié ou privé. « Refusé » (rejected) en rouge (error-ink sur error-soft), le motif sous le titre et « Reprendre » (le parcours redevient brouillon) ; un appui sur la ligne montre le message de l'équipe. « Retiré » (unpublished, surface, muted, eye-slash) avec la raison ; un appui ouvre l'éditeur (D-038).
  • Votre sortie : page poussée (M-03) depuis À venir, sans barre d'onglets : vignette et titre du parcours ; card de date (« Samedi 26 septembre », « Départ 10:00, fin vers 17:00 », « Changer » qui rouvre la sheet E-06) ; rappels (« Rappel vendredi à 18:00 et samedi à 9:00. » ; sans rappels, refusés ou remis à plus tard : « Rappels désactivés », cloche barrée bell-slash en muted, et « Activer » en blue-ink, qui ouvre la fenêtre du système si elle n'a jamais été montrée, sinon les réglages de Widoo dans le téléphone ; au retour, la ligne des rappels revient, D-060 ; en texte agrandi, sur une ligne, « Activer » à droite, lu « Activer les rappels, bouton », D-061) ; « À préparer » à cocher ; le programme recalculé ; en bas « Voir la fiche du parcours » et « Annuler la sortie » (alerte système à boutons empilés : « Annuler la sortie » en haut, « Garder » en bas ; puis toast « Sortie annulée » avec « Rétablir », D-038). « C'est parti » collé en bas, actif à tout moment (ouvre E-07). « À préparer » reprend « Lien affilié » sous « Réserver » (D-052).
  • Transitions : segments sans animation (la barre d'onglets animée, M-13, ne s'applique pas aux segments) ; « Votre sortie » en page poussée (M-03).
  • Sans compte (D-038) : invitation pleine page, comme le profil sans compte, sans segments : trois photos, « Vos sorties, toutes au même endroit », « Le compte est gratuit. », trois avantages (programmer avec rappels, favoris sur tous les appareils, parcours faits et notés), « Créer un compte ou se connecter » (sheet E-10).
  • Vides (D-038) : bloc centré par segment (disque de 56 px, titre, texte, bouton bleu) : À venir « Aucune sortie prévue » avec « Découvrir des parcours » et « Choisir parmi vos favoris » s'il y en a ; Favoris « Aucun favori pour l'instant » ; Passés « Aucun parcours fait » ; Créés « Aucun parcours créé pour l'instant » (D-073) avec « Créer mon premier parcours » à la place du bouton du haut.
  • États (D-038) : favori retiré d'un appui sur le cœur, sans confirmation, toast « Retiré des favoris » avec « Annuler » ; un parcours programmé dont la date passe sans lancement va dans vos parcours passés : « Pas fait », « Prévu le dimanche 20 septembre », « Reprogrammer » (rouvre la sheet E-06 sur la fiche ; la sortie repart dans À venir à la nouvelle date), ne compte pas comme une sortie terminée ; quand le titre est long, l'action passe sous le texte, alignée à droite (côté pouce, D-039) ; sortie Premium après la fin de l'abonnement ou du pass (révisée le 29 septembre, D-073) : elle reste ; « Votre sortie » montre l'encart de la fiche, « Abonnement Premium terminé » ou « Pass Premium terminé », « La sortie reste programmée. Débloquez ce parcours pour retrouver les étapes et le départ. », « Débloquer ce parcours · 1,99 € » (achat direct) et le lien « Pass 7 jours, 2,99 € » (« Reprendre un pass 7 jours, 2,99 € » après un pass) ; la barre dit « Débloquer avec Premium » (E-17) à la place de « C'est parti », sans « Changer » ; un parcours devenu Premium après la programmation reste ouvert pour cette sortie ; un favori devenu Premium prend sa pastille et se verrouille comme les autres ; hors connexion : tout l'onglet reste lisible, « C'est parti » compris, ligne discrète sous les segments.
  • Texte agrandi (D-039, repris en D-047) : titre « Parcours » à 36 px ; segments plafonnés à 1,3 comme la barre d'onglets (les quatre tiennent) ; titres et dates des lignes sur plusieurs lignes, l'action passe sous le texte, à droite ; pastilles, petits boutons et pastille sur la photo plafonnés à 1,3 ; « Votre sortie » : barre du haut et « C'est parti » plafonnés à 1,3, « Changer » sous la date, à droite.
  • Lecteur d'écran : segments en liste d'onglets « Vos parcours » (« À venir, onglet, 1 sur 4, sélectionné ») ; prochaine sortie en un seul élément avec « C'est parti, bouton » ; chaque ligne est un lien, son action un bouton à part qui nomme le parcours (« Noter, Canal Saint-Martin au fil de l'eau ») ; pastilles lues avec la ligne ; « Créer un parcours, bouton » ; « Changer la date, bouton », « Annuler la sortie, bouton », alerte système lue par le système ; toasts annoncés sans déplacer le focus, action atteignable. Détail : contrôle accessibilité.

E-09 — Mon profil et réglages

🟢 Validé le 2026-09-24 (planches 1 à 3 du ticket #72 : écrans, états, texte à 150 % et contrôle accessibilité ; D-023, D-025 et D-028) ; encart Widoo Premium et Premium dans les Réglages revus le 2026-09-29 (ticket #210, planche 2, D-073) ; chiffre et critère des sorties revus le 2026-10-14 (D-091) · mon profil · suite · tri · fin et Premium · pas encore certifié · certification · profil vide · profil partiel · modifier · modifier, à la une · choisir un parcours · anecdote, question · anecdote, réponse · anecdote, modifier · réglages · réglages, bas · sans compte · réglages, abonné · réglages, pass en cours · parcours débloqués · profil masqué · suppression · suppression, confirmation · compte supprimé · hors connexion · enregistré · erreur d'enregistrement · annuler les modifications · composants · composants, planche 2 · icônes · texte agrandi, mon profil · texte agrandi, suite · texte agrandi, modifier et toast · texte agrandi, réglages · contrôle accessibilité · réglages, mesure d'audience, 2026-09-28 (#185, D-060) · mesure d'audience coupée, 2026-09-28 (D-061) · notifications coupées · texte agrandi, mesure d'audience · texte agrandi, pendant un pass · Claude Design 🟢 « Sur le terrain » (ticket #77) : validé le 2026-09-26 (D-056, D-058) · sur le terrain · texte agrandi · Claude Design

  • Rôle : mon profil tel que les autres le voient, avec « Modifier le profil » ; les réglages sont sur une page secondaire. Un espace perso avec statistiques viendra après le MVP.
  • Haut : titre « Profil » ; à droite, partager mon profil et la roue dentée (Réglages). En-tête centré : photo ou initiale, prénom, sceau bleu et « Créateur certifié » s'il l'est (appui : sheet d'explication, voir E-16), quartier et ancienneté (« Paris 11e, sur Widoo depuis mars 2026 »), bio, bouton gris chaud « Modifier le profil ».
  • Chiffres : en texte, non cliquables : parcours publiés, sorties sur vos parcours (« 23 sorties sur vos parcours », « sur ses parcours » sur E-16 : sorties menées jusqu'au bout par d'autres, une par personne et par parcours, D-091), note moyenne (étoile). Chacun n'apparaît que s'il existe (ni « 0 parcours publiés », ni note sans avis) ; la rangée disparaît s'il n'y a aucun chiffre.
  • À la une : jusqu'à 3 parcours choisis, en cards du carrousel, dans l'ordre choisi. Avec un seul parcours, seulement cette card, sans place vide ; on ajoute ou retire uniquement par Modifier le profil. Section absente s'il n'y en a aucun.
  • Anecdotes : jusqu'à 3, intercalées dans la page : question en petit gris avec des guillemets, réponse en gros sur fond gris chaud.
  • Sur le terrain (D-056, ticket #77) : section entre les anecdotes et « Tous mes parcours », choix d'Ilan parmi trois pistes : carte surface (rayon 16), sceau seal-check au trait green-ink dans un disque blanc de 44 px, « 12 lieux vérifiés sur place », « Confirmés pendant vos sorties. Les prochains visiteurs savent à quoi s'attendre. » Compte les lieux distincts confirmés sur place (E-07) ou après la sortie (E-15). Absente à zéro (choix d'Ilan). Visible aussi par les visiteurs (E-16). Texte agrandi : titre et texte passent à la ligne, le disque de 44 px garde sa taille, en haut de la carte ; au lecteur d'écran, « Sur le terrain, en-tête », puis la carte en un seul élément (D-058).
  • Tous mes parcours : « Tous mes parcours (8) » ; pilule de tri « Récents » qui ouvre la sheet « Trier par » (Récents, Mieux notés, Durée ; même composant que « Voir tout » de E-04 ; choix immédiat, mémorisé pendant la session) ; filtre par ambiance en chips avec le nombre de parcours, seules les ambiances présentes. Tri et filtre se cumulent et n'apparaissent qu'à partir de 4 parcours.
  • Bas : encart Widoo Premium (encre et or, photos de parcours, « Tous les parcours Premium, en entier : un pass de 7 jours à 2,99 €, ou l'abonnement dès 2,50 € par mois. », « Découvrir les formules », révisé le 29 septembre, D-073 : sans la création, devenue gratuite, et le pass nommé en toutes lettres) tant que l'on n'est pas abonné ; il ouvre E-17. Absent pour un abonné, pendant un pass et sur le profil vu par un visiteur.
  • Pas encore certifié : pas de badge ; encart bleu pâle « Devenez créateur certifié » sous l'en-tête, avec ce qui manque (« Plus qu'un parcours vérifié pour y arriver. »). Appui : sheet des trois critères (3 parcours vérifiés ou plus, note moyenne de 4,5 ou plus, 3 sorties sur vos parcours ou plus ; cercle vide ou coche verte et valeur actuelle), « Le badge arrive tout seul dès que les trois critères sont remplis. L'équipe Widoo peut aussi l'attribuer. », bouton « Créer un parcours ». Les visiteurs ne voient ni l'encart ni l'absence de badge.
  • Profil vide et partiel : compte neuf : ni bio, ni chiffres, ni sections. Encart « Complétez votre profil » (« 0 sur 3 ») : ajoutez une photo, écrivez une bio, racontez une anecdote ; chaque ligne ouvre Modifier le profil ; une étape faite passe à « Fait » ; l'encart disparaît quand les trois sont faites. Le quartier, facultatif, n'y figure pas. Dessous, « Mes parcours » vide : « Aucun parcours publié pour l'instant », « Créer mon premier parcours », « La création est gratuite. » (D-073).
  • Modifier le profil : dans la pile du profil, sans barre d'onglets ; « Annuler » à gauche (confirmation si quelque chose a changé), « Enregistrer » à droite. Photo (« Changer la photo » : appareil ou galerie), prénom ou pseudo, bio de 150 caractères avec compteur (« Visible sur votre profil public. »), quartier (« Facultatif. »). Anecdotes (« 2 sur 3 ») : poignée pour réordonner (maintenir et glisser, ou « Monter » et « Descendre » au lecteur d'écran), appui pour modifier, « Ajouter une anecdote » en pointillés. À la une (« 2 sur 3 », « Les parcours montrés en premier sur votre profil, dans cet ordre. ») : croix pour retirer, poignée pour réordonner, place libre « Choisir un parcours ». Encart Widoo Premium en bas pour un compte gratuit. L'e-mail n'est plus ici, il est dans les Réglages.
  • Choisir un parcours : sheet de ses parcours publiés, du plus récent au plus ancien (photo, titre, ambiance, note) ; ceux déjà à la une sont grisés avec « Déjà à la une » ; « + » ajoute le parcours à la place libre et ferme la sheet ; champ de recherche en haut au-delà de 10 parcours publiés.
  • Anecdote : étape 1, sheet « Choisissez une question » : huit questions gérées côté serveur, celles déjà sur le profil grisées avec « Déjà sur votre profil ». Étape 2 : la question, « Changer » pour revenir à la liste, le champ de réponse (150 caractères, compteur), « Ajouter l'anecdote » ; l'anecdote s'ajoute en dernier et n'est publiée qu'avec « Enregistrer ». Appui sur une anecdote existante : même sheet préremplie, « Changer de question » (la réponse est gardée), « Enregistrer », « Supprimer l'anecdote » (alerte système de confirmation, la question redevient disponible).
  • Les huit questions (D-026), dans l'ordre du sheet, avec leur clé technique ; une clé ne change plus une fois en base, seul le libellé peut évoluer :
    1. « Mon quartier pour flâner » · stroll_neighborhood
    2. « Ma sortie idéale un dimanche » · ideal_sunday
    3. « Un bon plan que personne ne connaît » · hidden_gem
    4. « Mon meilleur souvenir à Paris » · best_memory
    5. « Là où j'emmène mes amis de passage » · friends_visiting
    6. « Ce que je ne rate jamais en été » · summer_must
    7. « Mon café pour lire ou travailler » · work_cafe
    8. « Une rue que j'aime sans savoir pourquoi » · favorite_street
  • Réglages : page secondaire ouverte par la roue dentée, retour au profil. En tête, l'encart Widoo Premium pour un compte gratuit ; pendant un pass, la section Premium (D-073, choix d'Ilan) : couronne dorée, « Pass Premium 7 jours », « Jusqu'au lundi 5 octobre, 18:40 », « Prolonger » en blue (E-17) ; dès qu'un parcours a été acheté seul, avec ou sans pass, « Parcours débloqués » (icône lock-open) et leur nombre, qui ouvre la page du même nom : « Achetés un par un, ils restent à vous, sans limite de durée. Votre compte les garde sur tous vos appareils. », les parcours du plus récent au plus ancien (photo, titre, quartier, « Débloqué le 29 septembre »), un appui ouvre la fiche. Compte : e-mail, mode de connexion, interrupteur « Profil public » (« Vos parcours mènent à votre profil. », choix d'Ilan, planche 2). Préférences : notifications, langue, confidentialité (D-063 : l'interrupteur « Mesure d'audience » est passé dans la page Confidentialité, E-19 ; il garde ses règles : « Aide à améliorer l'app. », icône chart-bar, activé si la personne a accepté au premier lancement, coupure immédiate sans confirmation avec le toast « Mesure d'audience coupée », « Plus aucune donnée d'usage n'est envoyée. », rallumage = accord, toast « Mesure d'audience activée » ; D-060, D-061). Notifications coupées dans les réglages du téléphone : la ligne Notifications affiche « Désactivées » en muted, comme Langue affiche « Français » (D-061). Informations : conditions d'utilisation, politique de confidentialité, aide et contact. Session : se déconnecter, « Supprimer mon compte » en encre. Numéro de version en bas. Les lignes E-mail, Connexion, Notifications, Langue, Confidentialité et Informations ouvrent chacune sa page : E-19 (D-062, D-063) ; Langue affiche la langue en cours (« Langue du téléphone » par défaut).
  • Sans compte : trois photos de parcours, « Vos sorties, toutes au même endroit », « Le compte est gratuit. », ce que le compte apporte (gardez vos coups de cœur, programmez vos sorties avec un rappel la veille et le jour même, créez votre premier parcours et partagez votre ville), bouton bleu « Créer un compte ou se connecter » qui ouvre la sheet E-10. La roue dentée reste : langue, confidentialité et informations (E-19, Réglages sans compte, D-063).
  • Abonné (choix d'Ilan : Réglages seulement) : l'encart Premium laisse la place à la section Abonnement : « Widoo Premium », formule et date de renouvellement, « Gérer » ouvre la page d'abonnement du store ; « Parcours débloqués » dessous s'il y en a (D-073). Plus d'encart en bas de mon profil ni de Modifier le profil ; rien de visible pour les autres.
  • Profil masqué : interrupteur « Profil public » désactivé : ligne en haut de mon profil (œil barré, « Votre profil est masqué. Vos parcours affichent « Membre Widoo ». », « Modifier » vers les Réglages) ; plus de bouton Partager. Pour les autres : cards « Par Membre Widoo » sans appui ni sceau, profil introuvable par lien (E-16 indisponible). Badge, chiffres et contenus sont gardés et reviennent quand on réactive.
  • Supprimer mon compte : depuis le bas des Réglages, page sans barre d'onglets : ce qui est effacé (profil, photo et anecdotes ; favoris, sorties et historique ; brouillons et parcours privés), puis l'encart « Vos 8 parcours publiés restent en ligne », signés « Membre Widoo », sans lien vers le profil, avec leurs avis : pas de choix (décision d'Ilan). Sans parcours publié, l'encart disparaît. Pour un abonné, rappel que l'abonnement du store n'est pas résilié, avec « Gérer l'abonnement ». Bouton « Supprimer mon compte » en encre.
  • Confirmation : alerte système iOS « Supprimer votre compte ? », « Vos 8 parcours publiés restent en ligne, signés « Membre Widoo ». Cette action ne peut pas être annulée. », « Annuler » et « Supprimer » (rouge système). Si la session est ancienne, une reconnexion (Apple, Google ou lien e-mail) peut être demandée avant la suppression. Ensuite, retour à l'onglet Profil sans compte avec le toast de succès « Votre compte est supprimé. ».
  • Hors connexion : mon profil affiche la dernière version enregistrée sur le téléphone, avec la ligne « Hors connexion. Profil enregistré sur ce téléphone. » ; tout reste actif.
  • Enregistrer, erreur, annuler : après « Enregistrer », retour à mon profil et toast de succès « Profil enregistré. » au-dessus de la barre d'onglets. Enregistrement impossible : toast d'erreur en bas de l'écran, visible où que l'on soit dans le formulaire, « Enregistrement impossible », « Rien n'est perdu. », « Réessayer » ; les modifications restent à l'écran. Erreur de validation : message sous le champ concerné. « Annuler » avec des modifications : alerte système « Abandonner les modifications ? », « Continuer » ou « Abandonner » ; sans modification, « Annuler » ferme directement.
  • Toast : composant commun (planche 2) : pilule encre à la largeur du texte, centrée, titre et sous-titre, icône de l'état (succès, info, attention, erreur) dans une pastille, action en petite pilule ; résultat d'une action, jamais un état durable. Règles : Direction-Artistique › Toast.
  • Texte agrandi (repris en D-047) : prénom, lieu, bio et anecdotes passent à la ligne, jamais coupés (réponse d'une anecdote dans Modifier le profil comprise) ; chiffres en trois colonnes, libellés sur deux lignes ; chips d'ambiance, tri, pastilles des cards et barre d'onglets plafonnés à 1,3. Barre du haut des pages secondaires (Modifier le profil, Réglages, Supprimer mon compte) plafonnée à 1,3 : « Annuler » et « Enregistrer » à leur largeur, titre centré sur deux lignes au besoin. Lignes des Réglages : libellé et valeur dans une rangée en flexWrap, la valeur passe sous le libellé quand la place manque, l'adresse e-mail n'est jamais coupée. Encart Premium : bouton à hauteur libre, texte centré. Section Premium pendant un pass (D-074) : fin du pass sous le libellé, « Prolonger » dessous, à droite ; « Parcours débloqués » : le nombre passe dessous s'il ne tient pas. Toast entier plafonné à 1,3 (D-046), sur plusieurs lignes dans 358 px au besoin. Compteur des chips d'ambiance en pleine couleur (à 80 % d'opacité il tombait à 3,69:1). Aucun nouveau reflow sur fontScale. Règles : Direction-Artistique › Accessibilité.
  • Lecteur d'écran : identité en un seul élément ; « Créateur certifié, en savoir plus, bouton » ; chiffres en liste ; chaque anecdote est un élément ; chip « Nature, 3 parcours, bouton » ; champs de Modifier le profil avec leur libellé et le compteur (« 103 caractères sur 150 ») ; anecdotes et à la une réordonnables sans geste par les actions « Monter » et « Descendre » ; « Profil public, interrupteur, activé », toute la ligne touchable ; toasts annoncés sans déplacer le focus, l'erreur en priorité avec « Réessayer » atteignable ; alertes système iOS. Tableau complet : contrôle accessibilité.
  • À venir (hors MVP) : espace perso avec statistiques, badges.
  • Transitions (D-030) : Réglages, Modifier le profil, Supprimer mon compte (M-03) ; sheets tri, anecdote, choisir un parcours, certification (M-05) ; toasts (M-06) ; réordonner : l'élément saisi se soulève (ombre, 102 %), les autres glissent en 200 ms ; alerte de suppression : système.

E-19 — Pages des Réglages

🟢 Validé en entier le 2026-09-28 (ticket #186, planches 1 à 3 : e-mail, connexion, notifications, langue, D-062 ; confidentialité, informations, sans compte, D-063, avec E-20 ; texte agrandi et contrôle accessibilité, D-064) ; sans compte après un achat, le 2026-09-29 (ticket #210, planche 2, D-073) · e-mail · nouvelle adresse · adresse déjà utilisée · en attente de confirmation · adresse modifiée · connexion avec Apple · connexion par e-mail · notifications · notifications coupées · langue · langue, anglais choisi · réglages, ligne Confidentialité · confidentialité · préparation du fichier · partage du fichier · confidentialité hors connexion · conditions d'utilisation · politique de confidentialité · aide et contact · nous écrire · message envoyé · réglages sans compte · sans compte, après un achat · confidentialité sans compte · texte agrandi, en attente · texte agrandi, notifications · texte agrandi, langue · texte agrandi, confidentialité · texte agrandi, conditions · texte agrandi, nous écrire · contrôle accessibilité · Claude Design

  • Rôle : les pages ouvertes par les lignes des Réglages (E-09) : Compte (e-mail, connexion), Préférences (notifications, langue, confidentialité) et Informations (conditions, politique, aide et contact). Pages poussées (M-03), sans barre d'onglets, barre du haut des Réglages : retour « Retour aux réglages », titre court, le même que la ligne.
  • E-mail (choix d'Ilan : modifiable par lien) : section « Adresse e-mail » : carte surface (rayon 16) avec envelope-simple dans un disque blanc de 44 px, l'adresse en 15/20 700 (jamais coupée, elle passe à la ligne) et « Adresse actuelle » ; dessous « Pour vous connecter par e-mail et recevoir les messages importants sur votre compte. » ; bouton surface « Changer d'adresse » (48 px). Compte Apple en adresse masquée : la carte dit « Masquée par Apple », le bouton reste.
  • Changer d'adresse : page « Changer d'adresse », retour « Retour à l'e-mail » ; « Adresse actuelle : … » ; champ « Nouvelle adresse » et clavier de type e-mail, comme E-10 ; « Nous envoyons un lien à cette adresse. L'ancienne reste active jusqu'à ce que vous l'ouvriez. » ; bouton blue « Recevoir le lien ». Erreurs sous le champ, bord de 2 px et texte error-ink avec warning-circle plein : « Cette adresse est déjà utilisée par un autre compte Widoo. » ; format : « Vérifiez l'adresse : elle semble incomplète. » ; hors connexion : bouton inactif skeleton et « Hors connexion : reconnectez-vous pour changer d'adresse. ».
  • En attente de confirmation : retour sur E-mail ; la carte dit « Adresse actuelle, active jusqu'à la confirmation » ; dessous, encart blue-soft en status : envelope-simple-open en blue-ink, « En attente de confirmation », « Lien envoyé à {nouvelle adresse}. Ouvrez-le sur ce téléphone. », puis deux actions centrées à 120 px l'une de l'autre (retouche d'Ilan) : « Renvoyer dans 30 s » en muted, puis « Renvoyer le lien » ; « Annuler » en blue-ink, qui annule le changement (l'ancienne adresse reste, l'encart disparaît). Toast de succès « Lien envoyé » avec l'adresse. L'encart reste tant que le lien n'est ni ouvert, ni annulé, ni expiré.
  • Adresse modifiée : le lien ouvert sur ce téléphone ramène sur E-mail avec la nouvelle adresse et le toast de succès « Adresse e-mail modifiée », « Les messages arrivent maintenant ici. ». Lien expiré ou déjà utilisé : la sheet de E-10 « Ce lien n'est plus valable ». La connexion par e-mail suit la nouvelle adresse ; Apple et Google ne changent pas.
  • Connexion (choix d'Ilan : lecture seule) : titre « Connexion », comme la ligne des Réglages. Carte surface de la méthode : Apple, le logo Apple de « Continuer avec Apple » (E-10), blanc dans un disque ink de 44 px, « Vous vous connectez avec Apple. » (retour d'Ilan : jamais l'icône Phosphor apple-logo) ; Google, même carte avec le G du kit Google dans un disque blanc (non dessiné) ; e-mail, envelope-simple dans un disque blanc, « Un lien de connexion, sans mot de passe. ». Dessous, l'adresse liée (Apple masquée : « Masquée par Apple », « Les messages de Widoo vous parviennent par le relais d'Apple. ») et ce qu'il faut faire sur un nouveau téléphone (« Sur un nouveau téléphone, choisissez « Continuer avec Apple » pour retrouver votre compte, vos favoris et vos sorties. »). Par e-mail : lien « Changer d'adresse » (blue-ink, 44 px) vers la page E-mail. Ni ajout ni retrait de méthode au MVP.
  • Notifications (choix d'Ilan : un interrupteur par type) : « Choisissez ce que Widoo peut vous envoyer. » ; trois lignes de 64 px, icône, libellé, aide et interrupteur, toute la ligne se touche : « Rappels de sortie » (calendar-check, « La veille à 18:00 et une heure avant le départ. ») ; « Le lendemain d'une sortie » (star, « Pour noter une sortie restée ouverte. », la notification de 10:00 de E-07) ; « Vos parcours et signalements » (flag, « Publication, corrections demandées, suite donnée à vos signalements. »). Tous activés par défaut, effet immédiat, gardés sur le compte (users.notification_prefs). Coupées dans le téléphone : encart surface en status en tête (bell-slash, « Les notifications sont coupées dans les réglages du téléphone. », « Ouvrir les réglages » vers la page de Widoo dans les réglages du téléphone) ; icônes et libellés en muted, interrupteurs inactifs à 40 %, qui gardent leur état ; la ligne des Réglages dit « Désactivées » (D-061). Sans compte, pas de ligne Notifications.
  • Langue (Ilan : français et anglais dès le MVP) : liste à choix unique, lignes de 56 px : « Langue du téléphone » (par défaut, avec dessous la langue qu'elle donne, « Français » ; device-mobile de 16 px dans un disque surface de 28 px), « Français », « Anglais ». Drapeaux ronds de 28 px (retour d'Ilan), liseré ink à 12 %. Noms des langues dans la langue de l'interface (retour d'Ilan : « Anglais », pas « English ») ; dessous, en petit, le nom dans sa propre langue (« English », « Français »), balisé dans cette langue pour le lecteur d'écran. Le choix s'applique tout de suite, sans redémarrer ; la ligne des Réglages dit la langue en cours. « Les parcours sont traduits automatiquement. Leur version d'origine reste disponible. » (D-063, après la décision d'Ilan de traduire les parcours au MVP ; remplace « Les parcours restent dans la langue de leur créateur. ») Anglais choisi : toute l'interface en anglais (« Language », « Phone language », « French », « English », « Routes are translated automatically. Their original version stays available. »). Sans compte, le choix reste sur le téléphone ; avec un compte, il est gardé sur le compte (users.locale) pour les notifications et les e-mails.
  • Confidentialité (D-063, choix d'Ilan : une page) : ligne « Confidentialité » (hand-palm) dans Préférences, à la place de l'interrupteur « Mesure d'audience », avec ou sans compte. Page : en tête, sans titre de section, la ligne « Mesure d'audience » (chart-bar, « Aide à améliorer l'app. », interrupteur ; mêmes règles et mêmes toasts que D-060 et D-061) et le texte de la sheet du premier lancement ; « Vos données » : « Un fichier avec votre profil, vos favoris, vos sorties et vos parcours créés. », bouton surface « Télécharger mes données » (download-simple, 48 px) ; « En savoir plus » : « Politique de confidentialité » (shield-check) et « Nous écrire sur vos données » (envelope-simple, ouvre Nous écrire avec le sujet « Données »).
  • Télécharger mes données (choix d'Ilan : un fichier dans l'app) : le bouton passe à « Préparation du fichier… » (circle-notch), quelques secondes, puis la feuille de partage du téléphone s'ouvre avec widoo-donnees-AAAA-MM-JJ.json ; le bouton revient au repos. Contenu : profil, anecdotes, parcours à la une, favoris, sorties programmées et passées, notes, parcours créés avec leurs étapes, préférences ; les photos par leurs liens. Erreur : toast d'erreur « Téléchargement impossible », « Réessayez dans un instant. », « Réessayer ». Hors connexion : bouton inactif skeleton et « Hors connexion : reconnectez-vous pour télécharger vos données. » ; l'interrupteur reste utilisable.
  • Textes légaux (choix d'Ilan : écrans natifs) : « Conditions d'utilisation » et « Politique de confidentialité » en pages poussées : barre du haut sans titre au repos (il y monte au défilement), grand titre 26/32 800 dans la page, « Mise à jour le … » en muted, articles numérotés 17/22 800, texte 15/22 en ink. Politique : encart surface « L'essentiel » en tête, trois phrases avec icône (user, map-pin, chart-bar). Texte servi par l'API selon la langue, gardé dans l'app (copie livrée avec l'app pour le premier lancement) : lisible hors connexion, sans toast. Même texte publié sur widoo.app (adresse demandée par les stores). Textes : Conditions-d-utilisation, Politique-de-confidentialite (brouillons, D-063).
  • Aide et contact : « Questions fréquentes » dépliables (caret-down, caret-up une fois ouverte ; une ouverte à la fois ; réponses courtes rédigées par l'équipe, en muted 14/21) ; section « Nous écrire » : « Une question, un problème, une idée ? Nous vous répondons par e-mail. », bouton blue « Nous écrire ».
  • Nous écrire : page « Nous écrire », retour « Retour à l'aide » ; « Sujet » en chips de 36 px à choix unique (Question, Problème, Données, Autre ; choisie en ink avec une coche, comme E-06) ; « Message », champ surface rayon 16, 1000 caractères, compteur « 81 sur 1000 » ; « E-mail de réponse » prérempli avec l'adresse du compte (sans compte : vide et obligatoire ; Apple masqué : l'adresse relais) ; « La version de l'app et le modèle du téléphone sont joints, pour nous aider. » ; « Envoyer » (blue), inactif tant que le message est vide. Envoyé : retour sur Aide et contact, toast de succès « Message envoyé », « Nous vous répondons par e-mail. ». Échec : toast d'erreur « Envoi impossible », « Votre message est gardé. », « Réessayer ». Hors connexion : « Envoyer » inactif, le message est gardé.
  • Sans compte (D-063) : roue dentée du profil sans compte : encart surface « Vous n'êtes pas connecté », « Le compte garde vos favoris et vos sorties sur tous vos appareils. », « Créer un compte ou se connecter » (blue, ouvre E-10) ; Préférences : Langue, Confidentialité ; Informations : conditions, politique, aide et contact ; version. Ni Premium (sauf après un achat), ni Compte, ni Notifications, ni Session. Après un achat sans compte (D-073) : l'encart dit « Créez un compte pour garder vos parcours débloqués sur tous vos appareils. » et la section Premium apparaît (pass en cours, parcours débloqués ; sur la page, « Sans compte, ils restent sur ce téléphone seulement. ») ; à la connexion, les achats faits sur le téléphone passent sur le compte. Confidentialité sans compte : l'interrupteur et son texte, puis « Sans compte, Widoo ne garde aucun profil sur vous : vos réglages restent sur ce téléphone. » ; pas d'export.
  • Texte agrandi (D-064) : au plus grand réglage standard (D-046), huit écrans les plus à risque (choix d'Ilan). Barre du haut, toasts et chips à 1,3 ; titres de 22 px et plus à 1,2 ; icônes (22 px), drapeaux et disque du téléphone (28 px), interrupteurs et radios gardent leur taille, centrés sur leur ligne. Libellés et aides passent à la ligne, jamais coupés ; l'adresse e-mail non plus. Attente de confirmation (choix d'Ilan) : quand « Renvoyer dans 30 s » et « Annuler » ne tiennent plus sur une ligne, elles passent l'une sous l'autre, centrées, 44 px chacune (rangée en flexWrap, columnGap 120, centrée). Textes légaux : grand titre à 1,2 (31 px), texte 20/30, la page défile. Nous écrire : chips à 1,3 sur deux lignes, champ du message qui grandit. Boutons à hauteur libre, texte centré. Tableau complet : contrôle accessibilité.
  • Lecteur d'écran (D-064) : titres de page en en-tête ; « Rappels de sortie, interrupteur, activé » ; interrupteurs inactifs annoncés estompés ; langues en groupe de boutons radio « Langue » ; encarts d'attente et de notifications coupées en status ; « Annuler » lu « Annuler le changement d'adresse » ; questions fréquentes « Comment programmer une sortie ?, bouton, développé » ; sujets de Nous écrire en boutons à bascule (« Problème, sélectionné ») ; « Message, 81 caractères sur 1000 » ; grand titre des textes légaux en en-tête de niveau 1, articles en niveau 2 ; « Anglais, English, bouton radio », « English » lu en anglais ; « Préparation du fichier » annoncé ; logo Apple décoratif.
  • Transitions (D-030) : pages poussées depuis les Réglages et « Changer d'adresse » depuis E-mail (M-03) ; toasts (M-06) ; retour sur E-mail après « Recevoir le lien » : retour de la pile (M-03 inverse), puis le toast.

E-20 — Mise à jour

🟢 Validé en entier le 2026-09-28 avec #186 (écrans, D-063 ; texte agrandi et contrôle accessibilité, D-064) · mise à jour obligatoire · mise à jour conseillée · texte agrandi, obligatoire · texte agrandi, conseillée · contrôle accessibilité · Claude Design

  • Rôle : faire passer à une version récente : bloquer une version qui ne marche plus, proposer une version conseillée sans bloquer. Au lancement, la version de l'app est comparée à minVersion et recommendedVersion de GET /config, par plateforme. Sans réseau au lancement, pas de contrôle : l'app s'ouvre.
  • Obligatoire (choix d'Ilan : plein écran bleu) : après l'écran de lancement, avant tout le reste. Fond blue (#4E74C8), et non blue-on-strong de l'écran de lancement : le texte blanc y tomberait à 3,91:1 (règle de E-17). Le W du logo source, le carré pris à la largeur de l'écran, centre à 350 px du haut (D-065, accord d'Ilan : descendu de 50 px pour que la branche droite passe à 8 px sous la batterie au lieu de la toucher), les branches sortent de l'écran ; barre d'état claire. En bas, marges de 24 px : « Mettez à jour Widoo » (28/34 800, blanc), « Cette version de l'app n'est plus prise en charge. Installez la dernière pour continuer. » (16/24 500, blanc, 4,51:1), bouton blanc « Mettre à jour » (52 px, texte blue-ink) vers la fiche de l'App Store ou de Google Play. Aucune sortie : ni fermeture ni retour (Android : le retour quitte l'app).
  • Conseillée (choix d'Ilan) : sheet fermable sur l'accueil chargé : poignée, icône de l'app (64 px, coins iOS), « Nouvelle version disponible » (20/26 800), « Des corrections et des nouveautés vous attendent. » (muted), « Mettre à jour » (blue, 52 px), « Plus tard » (texte, 48 px) ; glisser ou toucher le voile = « Plus tard ». Une fois par version conseillée ; jamais au-dessus de la mesure d'audience ou des rappels (au premier lancement, elle attend le lancement suivant).
  • Texte agrandi (D-064) : obligatoire : titre à 1,2 (34 px), texte 22/32 ; au plus grand réglage standard, le texte monte de 55 px et reste à 95 px sous le W, qui ne bouge pas (150 px à la taille normale). Choix d'Ilan : le W remonte d'autant que le texte grandit, seulement si le texte arrive à moins de 24 px de lui (tailles d'accessibilité au-delà) ; le remonter plus tôt ferait passer sa branche sous le wifi et la batterie. Conseillée : sur l'accueil agrandi (E-01), titre sur deux lignes, boutons pleine largeur, l'icône garde 64 px ; la sheet tient dans l'écran.
  • Lecteur d'écran : obligatoire : « Mettez à jour Widoo », en-tête, puis le texte et « Mettre à jour, bouton » ; le geste d'échappement ne fait rien. Conseillée : dialogue, focus sur le titre, geste d'échappement = « Plus tard ».
  • Transitions : obligatoire : fondu depuis l'écran de lancement ; conseillée : sheet (M-05).

E-10 — Connexion

🟢 Validé le 2026-09-24 (planches 1 à 3 du ticket #72 : écrans, états, texte à 150 % et contrôle accessibilité ; D-023, D-025 et D-028) · choix · e-mail · e-mail envoyé · première connexion · première connexion par e-mail · erreur · lien expiré · composants · composants, planche 2 · texte agrandi, choix · texte agrandi, première connexion · texte agrandi, compte après un déblocage · contrôle accessibilité · Claude Design

  • Rôle : créer un compte ou se connecter au moment où une action le demande, sans quitter l'écran.
  • Choix : sheet ouverte par une action qui demande un compte (favori, programmer, créer, signaler, bouton du profil sans compte) et, sans que rien ne l'exige, juste après un parcours débloqué à l'unité sans compte (D-073, après un déblocage : « Parcours débloqué », « Créez un compte pour garder ce parcours », « Plus tard » sous les trois choix) ; l'écran en cours reste visible au-dessus, voilé. Titre centré qui dit l'action en attente (« Connectez-vous pour enregistrer ce parcours », « … programmer ce parcours », « … créer un parcours », « … signaler ce lieu ») et une ligne d'explication (« Vos favoris vous suivent sur tous vos appareils. »). Trois boutons de 48 px : « Continuer avec Apple » en encre (bouton natif AppleAuthenticationButton, style noir), « Continuer avec Google » blanc bordé (bouton du kit Google), « Continuer avec un e-mail » gris chaud. Logos non dessinés : ils viennent des SDK. Dessous, conditions d'utilisation et politique de confidentialité en liens. Textes centrés et pas de croix : on ferme en glissant vers le bas ou en touchant le voile, rien n'est enregistré. Après la connexion, la sheet se ferme et l'action reprend.
  • E-mail : la sheet passe à l'étape e-mail, posée sur le clavier (clavier de type e-mail, adresse du trousseau proposée) ; titre centré « Continuer avec un e-mail », flèche pour revenir aux trois choix ; « Nous vous envoyons un lien de connexion. Aucun mot de passe à retenir. » ; bouton « Recevoir le lien ». Lien magique Firebase.
  • E-mail envoyé : la sheet reste sur l'écran en cours : « Vérifiez vos e-mails », l'adresse, « Ouvrez-le sur ce téléphone. Pensez à regarder dans les indésirables. », « Ouvrir ma messagerie » (app de mail par défaut), « Renvoyer dans 30 s » grisé puis actif (toast info « Nouveau lien envoyé »), « Changer d'adresse ». En ouvrant le lien sur ce téléphone, l'app reprend l'action en attente.
  • Première connexion : « Bienvenue sur Widoo », champ « Prénom ou pseudo », puis « Continuer » ; l'action reprend ensuite. Avec Apple ou Google, le prénom est prérempli (« Repris de votre compte Apple. Vous pouvez mettre un pseudo. ») et l'étape reste facultative : fermer la sheet garde le prénom prérempli. Apple refuse une app qui exige le nom après « Continuer avec Apple » quand Apple l'a déjà fourni. Par e-mail, ou si Apple ne transmet pas le prénom : étape obligatoire, sans poignée, « Continuer » inactif tant que le champ est vide ; si l'app est quittée, l'étape revient à la prochaine action qui demande un compte. Les conditions sont acceptées à l'étape des trois choix.
  • Erreur : ligne discrète au-dessus des boutons (nuage barré, « La connexion n'a pas abouti. Réessayez. »), les trois choix restent actifs ; hors connexion, wifi barré. Fermer la fenêtre Apple ou Google sans aller au bout n'affiche rien.
  • Lien expiré ou déjà utilisé : l'app s'ouvre sur l'écran en cours avec la sheet « Ce lien n'est plus valable » (« Il a expiré ou a déjà servi. »), « Recevoir un nouveau lien » et « Changer d'adresse ». Lien ouvert sur un autre appareil : l'étape e-mail s'ouvre pour confirmer l'adresse (exigence de Firebase).
  • Texte agrandi (repris en D-047) : sheets ancrées en bas, qui grandissent vers le haut ; titres sans retour à la ligne forcé. Boutons Apple et Google des SDK : texte à taille fixe (à vérifier sur appareil) ; bouton e-mail plafonné à 1,3 pour rester proche. Première connexion : la sheet reste posée sur le clavier, qui garde sa taille. Compte après un déblocage (D-074) : « Plus tard » plafonné à 1,3 comme le bouton e-mail ; la sheet grandit et tient dans l'écran. Règles : Direction-Artistique › Accessibilité.
  • Lecteur d'écran : sheet en dialogue, focus sur le titre, reste de l'écran masqué (accessibilityViewIsModal), fermeture par le geste d'échappement sur iOS et par retour sur Android (pas de croix) ; « Continuer avec Apple » (libellé du SDK), « Continuer avec Google », « Continuer avec un e-mail » ; conditions et politique en liens séparés ; « Renvoyer dans 30 secondes, estompé », sans décompte annoncé ; « Continuer, estompé » tant que le prénom est vide ; erreur en status. Tableau complet : contrôle accessibilité.
  • Transitions (D-030) : sheet modale (M-05) ; étapes dans la sheet : fondu enchaîné et hauteur (M-08) ; sheet posée sur le clavier, qui suit le clavier ; toast (M-06) ; fenêtres Apple et Google : système.

E-11 — Éditeur de parcours (informations)

🟢 Validé le 2026-09-26 (planches 3 et 4 du ticket #76 : les infos du parcours en une page, D-050 ; texte agrandi et contrôle accessibilité, D-051) · le haut · le titre · la description · ambiance et pour qui · conditions · à prévoir · calculé pour vous · changer la couverture · corrections demandées · texte agrandi, le haut · texte agrandi, ambiance et pour qui · texte agrandi, à prévoir · contrôle accessibilité · Claude Design

  • Rôle : deuxième étape de l'assistant (Étapes, Infos, Aperçu, voir E-12) : ce que les cards et la fiche (E-05) disent du parcours. Une page en sections, comme la page de l'étape (choix d'Ilan) : « Brouillon enregistré » sous « Nouveau parcours », tout s'enregistre seul ; en bas, « Suivant : l'aperçu », grisé sans titre (« Un titre pour continuer. »). Le clavier remonte la page et remplace la barre du bas.
  • Photos du parcours (choix d'Ilan : préremplies) : la première photo de chaque étape, « 3 sur 6, reprises de vos étapes » ; 6 au plus ; la première sert de couverture (pastille « Couverture ») ; croix pour retirer, « Ajouter » ouvre la galerie ; appui long pour changer l'ordre, la place de couverture s'allume en blue-soft (« Lâchez pour en faire la couverture. »).
  • Titre et description : titre obligatoire, 60 caractères, compteur, « Affiché dans les résultats et en haut de la page du parcours. » ; description avec compteur (« 60 / 80 au moins », puis « 221 caractères ») : 80 caractères au moins pour publier, pas pour un parcours privé (missing_description).
  • Ambiance : les neuf ambiances en chips de couleur (D-050), une ou plusieurs ; la première choisie est la principale (« Principale : Culture »), affichée sous le titre avec son point d'ambiance.
  • Pour qui : les six publics en chips, une ou plusieurs ; au repos, blanches sur le fond gris des sections (retour d'Ilan).
  • Conditions : Intérieur, Extérieur, Beau temps, Jour de pluie cochées d'après les lieux (« Le lieu est » de E-13), « touchez pour changer » ; « Accessible PMR » en chip, cochée par le créateur seulement si tout le parcours se fait en fauteuil roulant (choix d'Ilan) ; sinon la fiche dit « Pas accessible en fauteuil roulant. », rien à écrire. « Sans réservation » se calcule d'après les étapes, il n'apparaît pas ici.
  • À prévoir (choix d'Ilan : calculé et saisi) : « Ce que les visiteurs doivent prévoir. Rappelé quand ils programment la sortie, et le jour même. » Deux blocs nommés (retour d'Ilan) : « Suggéré par Widoo », chaque suggestion calculée avec sa raison et un interrupteur pour la garder (« Chaussures confortables », « Le parcours fait 2,7 km à pied ») ; « Vos conseils (N sur 3) », jusqu'à trois lignes du créateur (croix pour retirer), « Ajouter un conseil » et des idées à toucher pour les ajouter (Des escaliers, Des espèces, Un pique-nique, Une gourde ; une idée ajoutée disparaît de la liste).
  • Calculé pour vous : « Calculé d'après vos étapes. », rien à saisir : quartier, départ conseillé (« l'heure où tous les lieux sont ouverts à votre arrivée » ; « Changer » reste en tête de la liste de E-12), accès (station la plus proche de la première étape, données ouvertes d'Île-de-France Mobilités ; « Comment venir » abandonné), marche et effort, déplacement (déduit des trajets de E-12, D-048), durée et budget. Premium n'est pas dans l'éditeur : Widoo le décide (choix d'Ilan).
  • Corrections demandées : le parcours rouvert depuis Parcours › Créés, son titre dans l'en-tête, statut « À corriger » ; en tête de page, encadré alert sur alert-soft : « Corrections demandées », le message de l'équipe entre guillemets, « L'équipe Widoo, le 26 septembre. Corrigez, puis soumettez à nouveau depuis l'aperçu. ».
  • Texte agrandi (D-051) : barre du haut et étapes de l'assistant plafonnées à 1,3 (la barre garde 52 px, les étapes gagnent 5 px, la page commence dessous) ; sections, aides et chips passent à la ligne (chips à 1,3) ; tuiles photo de 96 px inchangées, « Couverture » à 1,3 ; « Chaussures confortables », sa raison et les lignes de « Vos conseils » passent à la ligne ; idées à toucher et barre collée à 1,3.
  • Gestes et lecteur d'écran (D-051) : ordre des photos sans glisser (WCAG 2.5.7) : toucher une photo ouvre « En faire la couverture », « Déplacer à gauche », « Déplacer à droite », « Retirer », mêmes actions au lecteur d'écran. Libellés : contrôle accessibilité.

E-12 — Éditeur de parcours (étapes)

🟢 Validé le 2026-09-26 (planches 1 à 4 du ticket #76 : créer un parcours de trois étapes écran par écran, les autres gestes et les cas, D-048 ; ajouter par la page de l'étape, modifier une étape, alertes de cohérence, D-049 ; étape éphémère, textes pour les visiteurs, D-050 ; texte agrandi et contrôle accessibilité, D-051) · aucune étape · lieu touché, bulle · nouvelle étape · une étape · lieu choisi dans la recherche · nouvelle étape, réservation · deux étapes · lieu touché, sheet réduite · trois étapes · liste entière · sheet réduite · étape touchée sur la carte · changer un trajet · métro et chemin · trajet en métro · réordonner · réordonné · glisser pour retirer · menu d'une étape · étape retirée · dix étapes · hors connexion · fermer, brouillon gardé · page de l'étape, le haut · Pratique · temps au minimum · le mot · à ne pas manquer · en images et Ensuite · le chemin écrit · étape éphémère · nouvelle étape, lieu créé sans photo · alertes sur la carte · alertes dans la liste · alerte, réordonné · départ conseillé, lieu fermé · ce que l'éditeur alimente · texte agrandi, trois étapes · texte agrandi, liste entière · texte agrandi, bulle d'un lieu · texte agrandi, page de l'étape · texte agrandi, fenêtre du trajet · contrôle accessibilité · Claude Design

  • Rôle : poser les lieux dans l'ordre de la sortie ; trajets, heures, durée, budget et distance se calculent.
  • Assistant (choix d'Ilan) : trois étapes, Étapes, Infos, Aperçu, dans une barre de progression bleue sous « Nouveau parcours » ; on commence par les lieux. Croix en haut à gauche, sans question : le brouillon est gardé, « Brouillon enregistré » sous le titre dès la première étape. Même chemin pour un parcours privé ou publié : le choix se fait à l'aperçu.
  • Carte + sheet (choix d'Ilan, grammaire de E-01 et E-04) : zone de la barre d'état en blanc, jamais de carte dessous. Carte sous l'en-tête : lieux Widoo en disques blancs à l'icône de leur famille ; étapes en pastilles pleines de leur famille, numéro en encre devant ; tracé bleu ; durée de chaque trajet dans une pastille blanche. « Ajouter un lieu » en pilule blanche en haut ; « Voir tout le parcours » (« Me localiser » sans étape) à droite au-dessus de la sheet. Sheet à trois crans (réduite, moitié, liste entière) ; en tête, le nombre d'étapes et le calcul en direct (durée, budget par personne, distance).
  • Ajouter un lieu : toucher un lieu sur la carte ouvre une bulle encre (photo, catégorie, arrondissement, distance à la dernière étape, horaires, réglages proposés « Proposé : 20 min, gratuit », Vérifié, « Ajouter au parcours ») ; la sheet se réduit et la carte se recadre (choix d'Ilan). Un résultat de la recherche (E-13) ramène à la carte, centrée sur le lieu, sa bulle ouverte. « Ajouter au parcours » ouvre la page de l'étape en « Nouvelle étape » (choix d'Ilan, D-049) : la même page que pour modifier, préremplie (photo du lieu, temps et coût proposés selon la catégorie et la gamme de prix, réservation activée d'office pour un musée) ; on règle ce qu'on veut puis « Ajouter comme étape N » en bas ; la flèche retour annule, rien n'est ajouté ; ni « Retirer du parcours » ni « Ensuite ». Le lieu va à la fin (choix d'Ilan) ; retour à la carte, toast « {lieu} ajouté, étape N » avec « Annuler ». Plus de fenêtre d'ajout sur la carte (D-049).
  • Page de l'étape (D-049) : « Modifier l'étape » (menu de la liste, ou bulle de l'étape sur la carte) ouvre une page dans l'ordre de la page de sortie E-07 (choix d'Ilan) : « Étape N », « Brouillon enregistré », tout s'enregistre seul, « Terminé » revient à la carte. En haut, la photo qui s'affichera en grand (celle du lieu par défaut) avec « Changer » : la galerie du téléphone s'ouvre, la photo choisie passe en tête de « En images », celle du lieu en deuxième ; sans photo, l'emplacement « Ajouter une photo ». Puis l'heure, le nom, la catégorie, l'adresse et les horaires du lieu, « Tout ce qui suit s'affiche pendant la sortie, à cette étape. », et le titre de l'étape (facultatif, sinon le nom du lieu). Pratique : temps sur place et coût par personne, réglés au pas (5 min jusqu'à 1 h puis 15 min, de 10 min à 6 h ; Gratuit, 5, 10, 15, 20 € puis de 10 en 10), « − » grisé au minimum et « + » au maximum avec la raison ; « Réservation conseillée » ; activée, elle ouvre « Lien de réservation (facultatif) » (le site du lieu par défaut, la billetterie ou le lien affilié du créateur), la case « C'est un lien affilié » (« Les visiteurs verront « Lien affilié » près de « Réserver ». » : mention obligatoire, D-050) et « Précision » (80 caractères, affichée avec le rappel de réservation). En fin de Pratique, « Étape éphémère » (D-050) pour une expo temporaire ou un événement dans un lieu permanent : activée, « Jusqu'au » ouvre le calendrier de la date de fin (comme E-13) ; « Les visiteurs verront « Jusqu'au 17 janvier ». Après, nous vous préviendrons pour modifier le parcours. » Le mot de {prénom} : texte libre, 600 caractères, « Les visiteurs le lisent en arrivant à l'étape. », six lignes puis « Lire la suite » dans E-07 ; le clavier remonte la page et remplace « Terminé ». À ne pas manquer : 1 à 3 points, « Ajouter un point (N sur 3) » puis « 3 sur 3, le maximum ». En images : 5 photos au plus, la première en grand pendant la sortie, appui long pour changer l'ordre ; la photo du lieu compte. Ensuite (absent pour la dernière étape) : l'étape suivante et la ligne du trajet, qui ouvre la fenêtre du trajet ; « Le chemin » ne s'écrit que dans cette fenêtre (retour d'Ilan) : « Décrire le chemin » l'ouvre, le curseur dans le champ ; une fois écrit, le texte s'affiche en lecture et le toucher rouvre la fenêtre. En bas, « Retirer du parcours » en error-ink.
  • La liste : la timeline de la fiche (E-05) : « Départ conseillé 10:00 » avec « Changer » (calculé : l'heure où tous les lieux sont ouverts à l'arrivée, choix d'Ilan, D-050 ; « Changer » garde une heure choisie, « Conseillé aux visiteurs, qui peuvent le changer en programmant. »), heure, pastille, nom, catégorie, durée et coût de chaque étape, poignée à droite ; trajets « 15 min à pied · 1,1 km » ; « Fin vers 14:10 » ; « Ajouter un lieu » (N sur 10). Toucher une ligne ouvre le menu de l'étape (choix d'Ilan) : Modifier l'étape, Voir sur la carte, Monter, Descendre (grisé pour la dernière), Retirer du parcours en error-ink. Poignée ou appui long : glisser pour réordonner, trajets et heures estompés puis recalculés au lâcher. Glisser vers la gauche : « Retirer » en error-ink. Retrait sans confirmation, toast « Annuler ». Sur la carte, toucher une étape ouvre sa bulle avec « Modifier l'étape ».
  • Trajets (choix d'Ilan) : un mode par trajet, proposé selon la distance (à pied jusqu'à 1,5 km, métro au-delà) ; la pastille ou la ligne ouvre une fenêtre avec les quatre modes (À pied, Vélo, Métro, Voiture) et leur durée ; « Le chemin » (facultatif, 200 caractères) s'écrit seulement ici, c'est « Le chemin de {prénom} » de E-07 (D-049). Métro : tracé en pointillés.
  • Suivant : « Suivant : les infos » grisé jusqu'à deux étapes, avec « Ajoutez au moins deux lieux pour continuer. » puis « Encore un lieu pour continuer. ».
  • États : dix étapes (max_steps) : « Ajouter au parcours » grisé dans la bulle avec la raison, « 10 sur 10, le maximum » ; hors connexion : tout est gardé sur le téléphone (« Enregistré sur le téléphone », pastille « Hors connexion, tout est gardé sur le téléphone »), recherche indisponible, lieux déjà chargés touchables, trajet ajouté estimé (« ≈ 15 min à pied · estimé ») puis recalculé ; fermer : brouillon en tête de Parcours › Créés (« Nouveau parcours » tant qu'il n'a pas de titre, photo de la première étape), toast « Brouillon enregistré » ; sans compte, « Créer un parcours » mène à E-10 (validé) ; la création est gratuite (D-073).
  • Cohérence (D-049, choix d'Ilan : sur place et compteur) : avertissements et erreurs de l'Orchestration affichés sur l'étape ou le trajet concerné, en alert sur alert-soft, avec leur action ; compteur « N points à vérifier » en tête de la sheet, qui descend à la première ; point « ! » ambre sur la pastille de la carte. Dessinés : l'aller-retour (back_and_forth, « L'ordre fait un aller-retour », « Réordonner » applique l'ordre par plus proche voisin, toast « Ordre changé, 20 min de trajet en moins » avec « Annuler ») ; l'étape sans photo (« Pas encore de photo », obligatoire pour publier, pas pour un parcours privé, « Ajouter une photo ») ; le nouveau lieu, dit en gris sans compter (« Nouveau lieu, vérifié par l'équipe avant publication », unverified_place) ; le lieu fermé à l'arrivée (closed_at_arrival), signalé dans la fenêtre du départ conseillé (même fenêtre que l'heure de E-06) avec une heure proposée (« Partir à 13:30 ») et sur l'étape. Même forme pour un trajet trop long (« Passer en métro »), un doublon, trop de trajet ou plus de 14 h. Les règles de 2 à 10 étapes et de 10 min à 6 h sont tenues par les commandes.
  • Contenu facultatif de l'étape (D-029) : ce que E-07 affiche en sections : le mot du créateur (texte libre), à ne pas manquer (1 à 3 points), photos de l'étape (5 au plus). La piste audio est hors MVP : rien à saisir (D-029). Rien d'obligatoire ; une section vide n'apparaît pas dans E-07. Tout se saisit dans la page de l'étape (D-049).
  • Ce que l'éditeur alimente : planche de tout ce que montrent les cards, E-05, E-06 et E-07, avec sa source (saisi, lieu, calculé, communauté) ; six manques au modèle (départ conseillé, à prévoir, accès en transport, précision de réservation, photo de l'étape, mention du lien affilié), reportés depuis dans le modèle (D-048) sauf la photo d'étape, traitée par une alerte (D-049). Revue avec les choix d'Ilan du 25 septembre (D-050) : PMR coché, phrase générique sinon ; départ conseillé et accès calculés ; À prévoir calculé et saisi ; Premium hors éditeur ; mention « Lien affilié » obligatoire ; précision gardée ; deux lignes nouvelles, l'éphémère et le crédit des photos libres. « Lien affilié », « Jusqu'au … » et le crédit des photos libres sont reportés sur E-05, E-06 et E-07 (D-052, ticket #181).
  • Texte agrandi (D-051) : fond de carte, noms de quartiers et numéros des pastilles ne grandissent pas ; étiquettes de trajet à 1,3 ; « Ajouter un lieu » grandit (48 px au moins) ; la bulle d'un lieu se réduit à la photo, au nom, à la catégorie et à « Ajouter au parcours » (choix d'Ilan, troisième reflow sur fontScale ≥ 1,3), horaires et réglages proposés restent sur la page « Nouvelle étape » ; sheet et liste : noms, trajets et aides passent à la ligne, « Changer » passe sous le départ conseillé, à droite, quand la place manque ; page de l'étape : commandes − et + de 44 px, la valeur grandit entre elles ; fenêtre du trajet ancrée en bas, elle grandit vers le haut, « Suggéré » à 1,3.
  • Gestes et lecteur d'écran (D-051) : chaque geste a son équivalent d'un toucher (WCAG 2.5.7) : « Monter », « Descendre » et « Retirer du parcours » du menu de l'étape ; photos de « En images » par le menu d'une photo (« Mettre en premier », « Déplacer à gauche », « Déplacer à droite », « Retirer ») ; toasts avec « Annuler » à 6 s. Libellés : contrôle accessibilité.

🟡 Brouillon #383 du 2026-10-14, à valider par Ilan, voir Compte-et-Monetisation › Fin de la limite de création : « Créer un parcours » ouvre l'assistant sans contrôle préalable (canCreateRoute retiré de GET /me) ; E-11 et E-12 inchangés, la seule limite est celle de « Avant de soumettre » (E-14).

E-13 — Recherche ou création d'un lieu

🟢 Validé le 2026-09-26 (ticket #76 : recherche, planche 1, D-048 ; création d'un lieu, planche 2, D-049 ; lieu éphémère et photos libres, D-050 ; texte agrandi et contrôle accessibilité, planche 4, D-051) · autour de l'étape · résultats · chargement · aucun résultat · déjà dans le parcours · nouveau lieu, nom et catégorie · adresse · épingle · lieu proche · horaires, prix, photo · horaires · photo proposée · lieu éphémère · date de fin · lieu créé sur la carte · texte agrandi, recherche · texte agrandi, nouveau lieu · contrôle accessibilité · Claude Design

  • Recherche : « Ajouter un lieu » (E-12) ouvre la page, clavier ouvert. Avant de taper, les lieux Widoo autour de la dernière étape ; en tapant, les lieux sur Widoo d'abord (catégorie, arrondissement, distance à la dernière étape, Vérifié), texte tapé en gras ; en bas, toujours « Créer le lieu « … » ». Choisir un résultat ramène à la carte de E-12, centrée sur le lieu, sa bulle ouverte (D-049). « Annuler » revient à la carte.
  • États de la recherche : chargement en lignes squelette, sans spinner (règle de E-02) ; aucun résultat : « Aucun lieu « … » sur Widoo », conseil d'orthographe, « Créer le lieu » en tête ; lieu déjà dans le parcours : « Déjà l'étape N », le toucher montre l'étape ; hors connexion : recherche indisponible (E-12).
  • Création (D-049) : « Créer le lieu « … » » ouvre « Nouveau lieu », le nom prérempli avec ce qu'on a tapé. Catégorie : les 14 catégories en chips, à l'icône et à la couleur de leur famille. Adresse d'abord (choix d'Ilan), avec les suggestions du géocodage ; l'adresse choisie pose l'épingle sur une carte, qu'on glisse au bon endroit (« Glissez l'épingle au bon endroit », « Relâchez pour placer ») : le point sert aux trajets et à « Vous semblez être sur place ». Puis, facultatifs : horaires par jour dans une fenêtre (« Accessible à toute heure » pour une rue, une place, un parc sans grille ; « Ajouter une plage » pour une coupure) ; « Lieu éphémère » (D-050), pour un événement, une expo, un pop-up : activé, « Jusqu'au » ouvre un calendrier (« Le lieu reste proposé jusqu'à ce jour compris. », bouton « Choisir le dimanche 11 octobre ») et prévient « Après cette date, le lieu disparaît de Widoo ; les parcours qui le contiennent seront à corriger. » ; « Le lieu est » Dehors ou À l'intérieur (conditions pluie et soleil) ; prix Gratuit, €, €€, €€€ (gamme du lieu, préremplit le coût) ; site ; photos (facultatives, choix d'Ilan) : proposées depuis Wikimedia Commons quand une photo libre du lieu existe (choix d'Ilan, D-050 ; pas de photos Google : leurs conditions interdisent de les montrer avec une carte qui n'est pas Google et de les stocker), le crédit sous la vignette (« © J. Moreau, CC BY-SA »), croix pour la retirer, « Ajouter » pour en mettre d'autres ; sinon « Aucune photo libre trouvée pour ce lieu. Sans photo, cette étape n'aura rien à montrer pendant la sortie. », rappelé par une alerte (D-049). « Créer le lieu » grisé tant que nom, catégorie et adresse manquent (« Nom, catégorie et adresse pour continuer. »).
  • États de la création : un lieu Widoo à moins de 50 m au nom proche : encadré « Ce lieu existe peut-être déjà » avec ce lieu, « Utiliser ce lieu » ou « C'est un autre lieu ». Créé, le lieu revient sur la carte de E-12, centrée sur lui, toast « Lieu créé », sa bulle ouverte avec « Nouveau lieu, vérifié avant publication » (unverified_place, vu en modération) et « Ajouter au parcours », qui ouvre la page de l'étape (sans photo : l'emplacement « Ajouter une photo » en tête).
  • Texte agrandi (D-051) : le clavier ne grandit pas, les résultats défilent et passent à la ligne ; les 14 catégories, plafonnées à 1,3, prennent plus de rangées.
  • Gestes et lecteur d'écran (D-051) : épingle sans glisser (WCAG 2.5.7) : toucher un point de la carte y pose l'épingle ; au lecteur d'écran, l'adresse suffit. Libellés : contrôle accessibilité.

E-14 — Aperçu du parcours créé

🟢 Validé le 2026-09-26 (planches 3 et 4 du ticket #76 : aperçu, soumission, envoi, cas, D-050 ; texte agrandi et contrôle accessibilité, D-051) ; limite de relecture validée le 2026-09-29 (ticket #210, planche 2, D-073) · aperçu · infos et étapes · soumettre, ce qui bloque · trois parcours en relecture · envoyé à l'équipe · Créés, en relecture · enregistré en privé · compte de l'équipe Widoo · parcours publié modifié · hors connexion · texte agrandi, aperçu · texte agrandi, avant de soumettre · texte agrandi, envoyé à l'équipe · contrôle accessibilité · Claude Design

  • Aperçu : troisième étape de l'assistant. La fiche E-05 en lecture sous l'en-tête de l'assistant, avec le bandeau blue-soft « Aperçu : votre parcours tel que le verront les visiteurs. » ; « Nouveau » à la place de la note (D-023) et « Par {prénom} » ; tuiles, description, Pour qui, Conditions, En pratique, les étapes (« Départ conseillé à 10:00 »). En bas, « Enregistrer en privé » en surface, sans cadenas (retour d'Ilan), et « Soumettre » en blue.
  • Soumettre (choix d'Ilan : toujours actif) : s'il manque quelque chose pour publier, « Soumettre » ouvre la fenêtre « Avant de soumettre » : « Un point à régler pour publier. Tout le reste est prêt. » ; chaque point bloquant en alert sur alert-soft mène à l'endroit à corriger (« Vigne du Clos Montmartre n'a pas de photo », « Étape 3 : pendant la sortie, elle n'aurait rien à montrer. ») ; un nouveau lieu est dit en gris, sans bloquer (« … sera vérifié par l'équipe avec le parcours. ») ; puis l'action du premier point (« Ajouter une photo ») et « Enregistrer en privé » (« En privé, vous pourrez soumettre plus tard, depuis Parcours › Créés. »). Trois parcours déjà en relecture (anti-spam, settings.max_pending_routes, D-073) : même fenêtre, « Votre parcours est prêt, mais il faudra attendre un peu. », point au sablier « 3 parcours en relecture, c'est le maximum », « Vous pourrez soumettre celui-ci dès que l'équipe aura répondu pour l'un d'eux, sous 72 h. », qui mène à Parcours › Créés ; « Enregistrer en privé » devient le bouton principal (blue) ; l'API répond 429 rate_limited.
  • Envoyé (choix d'Ilan : un écran de confirmation) : « Envoyé à l'équipe », « Merci ! Nous relisons « {titre} » et vous répondons sous 72 h. » ; « Et maintenant ? » en trois temps : Relecture sous 72 h (l'équipe vérifie aussi le nouveau lieu), Publié (dans les résultats et sur le profil, le créateur est prévenu), Ou quelques corrections (l'équipe dit quoi changer) ; « En attendant, il est déjà à vous : programmez-le ou partagez-le par lien. » ; « Voir mes parcours » et « Retour à l'accueil », croix en haut à gauche.
  • Créés (E-08) : le parcours envoyé en tête, « Envoyé à l'instant », pastille « En relecture » ; enregistré en privé : pastille « Privé », « Visible par lien seulement », toast « Enregistré en privé » avec « Partager ».
  • Compte de l'équipe Widoo : bandeau « Compte Widoo : publié sans relecture, après les mêmes vérifications. », « Par Widoo », « Publier » à la place de « Soumettre ».
  • Parcours publié modifié : son titre dans l'en-tête, « Modifications enregistrées » ; bandeau « Vos modifications seront relues. En attendant, la version actuelle reste en ligne. » ; « Soumettre les modifications » et « Annuler les modifications » (révision pending, Creation-et-Moderation).
  • Hors connexion : bandeau encre « Hors connexion, tout est gardé sur le téléphone. », « Enregistré sur le téléphone » ; « Soumettre » reste possible : toast « Envoi au retour du réseau », « « {titre} » partira tout seul. ».
  • Texte agrandi (D-051) : bandeau « Aperçu » sur deux lignes, la page commence dessous ; tuiles d'infos et « 1 / 3 » plafonnés à 1,3, valeurs sur une ligne (règle de E-05) ; « Soumettre » et « Enregistrer en privé » en flexWrap: 'wrap-reverse', chaque bouton au moins à la largeur de son libellé : côte à côte à 100 %, « Soumettre » au-dessus en pleine largeur en texte agrandi (choix d'Ilan) ; « Avant de soumettre » grandit vers le haut ; « Envoyé à l'équipe » défile sous ses deux boutons collés. Libellés : contrôle accessibilité.

Web, e-mails et stores

E-21 — Site widoo.app (landing et lien d'un parcours)

🟢 Validé en entier le 2026-09-28 (ticket #187 : landing responsive, lien d'un parcours public, privé et retiré, planche 1, D-068 ; tablette et navigation au clavier, planche 3, D-070 ; e-mails et fiches des stores dans E-22 et E-23) · landing, ordinateur · landing, téléphone et suite · lien d'un parcours, téléphone · parcours privé · parcours retiré · lien d'un parcours, ordinateur · landing, tablette · lien d'un parcours, tablette · ordre au clavier · parcours Premium et page introuvable, validés le 2026-09-29 (ticket #210, planche 3, D-074) : lien d'un parcours Premium, téléphone · ordinateur · page introuvable, téléphone · ordinateur · Claude Design

  • Rôle (cadrage d'Ilan) : une seule page responsive sur widoo.app, qui remplace la page de liste d'attente : présenter Widoo, faire installer l'app, servir de page de repli aux liens de parcours (widoo.app/r/…). Pas de version web d'un parcours.
  • Direction (« Le plan de Paris ») : page d'app grand public, langage joueur autour du chemin du logo. Une seule couleur d'accent, blue #4E74C8 ; blue-ink #3A4FA8 pour le texte bleu sur fond clair ; blue-soft #E4ECFA pour le fond des envies ; encre #14171F et muted #5F6B80 pour le texte. Plus Jakarta Sans (800 titres, 500 texte). Formes : conteneurs arrondis à double bord (coque #EDF1FA de 8 px, cœur à 40 px de rayon), photos en autocollants à bord blanc (rayon 20 px, légèrement inclinées), boutons en pilule, boutons des stores à 12 px ; ombres teintées de bleu (rgba(38, 62, 128, 0.18)) ; couleurs des familles d'étapes de l'app (balade #2A8A62, musée #7A2A4A, café et table #F2592A). Aucun tiret long ; espaces insécables dans les durées et les prix et devant « : ? ! ».
  • Header : logo (icône et « widoo » en minuscules bleues, déclinaison horizontale sans fichier dédié), trois ancres (Idées de sortie, Quartiers, Questions), FR | EN, bouton « Télécharger l'app » vers le bandeau final ; au téléphone, logo et FR | EN.
  • Hero : cadre arrondi sous le header. H1 « Que faire à Paris aujourd'hui ? », accroche « Des idées de sortie à Paris, prêtes à vivre : les étapes, la durée, le budget et les horaires. », boutons App Store et Google Play à la même largeur (empilés sur ordinateur, côte à côte au téléphone) ; sur ordinateur, QR code vers widoo.app/app (renvoi vers le store du téléphone), W du logo au centre. Le plan bleu occupe la droite (au téléphone, le bas) : rues du plan, parcours « Montmartre sans les touristes » tracé comme le trait du logo (blanc, bouts ronds, ombre) le long des rues, ses 4 étapes (heure et nom, couleur de leur famille), temps de marche entre elles, autocollant du parcours.
  • Avis de la hero (gabarit) : carte d'avis posée sur le plan (cinq étoiles, « Avis App Store », citation, initiale, prénom, date), une seconde carte en retrait derrière. Prénom, texte et note de la maquette sont des exemples. En ligne, le bloc ne s'affiche qu'avec de vrais avis (avis des stores, ou utilisateurs d'accord pour être cités) ; sans eux, il est masqué, jamais rempli de faux avis : Ilan demandait des avis inventés présentés comme ceux de l'app, refusé (pratique commerciale trompeuse), il a choisi ce gabarit. L'étiquette rose d'annotation de la maquette a été retirée par Ilan.
  • Comment ça marche (« Des balades à Paris toutes prêtes ») : trois arrêts décalés reliés par le chemin bleu (12 px), chacun avec une capture de l'app inclinée : « Choisissez votre sortie » (E-05) ; « Programmez-la » (E-08) : « Choisissez le jour. Widoo vous dit exactement quoi prévoir et quoi réserver, vérifie les horaires et vous rappelle la sortie la veille à 18:00. » (passage mis en avant en encre et en gras, demande d'Ilan) ; « Laissez-vous guider » (E-07). Le chemin passe sous la section suivante. Au téléphone, arrêts l'un sous l'autre reliés par un trait vertical.
  • Envies (« Des idées de sortie pour chaque envie ») : grille asymétrique de cinq autocollants photo (en amoureux, entre amis, sorties gratuites et en famille, quand il pleut, toute une journée) ; sous quatre d'entre eux, un parcours d'exemple avec son créateur (initiale ou logo, titre, durée, budget, « par … »). Note sur la photo (demande d'Ilan) : pastille blanche, cinq étoiles remplies au dixième (#F5B301 sur #DDE3EE), note et nombre d'avis, lue « Noté 4,9 sur 5, 128 avis ». En ligne : notes réelles du catalogue, pastille masquée tant qu'un parcours n'a pas d'avis. Au survol à la souris, l'autocollant se redresse.
  • Quartiers (« Balades à Paris, quartier par quartier ») : carte claire de Paris (Seine et îles), sept quartiers placés à leur endroit avec une vignette photo ou une icône, rive droite et rive gauche ; « Tout Paris est dans l'app ». Au téléphone, quartiers groupés par rive, la Seine entre les deux groupes. Quartiers et parcours d'exemple à aligner sur le catalogue au lancement.
  • Questions fréquentes : six questions en tuiles dépliables, la première ouverte ; réponses alignées sur Compte-et-Monetisation (révision du 2026-09-28 : création gratuite et sans limite ; Premium par abonnement avec essai de 7 jours, pass de 7 jours ou à l'unité) et Creation-et-Moderation ; encart bleu « Une autre question ? » avec contact@widoo.app.
  • Bandeau final : cadre bleu « Votre prochaine sortie commence ici », « Gratuit, sur iPhone et Android. », boutons des stores et QR code ; le W du logo tourné de 24°, sa tige gauche sortant du cadre par le haut.
  • Pied de page : logo, « © 2026 Inprogress Agency, conçu à Paris », Conditions d'utilisation et Politique de confidentialité (pages du site, même texte que dans l'app, GET /legal/:doc), contact@widoo.app, FR | EN.
  • Lien d'un parcours (widoo.app/r/<id|share_token>) : app installée : le lien ouvre la fiche dans l'app (liens universels, App Links). Sinon cette page : dans le cadre bleu, « On vous a partagé ce parcours » et la carte du parcours (photo, titre, catégorie et quartier, note et créateur, durée, budget, distance, nombre d'étapes, jamais le détail des étapes), « Ouvrir dans l'app » (tente l'app, puis mène au store du téléphone ; plutôt que le seul badge, pour les navigateurs intégrés des messageries qui n'ouvrent pas les liens universels) et « Sans l'app, le bouton vous mène au store : le parcours s'ouvrira après l'installation. » ; la landing suit. Ordinateur : carte horizontale, QR code du lien et les deux boutons des stores. Parcours privé : pastille « Privé », « Partagé par Camille, visible seulement avec le lien », sans note. Parcours retiré ou lien inconnu : encart « Ce parcours n'est plus disponible » (« Son créateur l'a retiré le 20 sept. »), puis la landing. Après l'installation, le parcours s'ouvre (lien différé, à cadrer). Pages /r/ non indexées ; aperçu du lien dans les messageries (Open Graph) : titre, photo, catégorie, durée et budget.
  • Parcours Premium (D-074, choix d'Ilan : pastille et une ligne, sans prix) : pastille « Premium » sur la photo de la carte (encre à 86 %, couronne amber, comme dans l'app) ; sous la note (sous les chiffres sur ordinateur), filet puis « Parcours Premium : toutes ses étapes dans l'app, avec un pass, un abonnement ou ce parcours seul. » (14/20 muted, couronne). Sur le plan, les étapes 2 à 4 ne montrent que leur catégorie et un cadenas (« Musée », « Café », « Restaurant »), comme dans la fiche ; le départ garde son nom. L'API du site n'envoie pas le nom des étapes verrouillées. Tablette : la carte de l'ordinateur, même pastille, même ligne. Lecteur d'écran : « Premium » lu après le titre, puis la ligne.
  • Page introuvable (D-074, choix d'Ilan : page légère) : toute adresse inconnue hors /r/ (un lien /r/ inconnu garde l'encart « Ce parcours n'est plus disponible », avec un statut 404). Dans le cadre bleu : « Cette page n'existe pas » (H1, 42/44 au téléphone, 64/66 sur ordinateur), « L'adresse est peut-être incomplète. Les idées de sortie vous attendent sur l'accueil et dans l'app. », bouton blanc « Voir les idées de sortie » (texte blue-ink, vers l'accueil), boutons des stores ; plan décoratif dont le tracé s'arrête à mi-chemin sur un disque blanc au point d'interrogation, sans étape ni étiquette. Statut 404, noindex, titre de page « Page introuvable · Widoo ». Sur ordinateur, header complet, texte à gauche, plan à droite.
  • Référencement : titre « Que faire à Paris ? Idées de sortie et balades | Widoo » ; description « Des idées de sortie à Paris prêtes à vivre : balades, sorties en amoureux, en famille ou gratuites, avec durée, budget et horaires. App gratuite. » ; un seul H1, un H2 par section ; texte alternatif de chaque image ; versions française et anglaise liées (hreflang). Requêtes visées : que faire à Paris, idées de sortie à Paris, balade à Paris, sorties par envie.
  • Mouvement : au chargement, le parcours de la hero se dessine en 1,8 s (linéaire, départ à 300 ms) ; chaque étape apparaît quand le trait l'atteint (échelle 0,9 à 1 et opacité, 260 ms, cubic-bezier(0.23, 1, 0.32, 1)), puis sa puce et les temps de marche ; l'autocollant se pose à 2,25 s, les avis à 2,45 s (500 ms) ; le texte de la hero monte de 10 px (500 ms, décalage 80 ms). Boutons : échelle 0,97 à la pression (160 ms) ; au survol à la souris seulement, l'icône du bouton du header descend de 2 px. Questions : ouverture en hauteur et opacité (220 ms), plus et moins qui pivotent. Au défilement : le chemin de « comment ça marche » se dessine avec la page, le W du bandeau final se trace une fois. Moins d'animations demandé : tracés affichés d'emblée, le reste en fondu de 200 ms sans mouvement. États de départ seulement dans les keyframes : sans animation, tout s'affiche.
  • Tablette (D-070, choix d'Ilan : la tablette tient lieu de texte agrandi) : portrait, 768 px, aussi la largeur utile d'un ordinateur de 1440 px zoomé à 200 % ; de 768 à 1023 px cette mise en page, à partir de 1024 px celle de l'ordinateur (conteneur fluide), sous 768 px celle du téléphone. Header sans les ancres (logo, FR | EN, « Télécharger l'app ») ; hero empilée : titre 56/60, accroche, deux boutons des stores côte à côte, sans QR code (sur une tablette, on installe directement), plan de 560 px avec le parcours, l'avis et l'autocollant ; « comment ça marche » en trois colonnes, les numéros sur le chemin, qui longe le bord droit et passe sous les envies (retour d'Ilan : la liste faisait vide) ; envies sur deux colonnes, la première en pleine largeur ; quartiers en cartes sur deux colonnes, par rive ; questions sur une colonne, encart « Une autre question ? » dessous en pleine largeur, bouton à droite (retour d'Ilan) ; bandeau final sans QR code ; pied sur trois lignes. Lien d'un parcours : carte horizontale de l'ordinateur, « Ouvrir dans l'app » avec la phrase à côté, plan dessous.
  • Clavier (D-070) : 26 arrêts dans l'ordre de lecture (planche, pastilles roses = annotations). 1 : « Aller au contenu », premier élément de la page, caché jusqu'au focus, mène à la hero (id="contenu") ; puis logo, ancres, FR, EN, « Télécharger l'app », boutons des stores, « Tout Paris est dans l'app », les six questions, contact@widoo.app, boutons du bandeau, pied de page. Les questions passent avant l'encart « Une autre question ? » dans le DOM (placement en grille), pour que la tabulation suive la lecture. Anneau de focus encre de 3 px, décalé de 3 px : 17,9:1 sur blanc, 4,0:1 sur le bleu (seuil 3:1). Le QR code n'est pas focusable (image avec texte alternatif). Décor (plan, chemins, W) masqué au lecteur d'écran ; blanc sur blue à 4,51:1 (règle existante).
  • Boutons des stores : logo Apple de E-10 (jamais redessiné) et logo Google Play, en attendant les badges officiels d'Apple et de Google, à utiliser selon leurs règles ; même largeur.
  • Non traité : mode sombre ; textes anglais (même page, à traduire).

E-22 — E-mails (connexion, nouvelle adresse, réponse du support)

🟢 Validé en entier le 2026-09-28 (ticket #187 : e-mails, planche 2, D-069 ; mode sombre, planche 3, D-070) · boîte de réception · connexion · nouvelle adresse · réponse du support · connexion, ordinateur · connexion, mode sombre · nouvelle adresse, mode sombre · réponse du support, mode sombre · Claude Design

  • Rôle (cadrage d'Ilan : sobres, les trois) : e-mails transactionnels envoyés par Brevo (Architecture-Technique), en français et en anglais selon la langue du compte (#199).
  • Gabarit commun : fond gris chaud #F6F5F1 ; carte blanche arrondie (24 px), marges 24 px au téléphone, 40 px sur ordinateur ; icône de l'app (36 px) et « widoo » en blue ; titre 26/32 800 (28/34 sur ordinateur) ; texte 16/24 500 ; bouton blue en pilule de 52 px, texte blanc 16 700, pleine largeur au téléphone, 280 px sur ordinateur ; lien de secours en blue-ink (coupé où il faut) ; filet line ; ligne de sécurité 14/21 muted. Pied hors de la carte : « Widoo, des sorties toutes prêtes à Paris. » (13 700), la raison de l'envoi, « Inprogress Agency, Paris · contact@widoo.app · Politique de confidentialité » (12/18 muted). Largeur 600 px au plus, centrée. Police : Plus Jakarta Sans si le client la charge, sinon police du système (-apple-system, 'Segoe UI', Roboto, Helvetica, Arial) ; logo en PNG (Gmail bloque le SVG). Expéditeur « Widoo », réponses vers contact@widoo.app.
  • Connexion (E-10) : objet « Votre lien de connexion à Widoo » ; aperçu « Touchez le bouton sur votre téléphone pour vous connecter. » ; « Connectez-vous à Widoo », « Touchez le bouton sur le téléphone où vous avez demandé ce lien. Aucun mot de passe à retenir. », bouton « Se connecter » (lien Firebase généré par l'Admin SDK) ; « Ce lien ne sert qu'une fois et expire au bout de quelques heures. Le bouton ne marche pas ? Copiez ce lien dans le navigateur de votre téléphone : » et le lien ; « Vous n'avez rien demandé ? Ignorez cet e-mail : sans ce lien, personne ne peut se connecter à votre compte. » ; raison : « Cet e-mail a été envoyé à {adresse} parce qu'une connexion à Widoo a été demandée avec cette adresse. »
  • Nouvelle adresse (E-19, D-062) : envoyé à la nouvelle adresse ; objet « Confirmez votre nouvelle adresse e-mail » ; aperçu « Touchez le bouton pour utiliser cette adresse avec Widoo. » ; « Confirmez votre nouvelle adresse », « Vous avez demandé à utiliser {nouvelle adresse} pour votre compte Widoo. Touchez le bouton sur votre téléphone pour confirmer. », bouton « Confirmer l'adresse » ; « Votre ancienne adresse reste active jusqu'à la confirmation. », même durée et même lien de secours que la connexion ; « Ce n'est pas vous ? Ignorez cet e-mail : rien ne change sur votre compte. »
  • Réponse du support (D-063) : objet « Réponse à votre message » ; la réponse de l'équipe (« Bonjour {prénom}, »), signée d'un prénom (« Julien, de l'équipe Widoo ») ; encart gris chaud « Votre message du {date}, {sujet} » avec le message d'origine ; « Répondez simplement à cet e-mail pour continuer l'échange. »
  • Mode sombre (D-070) : l'e-mail déclare color-scheme: light dark et une palette sombre, lue par Apple Mail, Outlook et les clients qui suivent prefers-color-scheme : fond #12151C, carte #1B1F29, texte #EEF1F7 (14,6:1), gris #A3ADBF (7,3:1 sur la carte, 8,1:1 sur le fond), lien #A9BFF0 (8,9:1), encart #262B38 (texte à 12,5:1), filet #2A3040, « widoo » en #7C9BE0 ; bouton inchangé (blanc sur blue, 4,51:1). Gmail sur téléphone inverse lui-même les couleurs sans lire cette palette : rien ne repose sur une image de texte, le logo garde son carré bleu opaque (PNG sans fond transparent), le bouton reste un lien coloré.
  • Durée des liens : « au bout de quelques heures » tant que la durée n'est pas fixée (Firebase : environ 6 heures relevées, non documentées) ; même durée pour les deux liens (Modele-de-Donnees › email_changes).
  • Proposé, non dessiné : prévenir l'ancienne adresse une fois le changement fait (bonne pratique de sécurité).

E-23 — Fiches des stores (captures, bannière, textes)

🟢 Validé le 2026-09-28 (planche 2 du ticket #187, D-069) · App Store : 1 · 2 · 3 · 4 · 5 · Google Play : 1 · 2 · 3 · 4 · 5 · bannière · textes des fiches · Claude Design

  • Rôle (cadrage d'Ilan : écran et accroche, cinq captures, fond bleu avec le chemin, français d'abord) : les images et les textes des fiches App Store et Google Play. Les PNG du wiki sont les fichiers à téléverser tels quels (sans transparence).
  • Formats : App Store, iPhone 6,9 pouces : 1320 × 2868 (l'app ne tourne que sur iPhone, supportsTablet: false, pas de captures iPad). Google Play : 1320 × 2640 (le côté long ne peut pas dépasser le double du court ; au moins 4 captures d'au moins 1080 px pour être mis en avant) ; bannière 1024 × 500, obligatoire.
  • Captures : fond blue avec les rues du plan de la hero de E-21 ; le chemin du logo (dégradé blanc, ombre) longe le téléphone et sort de chaque capture à la hauteur où il entre dans la suivante, départ (balade) dans la 1, arrivée (table) dans la 5 ; accroche blanche 34/38 800 en haut, moins de 20 % de l'image (règle de Google) ; téléphone à cadre encre avec un écran validé. 1 : « Que faire à Paris aujourd'hui ? », E-01 (prénom neutre « Camille ») ; 2 : « Tout est prévu : étapes, durée, budget », E-05 ; 3 : « Widoo vous dit quoi prévoir et quoi réserver », E-08 ; 4 : « Laissez-vous guider d'une étape à l'autre », E-07 sur place ; 5 : « Créez vos parcours et partagez-les », E-12 (sans le toast d'ajout). Jamais de « meilleur », « N° 1 », promotion ou appel à télécharger dans les images.
  • Bannière Google Play : logo et « Que faire à Paris aujourd'hui ? » à gauche, le parcours sur le plan à droite, éléments importants au centre.
  • App Store : nom « Widoo : sorties à Paris » (23/30) ; sous-titre « Balades et idées de sortie » (26/30) ; texte promotionnel « Des sorties toutes prêtes à Paris : les étapes, la durée, le budget et les horaires. Choisissez, programmez, laissez-vous guider. » (129/170) ; mots-clés que faire,week-end,visite,quartier,itinéraire,promenade,musée,café,restaurant,amoureux,famille (94/100) ; catégories Voyages, puis Style de vie.
  • Google Play : titre « Widoo : sorties à Paris » (23/30) ; description courte « Des sorties prêtes à vivre à Paris : étapes, durée, budget et horaires. » (71/80) ; catégorie Voyages et infos locales.
  • Description (les deux stores, 1 271/4 000) : « Que faire à Paris aujourd'hui ? Widoo vous propose des sorties toutes prêtes : des parcours de plusieurs étapes, avec la durée, le budget, la distance et les horaires de chaque lieu. » Puis quatre intertitres : « Choisissez votre sortie » (« Sur la carte, trouvez les parcours autour de vous : en amoureux, entre amis, en famille, sous la pluie ou sans rien dépenser. Chaque parcours affiche sa durée, son budget et ses étapes, vérifiés sur place par ceux qui l'ont fait. »), « Programmez-la » (« Choisissez le jour : Widoo vous dit quoi prévoir et quoi réserver, vérifie les horaires et vous rappelle la sortie la veille. »), « Laissez-vous guider » (« Sur place, suivez le chemin d'une étape à l'autre, sans rien rater en route. »), « Créez et partagez » (« Composez vos propres parcours, gratuitement, et partagez-les par un lien. Chaque parcours est relu par l'équipe Widoo avant d'être publié. ») ; « Gratuit, avec Premium en option » (« L'app est gratuite. Les parcours Premium s'ouvrent avec un abonnement (essai gratuit de 7 jours), un pass de 7 jours ou à l'unité. L'abonnement se renouvelle automatiquement ; vous pouvez le résilier à tout moment dans les réglages de votre compte Apple ou Google. ») ; liens des conditions d'utilisation et de la politique de confidentialité ; « Widoo commence par Paris. »
  • À aligner : adresses des conditions et de la politique proposées (widoo.app/conditions, widoo.app/confidentialite) sur les chemins des pages légales du site (#242, /fr/… et /en/…). Anglais : mêmes images et textes traduits, après validation (#201).

Marketing

E-25 — Réseaux sociaux (Instagram, TikTok, Facebook)

🟢 Planche 1 validée le 2026-09-29 (ticket #249, D-077) : photo de profil, profils, couverture Facebook, couvertures à la une, carrousel d'un parcours, posts · photo de profil · profils · couverture Facebook · à la une : idées de sortie · quartiers · nouveautés · comment ça marche · carrousel, fond bleu : couverture · étape · fin · fond clair : couverture · étape · fin · posts : idée de sortie, bleu · clair · avis, bleu · clair · Claude Design 🟢 Planche 2 validée le 2026-09-29 (ticket #249, D-078) : stories un parcours · idée de sortie · sondage · annonce de la sortie · compte à rebours · en repérage · vidéo courte : couverture · calque du titre · calque d'une étape · fin · première semaine du compte · mode d'emploi · lisibilité · Claude Design

  • Rôle (demande d'Ilan du 2026-09-28) : faire vivre les comptes Instagram, TikTok et Facebook plusieurs semaines avant le lancement du 12 décembre. Le marketing est porté par Sarah.
  • Outil (choix d'Ilan) : Claude Design seul. Les gabarits restent dans le canevas Marketing ; Sarah demande à Claude de les remplir (texte, photos, parcours) et reçoit les PNG aux formats des réseaux.
  • Direction : celle du site (E-21, « Le plan de Paris ») : plan bleu aux rues tournées, chemin du logo, photos en autocollants à bord blanc, pilules, Plus Jakarta Sans 800 et 500, blue #4E74C8 et blue-ink. Deux fonds par gabarit (choix d'Ilan : kit avec variantes) : bleu (texte blanc à 4,51:1, rues effacées sous le texte) et clair (plan bleu très pâle #EFF3FA, texte encre). Texte de 34 px au moins sur 1 080 px de large ; crédits à 30 px.
  • Ton (choix d'Ilan) : vouvoiement, comme l'app. Aucune note, aucun avis ni chiffre qui ne vienne du parcours ou d'un vrai avis ; jamais « meilleur » ni « N° 1 ».
  • Profils : même nom que les stores, « Widoo : sorties à Paris », même photo (l'icône de l'app, tirée du fichier source du logo, recadrée en rond, lisible à 44 px), même identifiant (@widooapp proposé, #248). Bios en français et en anglais : Instagram « Que faire à Paris ? Des sorties toutes prêtes. / Ready-made Paris outings, in English too. / Étapes, durée, budget. App gratuite. » (125 sur 150 caractères) ; TikTok « Sorties toutes prêtes à Paris. Ready-made Paris outings. App gratuite. » (70 sur 80) ; intro Facebook « Des sorties toutes prêtes à Paris : étapes, durée, budget. Ready-made Paris outings. » (84 sur 101). Lien : widooapp.com/app?src=instagram (tiktok, facebook), qui ouvre le store du téléphone avec la source mesurée (#240, #234).
  • Stories à la une (Instagram) : Idées de sortie (path), Quartiers (map-trifold), Nouveautés (megaphone-simple), Comment ça marche (hand-tap) ; 1080 × 1920, disque blanc de 580 px et icône bleue au centre du plan ; seul le rond central se voit, le titre se saisit dans Instagram. L'étincelle reste à Insolite, comme dans l'app.
  • Couverture Facebook : 1640 × 624, plan et parcours de la hero de E-21, logo, « Des sorties toutes prêtes à Paris » et « Ready-made outings in Paris, in English too. » dans les 1 110 px du centre, seuls visibles au téléphone.
  • Carrousel d'un parcours (4:5, 1080 × 1350) : couverture (« Parcours à Paris », titre, durée, nombre d'étapes, budget, photo, « Les 4 étapes ») ; une diapo par étape (« Étape 4 sur 4 », nom, catégorie et durée, temps de marche depuis l'étape précédente, photo, conseil du créateur s'il existe) ; fin « À faire avec Widoo » (ce que l'app ajoute, « Le lien est dans la bio », capture « Votre sortie » des stores, sans note). Le chemin du logo sort de chaque diapo à 1 150 px de haut et entre dans la suivante à la même hauteur ; la pastille de la catégorie (couleurs des familles de l'app) est posée dessus, le drapeau de fin termine la dernière diapo.
  • Posts : idée de sortie (accroche, une phrase, durée et prix, photo) ; citation d'avis : seulement un vrai avis (store ou app), recopié mot pour mot, avec l'accord de son auteur, son prénom, sa source et sa note ; jamais d'avis inventé.
  • Photos (choix d'Ilan) : celles de Sarah, prises sur place ; en appoint, photos libres (Wikimedia Commons, Unsplash) avec le crédit sous la photo (« Photo : J. Moreau, CC BY-SA 4.0 ») ; rien sous une photo de Sarah. Les maquettes reprennent les photos et le parcours d'exemple du site, marqués « Exemple ».
  • Gabarits : en pointillé rose, les valeurs variables : identifiant et adresse, tant que le domaine widooapp.com n'est pas acheté et que les comptes ne sont pas réservés (#248) ; en pastille rose, les annotations. Les deux disparaissent à l'export (PNG à la taille réelle, sans transparence).
  • Rythme (choix d'Ilan) : 3 posts par semaine et des stories, dès mi-novembre. Les parcours de Sarah ne sont pas encore prêts : la semaine type reprend l'exemple du site, à refaire avec ses parcours.
  • Stories (9:16, 1080 × 1920 ; choix d'Ilan : bilingues sur la même story) : français en grand, anglais dessous, plus petit, sur chaque story. Six gabarits : un parcours (fond bleu, chemin qui mène au sticker lien), idée de sortie (fond clair), sondage, annonce de la sortie (date en variable, capture « sur place » de E-07, sans note), compte à rebours (à partir de J-7), « En repérage » (photo de Sarah plein cadre). Les stickers d'Instagram (lien, sondage, compte à rebours) se posent dans l'app, aux emplacements marqués ; un lien porte toujours sa source : /r/…?src=instagram ou /app?src=instagram. Contenu entre 250 px du haut et 280 px du bas (marges prudentes : barre de progression, profil, champ de réponse).
  • Vidéo courte (Reels, TikTok ; choix d'Ilan : Sarah filme, Widoo habille) : couverture (une image de la vidéo, titre et repères dans la partie visible de la grille du profil, en 4:5) ; calque du titre sur les 3 premières secondes (carte blanche, logo, titre, repères) ; calque d'une étape à chaque arrivée (pastille de la catégorie, numéro et nom, catégorie et durée, progression) ; écran de fin de 2 à 3 secondes (logo, « Tout le parcours dans l'app Widoo », date de sortie). Calques en PNG transparents, posés dans l'app de montage ou dans Instagram et TikTok. Rien sous les 360 px du bas ni dans les 160 px de droite (légende et boutons).
  • Avant la sortie : « Le 12 décembre sur iPhone et Android. » partout où les gabarits disent « App gratuite, sur iPhone et Android. » ; la date reste en variable tant qu'elle n'est pas sûre. Pas de citation d'avis avant la sortie.
  • Texte sur photo : voile encre à 80 % au moins sous le texte (contraste tenu même sur un ciel blanc).
  • Première semaine du compte (choix d'Ilan : mi-novembre) : 3 posts (lundi carrousel d'un parcours, mercredi idée de sortie, vendredi vidéo de repérage) et 4 stories (parcours, sondage, en repérage, idée du week-end) ; légendes en français avec une ligne en anglais et trois mots-clés ; le même post sur Facebook, la vidéo aussi sur TikTok. Exemple avec les contenus du site, à refaire avec les parcours de Sarah.
  • Mode d'emploi (choix d'Ilan : planche et document du projet Claude) : ce qu'il faut demander à Claude, les règles, les longueurs qui tiennent (titre d'un parcours 45 caractères, nom d'étape 22, accroche 45, phrase 90, conseil 60, question de sondage 40), les formats rendus. Même contenu dans le document claude/widoo-mode-d-emploi-kit-reseaux.md du projet Claude widoo, que Claude suit quand Sarah demande un gabarit rempli.
  • Lisibilité : tous les couples de couleurs du kit à 4,5:1 au moins (le plus juste : blanc sur blue, 4,51:1) ; 34 px au moins sur 1 080 px (environ 12 points sur un téléphone), crédits et anglais secondaire à 30 px au moins ; zones à laisser libres par format.

E-24 — Imprimés (autocollant des lieux, cartes des hôtes et des hôtels, présentation partenaire)

🟢 Planche 1 validée le 2026-09-30 (ticket #244, D-079) : autocollant, piste la pastille · la ligne · le blanc · carte des hôtes : recto · verso · carte des hôtels : recto · verso · flyer : recto · verso · fichiers d'impression · Claude Design 🟡 Planche 2 à venir : présentations partenaires A4 (lieu, hôte, hôtel et une générale), en français et en anglais.

  • Rôle (ticket #244) : les supports que Sarah donne ou envoie aux partenaires (#213, #214, #215) : autocollant pour les lieux étapes d'un parcours, cartes pour les hôtes et les petits hôtels, flyer pour les événements et les commerces, présentation partenaire (planche 2). Imprimeur pas encore choisi (choix d'Ilan) : fichiers standard, acceptés par la plupart des imprimeurs en ligne.
  • Direction : celle de E-21 et de E-25 (« Le plan de Paris ») : plan bleu aux rues tournées, chemin du logo, pastilles des familles de l'app, photos à bord blanc, Plus Jakarta Sans 800 et 500. Les planches montrent le rendu imprimé, sans aucun repère ; repères, variables et règles sont regroupés sur la planche « Fichiers d'impression ».
  • Autocollant (choix d'Ilan : rond de 9 cm, texte bilingue court, « Adresse recommandée ») : trois pistes gardées, Sarah choisit selon la vitrine : la pastille (disque bleu, plan en couronne, QR code sur tuile blanche) ; la ligne (le parcours traverse l'autocollant comme une ligne de métro, le lieu est l'arrêt du milieu, le QR code sa bulle) ; le blanc (disque blanc, QR code à nu, bandeau bleu en bas). Même contenu sur les trois, centré et à l'horizontale : logo, QR code de 26 mm vers le parcours du lieu (/r/<parcours>?src=lieu-<lieu>), « Adresse recommandée », « Recommended spot ». Seul le QR code change d'un lieu à l'autre. Vinyle blanc adhésif, pelliculage mat ; fichier de 96 mm, découpe ronde de 90 mm (tracé « CutContour » sur un calque à part), zone sûre de 84 mm.
  • Cartes des hôtes et des hôtels (choix d'Ilan : A6 recto verso pour les deux) : recto sur le plan bleu : le logement (maison) ou l'hôtel (lit) au centre, « Vous êtes ici / You are here », trois sorties numérotées au bout de leurs chemins ; accroche « Nos sorties préférées autour de l'appartement » (hôtes) ou « Des sorties toutes prêtes au départ de l'hôtel » (hôtels), avec l'anglais dessous ; QR code de 26 mm pour installer Widoo (/app?src=hote-<hôte> ou hotel-<hôtel>), « Offert par {prénom}, votre hôte » ou « Offert par {hôtel} », en français et en anglais. Verso sur fond blanc : les trois parcours dans l'ordre du recto, chacun avec sa photo, son titre en français et en anglais, la durée, le budget par personne, le trajet depuis le logement en pictogrammes (à pied, métro ; lisibles dans les deux langues) et un QR code de 20 mm vers le parcours (/r/<parcours>, même source). Couché mat 350 g.
  • Flyer A5 recto verso (choix d'Ilan) : recto « Que faire à Paris aujourd'hui ? » (58 px, le seul grand titre) sur le plan avec le parcours de la hero du site, écran « Votre sortie » (E-08) presque à la taille d'un vrai téléphone, droit, aligné en bas sur le bloc du QR code de 26 mm (« Scannez pour télécharger Widoo », /app?src=flyer-<lieu>), date de sortie en français et en anglais. Verso : « Des sorties toutes prêtes à Paris » en trois temps sur une ligne de parcours (choisissez, programmez, laissez-vous guider ; photos, E-08, E-07), bandeau bleu avec QR code de 22 mm, date et adresse du site. Couché 170 g.
  • Fichiers d'impression : PDF en CMJN (Coated FOGRA39), police incorporée, fond perdu de 3 mm, textes et QR codes à 4 mm au moins du trait de coupe, textes à 9 points au moins (12 px à 96 ppp), contraste 4,5:1 au moins (le plus juste : blanc sur blue, 4,51:1). QR codes vectoriels, encre sur blanc, correction H (logo au centre), 20 mm au moins ; les 16 QR codes des planches décodés sur un rendu à 300 ppp. Source de chaque QR : lieu-, hote-, hotel- ou flyer- suivi d'un nom court sans accent (ex. hotel-abbesses), la même que dans le suivi des partenaires de Sarah.
  • Gabarit : Sarah demande à Claude de préparer un support (« l'autocollant du Café Lomi, parcours Montmartre sans les touristes », « la carte de Camille, hôte dans le 11e, avec ces trois parcours ») ; Claude génère les QR codes à la source du partenaire et rend le PDF d'impression avec un aperçu PNG à relire avant l'envoi. Marche à suivre dans le document claude/widoo-mode-d-emploi-kit-imprime.md du projet Claude widoo. Exemples des planches, à remplacer : Camille, l'Hôtel des Abbesses, les trois parcours et leurs trajets, les QR codes, la date du 12 décembre.
  • En attente : domaine widooapp.com et adresses /r/ et /app avec leur source (#248, #240, #234) : d'ici là, les QR codes restent des exemples ; les PDF définitifs se génèrent à l'export, un par partenaire. Date de sortie à confirmer.

Admin web

🟢 Écrans de référence validés le 2026-10-09 (ticket #339, D-086) : coque navigation par rôle · tableau de bord · A-01 connexion · lien envoyé · session expirée · compte sans rôle · compte suspendu · A-02 liste · vide · chargement · erreur · liste à 1 024 px · fiche · demander des modifications · refuser · publié · fiche à 1 024 px · modèles contrôles · panneau de détail · confirmation et toasts · thème shadcn · Claude Design

La spécification complète, les rôles et les treize écrans (A-01 à A-13) sont dans Admin-Web. Les écrans non dessinés suivent ces modèles en code (choix d'Ilan).

Coque, thème et modèles (tous les écrans de l'admin)

  • Cadrage d'Ilan (9 octobre) : navigation sur gris chaud ; fiche d'un parcours (A-02) en page dédiée ; style « outil compact » ; tableau de bord en chiffres seuls.
  • Thème shadcn/ui : couleurs, police et icônes du design system (tokens.json) ; --background bg, --foreground ink, --primary blue (texte on-blue, 4,51:1), --secondary, --muted et --accent surface, --muted-foreground muted, --destructive error-ink, --border line, --input control-border (3,5:1), --ring ink, --sidebar surface, --sidebar-accent bg, --sidebar-primary blue. L'admin étend error-ink et error-soft (réservés à « Refusé » dans l'app) aux retards de plus de 72 h, aux erreurs et aux actions destructives.
  • Formes et tailles : blocs, tuiles, panneaux et tableau en 12 px (--radius: 0.75rem), champs en 10 px, fenêtres en 16 px ; boutons, filtres et pastilles en pilule, comme dans l'app. Boutons de 36 px (32 petit, 44 à la connexion), champs de 40 px, filtres de 32 px, lignes de tableau de 44 px (54 px sur deux lignes), en-tête de colonne de 36 px. Ombre seulement sur ce qui flotte (menu, fenêtre, toast). Typographie : titre de page 22/28 800, titre d'une fiche 26/32 800, section 17/22 800, chiffre du tableau de bord 30/36 800, texte et cellules 14/20 500, libellé 13/18 700, en-tête de colonne 12/16 600.
  • Navigation : 248 px sur surface, logo et « Admin » ; sections groupées (À traiter : Modération, Signalements, Support ; Catalogue : Lieux et parcours, Brouillons IA, Traductions ; Communauté : Utilisateurs ; Revenus : Affiliation, Partenaires B2B ; Administration : Réglages, Journal), filtrées par rôle (matrice d'Admin-Web) ; section active sur bg, icône pleine blue ; compteurs « à traiter » en pastille, en rouge quand un élément attend depuis plus de 72 h (libellé lu : « 12 parcours à relire, dont 2 en retard »). De 1 024 à 1 279 px, menu réduit à 72 px d'icônes (Sidebar de shadcn, collapsible="icon"), libellé et compteur en info-bulle au survol et au focus ; « Réduire le menu » le replie aussi au-delà.
  • En-tête : 64 px, titre de la page, ou retour à la liste pour une fiche ; compte à droite (avatar, prénom, rôle) qui ouvre un menu : nom, adresse, rôle, « Se déconnecter ».
  • Tableau : en-têtes triables (flèche sur la colonne triée), lignes cliquables, survol surface, ligne ouverte blue-soft, focus clavier en anneau ; pagination « Précédent », « Suivant » ; états chargement (squelettes), vide (une phrase et l'action utile), erreur (bloc centré et « Réessayer »).
  • Panneau de détail : 400 px à droite de la liste, qui reste visible ; titre, statut, informations, contenu, actions en bas ; la croix ou Échap le ferme et rend le focus à la ligne (montré sur A-13 Support).
  • Confirmation : fenêtre de 520 à 640 px sur voile scrim ; le texte nomme l'effet ; motif obligatoire (liste codifiée et texte) pour toute action destructive ; bouton rouge seulement dans la confirmation, qui répète l'action (« Refuser la révision », « Fermer le lieu »).
  • Toast : celui de l'app (Sonner), en bas au centre du contenu, un seul à la fois : succès et information 4 s, attention 6 s, erreur jusqu'à l'action (« Réessayer »).
  • Accessibilité : contrastes mesurés (planche « Thème shadcn ») ; anneau de focus encre de 3 px décalé de 3 px sur tout élément focusable ; jamais la couleur seule (retard : rouge, icône et texte lu « en retard ») ; vrais boutons, liens et champs avec libellés.

A-01 — Connexion

  • Page sur surface, logo, carte blanche de 440 px : « Connexion à l'admin Widoo », « Réservée aux comptes de l'équipe Widoo. », « Continuer avec Google », « ou », adresse e-mail et « Recevoir un lien de connexion » ; « Un problème d'accès ? Demandez à un admin de l'équipe. ».
  • Lien envoyé : « Vérifiez votre boîte mail », l'adresse en gras, « Le lien ne sert qu'une fois et expire au bout de quelques heures. », renvoi après 60 s, « Utiliser une autre adresse ».
  • Session expirée : encadré blue-soft au-dessus des choix, qui rappelle la page demandée (« Reconnectez-vous pour revenir à la file de modération. »).
  • Refus (encadré error-soft, au-dessus des choix pour essayer un autre compte) : « Ce compte n'a pas accès à l'admin. » avec l'adresse utilisée ; « Ce compte est suspendu. » avec « Pour en savoir plus, adressez-vous à un admin de l'équipe Widoo. ».

A-02 — File de modération

  • Liste : recherche (« Rechercher un titre ou un auteur »), nombre de parcours, filtres en chips (En relecture, Modifications demandées, Plus de 72 h, Révisions, Ville) ; colonnes Parcours (titre, puis « Première soumission » ou « Révision » et la pastille « À corriger »), Auteur (sceau certifié), Ville, Contenu (« 4 étapes, 7 h »), Alertes (avertissements restants, alert, ou « Aucune »), Non vérifiés, En file (tri par défaut, du plus ancien ; rouge avec icône au-delà de 72 h). À 1 024 px, la ville passe sur la deuxième ligne du titre.
  • Fiche (page dédiée) : retour à la file, « Parcours 1 sur 14 » et flèches vers le précédent et le suivant ; pastilles de statut, « Révision », Premium calculé ; titre ; auteur (vers A-06), langue, quartier, temps en file. Colonne principale : avertissements de cohérence (encadré alert-soft), changements depuis la version publiée pour une révision (avant et après), le parcours tel qu'il sera publié (photos, ambiance, description, durée, budget, étapes, distance), carte et étapes (horaires, coût, « Réserver » et « Lien affilié », « Lieu jamais vérifié », trajets ; noms des lieux vers A-04). Colonne de décision de 320 px (296 px à 1 024 px) : les 6 règles de la charte à cocher, « Publier » actif quand toutes sont cochées, « Demander des modifications », « Refuser » ; auteur et ses chiffres ; historique du parcours.
  • Décisions : Publier sans confirmation (réversible par Dépublier dans A-04), toast « Parcours publié » ou « Révision publiée », compteur mis à jour, « Parcours suivant ». Demander des modifications : message obligatoire, envoyé par notification et e-mail selon les réglages de l'auteur ; statut « À corriger ». Refuser : un des 7 motifs codifiés (Pas un vrai parcours, Lieu invalide, Description insuffisante, Photos non conformes, Contenu promotionnel, Contenu interdit, Doublon) et un message. Pour une révision, les textes disent que la version publiée reste en ligne.

A-05 — Tableau de bord

  • À traiter : tuiles cliquables sur surface (icône, libellé, chiffre, précision), vers la liste filtrée, seulement celles du rôle : parcours à relire (le plus ancien en rouge au-delà de 72 h), signalements ouverts, messages de support, brouillons IA à relire, traductions en échec. « Mis à jour il y a 2 min » et « Actualiser ».
  • Catalogue et Utilisateurs : chiffres seuls en bandeau surface (choix d'Ilan) ; liens « Analyses dans PostHog » et « Abonnements dans RevenueCat ».
  • Les chiffres des planches sont des exemples.

Accueil

Produit

Technique

Pilotage

Clone this wiki locally