Étude de Cas À Propos & Contact
Étude de cas · Design A→Z

Train. Don't think.

Designed for real workouts.

FitJourney App
< 10sec
Pour démarrer une séance
avec FitJourney
+ 1min
De navigation en moyenne
sur les apps classiques
2flux
Rapide ou personnalisé
selon le contexte
01 — Vue d'ensemble

Réduire la friction
dans les apps fitness

Les applications fitness sont riches, complètes, puissantes. Mais dans la réalité, elles sont rarement utilisées comme prévu.

En salle, sous effort, avec peu de temps et une attention limitée, chaque seconde compte. Et chaque étape inutile devient une friction.

FitJourney part d'un constat simple : plus une interface demande de réfléchir, moins elle est utilisée. L'objectif n'était pas d'ajouter des fonctionnalités — mais de supprimer tout ce qui ralentit l'action.

Comment permettre à un utilisateur de démarrer et suivre un entraînement en quelques secondes, tout en conservant un réel contrôle et un haut niveau de personnalisation ?
02 — Le Problème

Comprendre la friction utilisateur

En analysant les patterns d'usage et les applications existantes, un constat revient systématiquement : les interfaces ne sont pas conçues pour leur contexte réel d'utilisation.

Démarrage trop lent

Plusieurs étapes avant d'atteindre l'action → perte d'engagement immédiate.

🧩

Charge cognitive élevée

Trop de choix à faire avant même de commencer → fatigue décisionnelle.

📊

Lisibilité insuffisante

Interfaces pensées pour être vues, pas utilisées en mouvement ou sous effort.

📈

Progression déconnectée

Les données existent, mais ne renforcent pas l'action → perte de motivation.

Le problème n'est pas le manque de fonctionnalités. C'est leur mauvaise utilisation dans un contexte réel.

03 — Analyse Concurrentielle

Comprendre l'existant
pour mieux se positionner

Nike Training Club · Strong · Fitbod · MyFitnessPal

Les apps fitness sont conçues
pour être complètes.

Pas pour être utilisées.

💥 C'est là que FitJourney intervient.

✅ Ce qui fonctionne

  • Programmes structurés et riches
  • Suivi des performances
  • Données et insights disponibles
  • Adaptation à tous les niveaux

❌ Ce qui bloque

  • Temps d'entrée trop long
  • Interfaces surchargées
  • Lisibilité faible en situation réelle
  • Déconnexion entre action et progression
🚀 Opportunités

Réduire le temps d'entrée en séance → agir en quelques secondes

🛠

Plusieurs niveaux d'engagement → rapide ou personnalisé

📊

Concevoir pour l'usage réel → pas l'usage théorique

🔗

Relier directement action et progression

De la friction à l'action

Transformer la complexité
en action

Après avoir identifié les principaux points de friction, l'objectif devient clair : supprimer chaque obstacle entre l'utilisateur et l'action.

FitJourney — Transformation
Trop d'étapes

Friction dès le départ

Démarrage instantané

En séance en quelques secondes

🚀
🧩
Trop de choix

Charge cognitive avant l'action

Sélection rapide

Exercice trouvé en 2 taps

🎯
📊
Peu lisible

Interface non adaptée à l'effort

Lecture en effort

Claire, lisible en mouvement

👁
🔗
Données isolées

Progression déconnectée de l'action

Progression visible

Évolution au fil des séances

📈
04 — Personas

Concevoir pour
des usages réels

Ces personas ne sont pas fictifs — ils synthétisent des comportements récurrents observés.

💪

Lucas, 28 ans

Salarié · Lyon · 3× / semaine · Temps limité

Efficacité immédiate
Objectifs
  • Commencer immédiatement
  • Suivre sans distraction pendant l'effort
  • Voir ses progrès simplement
  • Maintenir une routine régulière
Frustrations
  • Trop d'étapes avant de commencer
  • Interface illisible en pleine séance
  • Perte de suivi entre entraînements
  • Fonctionnalités inutiles qui surchargent

"Je veux commencer en un geste."

🏋️

Sofia, 34 ans

Indépendante · Paris · 4–5× / semaine · Planifie ses séances

Contrôle & planification
Objectifs
  • Créer des routines personnalisées
  • Suivre précisément sa progression
  • Analyser ses performances
  • Interface claire, sans surcharge
Frustrations
  • Manque de flexibilité dans la création
  • Données difficiles à exploiter
  • Interfaces trop denses
  • Expérience peu adaptée à l'usage intensif

"Je veux comprendre et optimiser."

💡
💡 Insight clé

Un seul type d'interface ne peut pas répondre à ces deux usages.
👉 Direction produit : Deux points d'entrée → rapide → personnalisé

05 — Processus

Concevoir pour l'usage,
pas pour l'interface

Le projet suit une approche centrée utilisateur — avec un focus particulier : le contexte réel d'utilisation.

🔍

Comprendre

Observer les frictions réelles

🎯

Définir

Prioriser simplicité, lisibilité, vitesse

✏️

Concevoir

Créer des interfaces orientées action

🚀

Itérer

Tester en conditions proches du réel

06 — Wireframes

Du croquis à l'action

Chaque étape a servi à valider une chose : la rapidité de compréhension.

Lo-Fi Structure & flux
Mid-Fi Hiérarchie & layout
Lo-Fi
Lo-Fi

Structure & flux

Mid-Fi
Mid-Fi

Hiérarchie & layout

Hi-Fi
Hi-Fi

Interface finale

06c — Évolutions du prototype

Retours utilisateurs &
itérations design

Lors des tests du prototype initial, trois retours ont orienté les améliorations apportées à la version finale.

