MYINFOMATE · MODULE SECTIONPARCOURS
Parcours guidés & Escape game
Une direction repensée pour SectionParcours : plus éditoriale, plus immersive, tout en gardant la mécanique de votre app (couleur primaire dynamique, contraste WCAG auto, états d'étapes, bottom sheets). Le mode Game bascule dans une ambiance sombre et dorée, nettement distincte du mode normal.
TYPOGRAPHIE
Newsreader
Titres & récit · serif éditorial
Hanken Grotesk
Interface · sans-serif
COULEUR PRIMAIRE · DYNAMIQUE
Ardoise
Garrigue
Terracotta
Game
ÉTATS D'ÉTAPE
Complétée
3
Courante
Verrouillée
Prototype interactif
Cliquez pour parcourir le flux complet · changez la couleur et basculez en mode Game
Le parcours, écran par écran
Mode normal
1Carte de section · Home
2Liste des parcours · Bottom sheet
3aDémarrage · mode normal
4bProgression sans carte
NEWDétail d'étape · contenu riche
6aFin · mode normal
Couleur primaire dynamique
Même écran 4a · la couleur de chaque instance pilote accents, pins & boutons (texte auto-contrasté)
Ardoise · #264863
Garrigue · #3B6B4A
Terracotta · #B5562E
MODE GAME · AMBIANCE IMMERSIVE
Quand le parcours devient une énigme
Fond sombre, sceau doré, voix narrative en italique : le mode Game rompt volontairement avec le mode normal, tout en réutilisant les mêmes briques (bottom sheet, défis, états). La transition reste cohérente.
3bDémarrage immersif
5Énigme · digicode
6bVictoire
Les quatre types de défi
Overlay sur l'étape · feedback succès (vert) / échec (rouge)
QCM · choix multiple
Texte libre · clavier
Digicode · pavé numérique
Puzzle image · grille
Feedback · succès
Feedback · échec
Prochaines étapes possibles : brancher de vraies photos de couverture & vignettes d'étapes · intégrer la vraie carte (les pins/route suivent déjà la couleur primaire) · ajouter les micro-transitions entre étapes · décliner le digicode / puzzle avec vos contenus réels.