Optime Mockup
Conception UX/UI & Analyse Critique • 2025-2026

OPTIME.

Mon Rôle

UI/UX Designer

Mes Outils

Figma

Le Cadre

Creativ'Lab (Projet Académique)

La Durée

1 Semaine

01. Le Concept

Dissonance cognitive et hostilité d'interface.

La promesse de surface (Le leurre) : OptiMe se présente comme le coach de vie digital ultime. C'est un tracker holistique (sport, sommeil, nutrition) au design épuré, pensé pour un public visant l'optimisation personnelle absolue.

La réalité de l'expérience (Le piège) : Sous son vernis premium, l'interface est une machine à culpabiliser. Elle remplace le renforcement positif par le stress, punissant l'inaction au lieu de récompenser l'effort.

L'objectif du projet : Prouver qu'une interface peut être esthétiquement désirable et fonctionnelle, tout en étant psychologiquement hostile pour forcer l'engagement et maximiser sa rentabilité financière.

Objectifs de l'Étude

Objectifs Conceptuels (UX)

  • Distinguer ce qui relève de l'antidesign et ce qui relève du dark pattern.
  • Comprendre l'impact de choix UX/UI non conventionnels sur l'expérience utilisateur.
  • Analyser les mécanismes de persuasion agressive et de manipulation comportementale.

Contraintes de Conception

  • Intégrer au minimum 2 à 3 mécaniques de dark patterns identifiables.
  • Intégrer au minimum 2 à 3 choix structurels relevant d'une logique d'antidesign.
  • Proposer un prototype Figma complet sur le format mobile (375px).
02. Méthodologie

Mon processus de conception.

J'ai structuré ma démarche autour du ciblage des vulnérabilités de l'utilisateur et de la création d'un leurre visuel.

Phase 1 : Cible & Vulnérabilités

La cible vise la Génération Z et les Milléniaux (18-35 ans), étudiants ambitieux ou jeunes actifs urbains biberonnés à la "Hustle Culture" (performance et dépassement de soi). Pour les impliquer, j'ai modélisé le persona de Maxime :

  • Maxime (27 ans, Analyste financier junior) : adepte des routines matinales à 5h, des douches froides et de la Dopamine Detox. Son identité numérique est fusionnée avec ses statistiques.
  • Vulnérabilité exploitée : l'aversion à la perte et la peur de l'échec (FOMO). Perdre sa "streak" (série de jours) est vécu comme une défaite identitaire. La streak sert d'otage psychologique.
Phase 2 : Architecture & Scission des Parcours

L'écosystème est centré sur la donnée (Nutrition, Sport, Sommeil). Pour maximiser la conversion, j'ai scindé le parcours : le Parcours Gratuit est bridé dans ses analyses, chaque page devenant un tunnel de vente rappelant ce qui manque pour être performant. Le Parcours Premium lève les barrières et flatte l'ego. La barre de navigation inférieure (Tab bar) est faite pour pousser l'utilisateur à vérifier ses indicateurs de manière compulsive.

Phase 3 : Moodboard & Autorité Clinique

Pour faire baisser la garde de l'utilisateur, le design emprunte les codes des trackers de santé haut de gamme et moniteurs médicaux (autorité clinique). Cette omniprésence de données chiffrées (BPM, calories) rassure sur la précision scientifique. La colorimétrie associe des fonds sombres neutres à un orange très vif d'urgence pour maintenir une pression permanente.

03. La Solution

Interfaces, Antidesign et Dark Patterns.

1. La phase fonctionnelle (Zoning & Wireframes)

La hiérarchie anxiogène est posée dès les wireframes : le haut de l'écran flatte l'ego, tandis que la zone inférieure accumule visuellement les tâches inachevées pour alourdir la charge mentale. Les hitboxes pour annuler ou revenir en arrière sont délibérément sous-dimensionnées pour compliquer la sortie.

figma.com
Architecture & Parcours Utilisateur

Architecture & Parcours Utilisateur

figma.com
Zoning & Wireframes structurels

Zoning & Wireframes structurels

figma.com
Wireframe - Home

Wireframe - Home

figma.com
Wireframe - Nutrition

Wireframe - Nutrition

figma.com
Wireframe - Sommeil

Wireframe - Sommeil

