Invité·e
UI/UX DesignFigmaHTML/CSSJavaScriptWordPressPhotoshopIllustratorAfter EffectsBlenderAstroPremiere ProInDesignTailwind CSSUI/UX DesignFigmaHTML/CSSJavaScriptWordPressPhotoshopIllustratorAfter EffectsBlenderAstroPremiere ProInDesignTailwind CSS
UX/UI DesignMobile AppFigma
S.T.A.R. Labs
À propos du projet
Pour ce projet, j'ai imaginé une application visant à aider un personnage fictif. J'ai choisi l'univers des superhéros (Flash, Supergirl, Arrow). L'objectif était de concevoir une interface permettant de signaler des crimes et délits.
Rôle
UX/UI DesignerDurée
Septembre 2023Équipe
Projet individuelOutils
Figma
Aperçu Global
Prototype de l'application S.T.A.R. Labs sur iPhone 15 Pro
Bilan & Apprentissages
- 1Processus UX complet : personas, user flows, wireframes, prototypage
- 2Design d'interface mobile immersive dans un univers fictif
- 3Prototypage interactif avec animations et transitions sur Figma
- 4Conception d'un parcours utilisateur optimisé pour l'urgence
L'essentiel
Comment concevoir une interface mobile intuitive et immersive dans l'univers DC Comics, qui permette un signalement rapide de crimes tout en étant crédible dans son univers fictif ?
01Contexte & Défi
Contexte & Brief
Projet UX/UI : concevoir une application mobile fictive pour S.T.A.R. Labs (univers DC Comics) permettant aux citoyens de signaler des crimes et de suivre l'activité des superhéros.
- Projet académique : concevoir une app mobile pour un univers fictif.
- Univers choisi : DC Comics — Flash, Supergirl, Arrow.
- Concept : S.T.A.R. Labs — signalement de crimes et suivi des superhéros.
- Premier projet UI/UX complet réalisé sur Figma.
02La Problématique
La Problématique
Comment concevoir une interface mobile intuitive et immersive dans l'univers DC Comics, qui permette un signalement rapide de crimes tout en étant crédible dans son univers fictif ?
- Créer une interface immersive fidèle à l'univers DC Comics.
- Permettre un signalement de crime en un minimum de taps (3 taps maximum).
- Équilibrer l'esthétique futuriste et l'utilisabilité quotidienne.
03Notre Démarche
Démarche & Processus
Un processus UX complet, de la recherche utilisateur au prototypage interactif.
- Recherche UX : étude de l'univers DC Comics et de ses codes visuels.
- Création de personas (citoyen de Central City, superhéros).
- User flows de signalement d'urgence optimisés pour la rapidité.
- Analyse d'apps similaires (urgences, sécurité civile).
- Wireframes basse fidélité → prototypage interactif haute fidélité sur Figma.
04La Solution proposée
La Solution
Une application mobile complète avec un design sombre et futuriste fidèle à l'univers S.T.A.R. Labs.
- Écran d'accueil immersif avec dashboard temps réel.
- Carte interactive de Central City avec localisation des incidents.
- Signalement en 3 taps : localisation → type de menace → confirmation.
- Profils de héros avec historique des interventions.
- Design sombre et futuriste fidèle à l'univers DC Comics.
05Mesure des Résultats
Résultats & Apprentissages
Un prototype Figma complet et interactif, validé par des tests utilisateurs.
- Prototype Figma complet et interactif avec animations et transitions.
- Parcours utilisateur fluide validé par des tests.
- Premier projet UI/UX complet réalisé sur Figma.
- Maîtrise des composants, auto-layout et prototypage interactif Figma.
Aperçu Global
Bilan & Apprentissages
- 1Processus UX complet : personas, user flows, wireframes, prototypage
- 2Design d'interface mobile immersive dans un univers fictif
- 3Prototypage interactif avec animations et transitions sur Figma
- 4Conception d'un parcours utilisateur optimisé pour l'urgence
