Design Thinking · Design Basse Fidélité · Design Haute Fidélité

Movie Pass — Réserver sa place de cinéma

Movie Pass est une application conçue pour répondre aux amoureux du cinéma qui souhaitent commander rapidement et facilement leur place de cinéma.

Design Thinking Low-Fidelity High-Fidelity Tests utilisateurs
Voir le résultat Voir le prototype

Refonte V2 — j'ai repris ce projet pour retravailler entièrement la direction artistique et la structure de l'application, avec une identité "cinéma premium" (Noir) et un vrai design system réutilisable.

Responsabilités

Personas

Avant de dessiner le moindre écran, j'ai défini deux profils types à partir de l'audit concurrentiel et de courts entretiens utilisateurs, pour identifier leurs attentes et leurs freins face à la réservation de place de cinéma en ligne.

Wireframes & basse fidélité

Avant de reprendre l'identité visuelle, j'ai retravaillé la structure de chaque écran en niveaux de gris : hiérarchie de l'information, zones de contenu, emplacement des actions principales. Cette étape permet de valider l'organisation avant d'investir du temps sur le visuel final.

Prototype haute fidélité

J'ai ensuite appliqué l'identité "Noir" (fond sombre, rouge cinéma, typographie éditoriale) et un vrai design system de composants réutilisables, pour aboutir à une interface cohérente sur tout le parcours : découverte, fiche film, réservation et compte.

Avant / après la refonte de la sélection de séance

En basse fidélité, le choix du jour de séance imposait de comparer plusieurs cases sans repère visuel clair. En V2, la séance du jour est mise en évidence par défaut et les informations film/avis sont regroupées en onglets pour réduire la charge de lecture.

Sélection de séance en basse fidélité
Avant — structure en niveaux de gris, sans hiérarchie visuelle sur les créneaux.
Sélection de séance en haute fidélité V2
Après — séance du jour mise en avant, onglets Sessions/Info/Reviews pour prioriser l'action de réservation.

Design System

Pour garantir la cohérence sur l'ensemble du parcours, j'ai formalisé un design system : palette de couleurs, typographie éditoriale (display en serif italique), échelle d'espacement/radius, et une bibliothèque de composants réutilisables (boutons, champs, cartes, sélecteurs de séance et de siège).

Prototype final

Ce projet m'a permis de mesurer l'importance de tester tôt, avant même d'avoir un visuel abouti : les ajustements les plus utiles sont venus des retours sur le prototype basse fidélité, pas de la phase de design final.

Accédez au prototype Figma interactif.

Voir le prototype Figma

Logiciels utilisés

Figma

UI DESIGN

Figma

Maquettes & composants.

Photoshop

Assets

Photoshop

Retouches visuelles.

Google Drive

Organisation

Drive

Documentation & partage.

Miro

Idéation

Miro

Brainstorming & parcours.