DA, UX & UI Designeuse, Illustratrice
Projet de Mémoire — Master Multimédia
2020
Les pages principales de la WebApp, accessibles via la barre de navigation, sont : la home (qui recense l'entièreté des films d'animation de la plateforme), les favoris et la page profil.
Un menu sticky latéral permet de rechercher un film ou de filtrer la home et la page favoris.
Les filtres sont basés sur les critères du Test de Brave (présenté dans l'onboarding et dans le profil).
Ce système de filtre permet une expérience éducative visuelle informant l'utilisateur·rice du peu de production représentant de manière positive les personnages féminins.
La homepage et la page favoris permettent également de trier les films selon des critères de recherches fréquemment utilisés (studio d'animation, présence de chansons...).
Si l'utilisateur·rice consulte le descriptif d'un film qui ne valide par un ou plusieurs critères du Test de Brave, il ou elle peut cliquer sur ce dit critère pour obtenir une liste de films validant le critère sélectionné.
La réflexion UX a été centrale pour ce projet qui présente des cibles aux usages et âges variés.
Ci-après vous est présenté un échantillon de ma démarche de création UX.
Userflow
Wireflow
Le logo de Brave représente un poing levé, un signe de protestation et de résistance qui illustre la démarche d'émancipation de la WebApp. Il renvoie également à l’affiche "We Can Do It!", qui représente le mouvement d’indépendance des femmes dans l’inconscient collectif.
Le logo est illustré à la main de manière naïve pour rappeler le domaine de l'enfance, mais aussi celui du film d'animation.
Outline & Filled
Responssive & Utilisation
Brave possède une mascotte, qui n’est ni-nommée, ni-genrée. Il s’agit d’un personnage androgyne dessiné avec un style schématique suivant l’identité visuelle de Brave.
Le wording associé à ce personnage ainsi que sa gestuelle se veulent ludiques et distrayants dans le but de créer une réponse émotionnelle positive envers la WebApp.
L’interface de Brave est sobre et porte une attention particulière aux illustrations et pictogrammes utilisés (principalement ceux symbolisant les critères du Test de Brave).
Icônes et pictogrammes
CTA principaux & secondaires
Les couleurs de cette marque sont majoritairement choisies dans une gamme sombre pour renvoyer au domaine du cinéma, et du film.