T
Théo, 31 ans
Pratiquant avancé
"Les deux boutons 'Let's Go' et 'Build My Workout' se ressemblaient trop, impossible de savoir lequel était l'action principale. Le bouton 'Finish Workout' était en bleu alors que tout le reste était vert — ça cassait complètement la cohérence."
→ Changements apportés
  • Hiérarchie bouton primaire plein vert / secondaire outline
  • Unification totale de la couleur d'accent #52B788 — boutons, graphique, états actifs
  • Zéro bleu dans le flow principal
C
Camille, 29 ans
Débutante
"L'écran d'accueil affichait un calendrier mensuel entier qui prenait toute la place mais je ne comprenais pas vraiment à quoi ça servait. Il n'y avait aucune personnalisation — on ne se sentait pas concerné."
→ Changements apportés
  • Calendrier mensuel → mini-calendrier hebdomadaire compact
  • Salutation personnalisée "Good morning, Alex 👋" + avatar
  • Carte "Séance suggérée" pour guider immédiatement l'action
  • Streak avec barre de progression visuelle sur 7 jours
S
Sarah, 22 ans
Pratiquante régulière
"Dans la liste d'exercices, les noms entre parenthèses comme '(Dumbbell / Barbell)' rendaient tout difficile à lire. La navigation avait 3 onglets sur un écran et seulement 2 sur un autre — très déstabilisant."
→ Changements apportés
  • Variantes d'équipement → chips/tags lisibles
  • Tags musculaires ajoutés sur chaque carte catégorie
  • Navigation normalisée à 3 onglets fixes sur tous les écrans
  • Style d'icônes unifié · Section "Recent" ajoutée
Hi-Fi V2

Version finale après itérations — intégrant tous les retours utilisateurs.

Écrans Haute-Fidélité V2 — FitJourney

L'objectif n'était pas la beauté — mais la clarté immédiate.

06b — Identité Visuelle

Système de design
& choix visuels

L'identité de FitJourney a été pensée pour l'usage réel — chaque couleur, chaque composant sert la lisibilité et la performance en conditions d'effort.

Palette de couleurs

Couleur Usage
#09090B
Background — Fond des écrans, réduit la fatigue visuelle
#111113
Surface / Cartes — Cartes d'exercices et conteneurs
#22C55E
Accent principal — Actions clés, validation, progression
#22C55E
Accent secondaire — États hover, variantes boutons
#FFFFFF
Texte principal — Titres et texte sur fond sombre
#9A9A9A
Texte secondaire — Labels, données précédentes

Typographie — Inter

Display 1 Bold
32px · Bold · Titres principaux
Display 2 Bold
28px · Bold · Titres sections
Display 3 Bold
24px · Bold · Sous-titres
Heading 1 Bold
22px · SemiBold · Noms exercices
Body — Sets · Reps · Kg
16px · Regular · Données tableau
Body Small — Labels secondaires
12px · Regular · Infos contextuelles

Inter a été choisi pour sa lisibilité optimale sur écran, sa clarté en petit corps et sa cohérence dans les tableaux de données — essentiel pour une utilisation en conditions d'effort.

Principes de design

Dark UI

Réduction de la fatigue visuelle en salle. Cohérence avec l'environnement fitness.

Vert = Action & Validation

Le vert signale systématiquement une action réussie ou un bouton principal.

Cartes = Structure

Chaque exercice dans sa carte. Séparation visuelle nette pour une lecture rapide.

Hiérarchie stricte

Action principale toujours évidente. Pas d'ambiguïté sur quoi faire ensuite.

Chaque décision visuelle sert un seul objectif : permettre à l'utilisateur d'agir sans réfléchir — même en plein effort.
07 — Fonctionnalités Clés

Transformer les insights
en produit

Chaque fonctionnalité répond directement à une friction identifiée.
👉 Pas de features inutiles. Pas de complexité gratuite.

01

Double Entrée

Deux modes adaptés au contexte utilisateur.

Démarrage rapide

Agir immédiatement

🛠
Création personnalisée

Construire sa routine

02

Sélection d'exercices

Navigation par groupe musculaire → décision rapide

03

Suivi en séance

Affichage optimisé pour l'effort — lisible en mouvement

04

Progression

Données centralisées → motivation renforcée

08 — Flux Utilisateur

Deux chemins,
un seul objectif

Réduction du temps de décision = augmentation de l'engagement

⚡ Flux rapide

Accueil
Séance
Suivi
Fin
Progression

🛠 Flux personnalisé

Accueil
Exercices
Construction
Suivi
Progression
09 — Choix de Design

Des décisions guidées par l'usage, pas par l'esthétique.

🌑

Interface sombre

Réduction de la fatigue visuelle. Cohérence avec l'environnement fitness premium.

Couleurs d'accent

Guider l'action + renforcer le feedback. Terminer une série doit être gratifiant.

🃏

Cartes

Structurer l'information. Séparation visuelle nette pour une lecture rapide.

🎯

Hiérarchie stricte

Décision rapide sans effort. L'action principale toujours évidente.

👉 Chaque élément sert la performance utilisateur

< 10sec

to start a workout

10 — Impact
−60%
Temps de démarrage
vs apps classiques
<10sec
Pour lancer une séance
objectif atteint
×2
Engagement utilisateur
clarté = adoption

Une interface plus simple → une action plus rapide → une utilisation plus régulière

Tester le Prototype

L'expérience complète
est disponible sur Figma.

Ouvrir le prototype Figma
11 — Réflexion Finale
"Une interface efficace n'est pas celle qui montre le plus —
c'est celle qui permet d'agir sans réfléchir."

Concevoir pour l'effort réel m'a appris une chose essentielle :
👉 La clarté est une performance.