figma.com
Wireframe - Sport

Wireframe - Sport

2. L'intégration visuelle et le Kit UI

Pour la maquette finale, j'ai décliné le Kit UI avec une esthétique Brutaliste et clinique. Des contrastes agressifs et des boutons déformés viennent forcer l'engagement tout en instaurant des frictions ergonomiques calculées.

optime-app.com
Maquette - Home (Anti-design)

Maquette - Home (Anti-design)

optime-app.com
Maquette - Nutrition (Bouton inversé)

Maquette - Nutrition (Bouton inversé)

optime-app.com
Maquette - Sommeil (Aversion à la perte)

Maquette - Sommeil (Aversion à la perte)

optime-app.com
Maquette - Sport (Chaos visuel)

Maquette - Sport (Chaos visuel)

optime-app.com
Maquette - Profil (Culpabilisation)

Maquette - Profil (Culpabilisation)

Détails des Mécanismes Implémentés

La donnée fantôme (Antidesign) :Sur l'écran des statistiques, l'information la plus importante (la progression à 75 %) est reléguée au rang de simple élément de décor, noyée dans l'arrière-plan, afin de créer une surcharge cognitive empêchant une lecture rapide.

L'anti-pattern ergonomique (Antidesign) :Le bouton "Retour" est positionné à droite sur la page de Nutrition, à l'encontre de tous les standards d'interface mobile, provoquant des erreurs de clic répétées.

Le chaos visuel (Antidesign) :Sur la page "Carburant", l'historique des repas est dépourvu de toute grille d'alignement. Les étiquettes s'empilent et se chevauchechnt de manière asymétrique pour saturer l'utilisateur et lui vendre la clarté de la version Premium.

La fausse affordance (Dark Pattern) :Le point d'entrée pour se désabonner repose sur une tromperie visuelle : le texte souligné "Mon engagement est à revoir" utilise les codes d'un hyperlien mais est inactif. Le vrai bouton cliquable est le texte brut coloré "J'accepte ma stagnation.".

L'attaque de l'ego & Boucle d'usure (Dark Pattern) :Les textes d'annulation culpabilisent et humilient l'utilisateur ("Je me satisfais de la médiocrité", "Oui, je valide ma régression"). Le parcours de sortie exige de franchir des cascades de pop-ups menaçant d'effacer les données biométriques ("Ultime validation de faiblesse") afin d'épuiser cognitivement l'utilisateur.

04. Résultats

Validation & Indicateurs.

Indicateurs de réussite de la recherche par l'absurde

01

Dissonance Cognitive Réussie

Le vernis minimaliste et premium a fonctionné comme un gage de confiance pour faire baisser la garde de l'utilisateur avant l'intervention des dark patterns.

02

Frustration Volontaire Validée

Le déplacement du bouton retour à droite et le chaos visuel ont généré les erreurs d'interaction et la paralysie cognitive recherchées dans l'expérience gratuite.

03

Efficacité de l'Épuisement

La boucle de validation d'annulation par pop-ups en cascade a démontré son pouvoir de découragement en épuisant l'effort de l'utilisateur.

Prise de recul éthique

L'interface d'OptiMe franchit la limite éthique lorsqu'elle cesse d'être un outil au service de l'utilisateur pour devenir un générateur d'anxiété monétisable. Si ces dark patterns sont redoutables pour déclencher une conversion immédiate (achat d'impulsion), ils sont destructeurs pour la rétention à long terme car un utilisateur épuisé finira par désinstaller le service.

AC
Analyse CritiqueBilan et Limites Éthiques (Creativ'Lab)

Le Design n'est Jamais Neutre.

Concevoir cette interface hostile a été une véritable révélation sur mon métier de designer. Briser délibérément les règles de l'UX (placer Retour à droite, supprimer la grille) est le meilleur moyen de comprendre la raison d'être profonde et la nécessité de ces standards.

Une version saine d'OptiMe (Design Responsable) conserverait l'esthétique épurée qui attire la cible, mais restaurerait la grille sur la page Nutrition, replacerait le bouton retour à gauche, utiliserait des refus neutres ("Non, merci") et proposerait un désabonnement simple en un clic dans les paramètres, en récompensant les victoires au lieu de punir le besoin de repos de l'utilisateur.