ajout de fonctionnalités application mobile

Ajout de fonctionnalités dans une app de tri des déchets

Uzer

App mobile

Brief

Ajout de fonctionnalités dans une application de tri des déchets pour les collectivités territoriales

Compétences

Stratégie

Audit design

Ux design

Ui design

ajout de fonctionnalités application mobile

Phase 1 : diagnostic design

Afin de comprendre les enjeux du projet, nous avons réalisé différents workshops avec l’équipe de “Montri”. Nous avons dans un premier temps étudié une carte des acteurs et leurs liens avec les collectivités territoriales. Nous avons ensuite identifié les personae pour lesquelles la fonctionnalité était pertinente et avons pu réaliser leur journey map.

Le diagnostic design comporte également un audit de l’application existante au travers de 4 axes: la navigation, les fonctionnalités, l’ergonomie et le graphisme. Grâce à cette étude, nous avons identifié les différents axes d’améliorations pour l’application. Nous les avons classés en 2 parties : une qui serait modifiable lors de l’implantation de TriAct, et l’autre non.

Notre challenge tout au long du projet fut d’implémenter la nouvelle fonctionnalité sans modifier ni la structure ni l’identité de l’application existante.

No items found.

Phase 2 : L'expérience utilisateur au travers de parcours

Une fois les besoins bien identifiés, nous sommes passés dans la phase de définition où nous avons posé les principes UX de la fonctionnalité, notamment à l’aide d’une arborescence complète et détaillée de l’ensemble de l’application.


L’objectif de cette phase était d’identifier les parcours ajoutés par la fonctionnalité TriAct sous forme de maquettes de principe.

Nous avons donc dans un premier temps étudié les parcours souhaités, en analysant si les étapes de chacun d’entre eux existaient déjà, devaient être modifiés, ou s’il fallait les créer. Dans un second temps, nous avons matérialisé ces analyses au travers d’écrans lo-fi pour chaque parcours. Nous pouvions visualiser pour chaque étape les modifications à apporter ou non.

No items found.

Phase 3 : Wireframes

Grâce au travail de définition réalisé en amont, nous connaissions précisément les modifications à apporter pour chaque écran. Nous avons réalisé des wireframes hi-fidelity en suivant ces lignes directrices.

Nous avons d’abord commencé par des exercices de zoning pour structurer les pages, puis nous avons poussé ces zonings en y rajoutant des principes d’Ux pour anticiper le contenu graphique.

Lors de cette phase nous avons défini des règles universelles pour l’application qui se basent sur le comportement des composants : par exemple la différenciation de listes cliquables par rapport à celles qui ne le sont pas.


No items found.

Phase 4 : Ui et design system

Une fois la phase d’itérations UX terminée, il ne nous restait plus que la dernière phase : l’UI. Un nouvel enjeu de taille s’est ouvert à nous : celui de s’adapter à la charte graphique existante de Montri. Celle-ci implique notamment que la charte puisse s’adapter à la couleur de chaque métropole.

Nous avons donc pris le parti d’avoir comme couleur d’action un gris foncé et que chaque métropole puisse décider de la couleur principale de son application.

Nous avons travaillé les différents composants en indiquant leur comportement : ils pouvaient soit prendre la couleur de la métropole, soit prendre la couleur de Montri, soit avoir une couleur invariable (feedbacks, actions et contenus texte)

No items found.

Design System

Le projet s’est terminé par l’élaboration d’un design system complet afin d’accompagner les développeurs dans leur compréhension des différents composants.

No items found.

"

Créez avec nous votre site web, plateforme ou appli sur mesure, de A à Z.

Camille Hautreux, Expert Projets Digitaux

Contactez-nous pour votre projet

Nos autres projets

Création d'une application multiservice

Hjaelp

Création d'une application multiservice

Application danoise proposant des services B2B et B2C.

Découvrir le projet

SNCF Transilien

Concevoir une roadmap de fonctionnalités pour 2020

Aider la SNCF dans leur stratégie d'innovation pour augmenter l’acquisition et la satisfaction client.

Découvrir le projet

Simplon

Concevoir l'UX de simplonline en Agile

Repenser l’innovation pédagogique au service de l’impact social.

Découvrir le projet

Heineken

Co-construire une innovation foodtech

Proposer un service de location de tireuses à bière sur Paris en 30 minutes.

Découvrir le projet

Live for Good

Refondre le site d'un incubateur social

Un nouveau site pour présenter les programmes de l'association et des entrepreneurs, tous porteurs de projets à impacts positifs.

Découvrir le projet

Derichebourg

Concevoir un objet connecté en Smart office

Élaborer une innovation grâce aux nouvelles technologies pour créer les bureaux de demain.

Découvrir le projet

Mon bureau d'études

Plateforme d'analyse d'infrastructure

Accompagner un bureau d'étude dans la refonte de leur plateforme métier spécialisée dans l'infrastructure technique.

Découvrir le projet