Patrimony logo

Patrimony

AutreTPE


Conception d'une webapp dans la gestion de patrimoine

Nous avons accompagné Patrimony dans la conception de leur nouvelle plateforme de gestion de patrimoine, destinée aux familles

Le collectif Menthalo nous a permis de matérialiser notre plateforme très rapidement tout en respectant notre cahier des charges. Je recommande vivement et je n'hésiterai pas à faire de nouveau appel à eux !

François Carpentier portrait

François Carpentier

Associé et fondateur chez Patrimony


Patrimony est un cabinet spécialisé dans l’accompagnement des familles sur l’optimisation et la préservation de leur patrimoine personnel et professionnel. Grâce à leur approche globale et une volonté de mettre le conseil au centre de leur relation, Patrimony permet à ses clients de conserver leur patrimoine sur plusieurs générations.

Contexte

L’objectif de Patrimony était de concevoir une webapp à destination de leurs clients. Cette plateforme devait permettre aux différentes familles accompagnées par Patrimony de gérer leur patrimoine : ajout des membres de la famille, paramétrage de donations, visualisation des transmissions, gestion des actifs financiers. Des ébauches de pages avaient été faites mais elles avaient besoin d’être précisées. Nous les avons accompagnés dans ce processus de conception en proposant une méthodologie rigoureuse : mise à niveau des éléments fournis, exploration graphique, conception atomique de composants puis construction des pages Desktop et Mobile de l’interface. Nous avons finalement détaillé la documentation afin que leur équipe interne puisse s’occuper de l’intégration.

Objectifs

  1. Exploration et définition de la vision produit

  2. Concevoir une prototype interactif haute fidélité d’une vingtaine d’écrans

  3. Fournir une documentation claire du travail accompli

Divergence

La divergence est une étape d’ouverture que le designer encadre après avoir accueilli la vision du client. Elle a pour rôle d’inspirer et de favoriser l’exploration des solutions possibles.

Accueil et identité

Nous avons d’abord initié un dialogue avec Patrimony afin de comprendre leur positionnement et leur vision produit.

“On imagine que l’interface permette de voir les membres de sa famille, comme un portrait sur son bureau.”

En plus de cet aspect sensible, le client nous a également donné des informations techniques propres au secteur patrimonial, comme le fonctionnement des systèmes de successions, ce qui nous a permis de définir précisément ses besoins pour le produit à venir.

Analyse et exploration de nouvelle structure de contenus

Par la suite, nous avons analysé d’autres produits du secteur, que nous avons présenté au client afin de le sensibiliser aux bonnes pratiques en matière de design d’expérience. Couplées aux écrans qu’il nous a fourni, nous avons conçu 3 versions alternatives de certaines pages clefs, présentant différentes façons de structurer le contenu. À l’issue de 2 itérations, le client a pu choisir la version qui lui correspondait le plus :

Convergence

Une fois les paramètres d’identité de marque et de structure de contenus définis avec le client, nous pouvions rentrer dans une phase convergente qui avait pour objectif de transformer la vision d’origine en produit viable et actionnable.

Création de composants

Sur la base des pages clés fournies par le client, nous avons d’abord listé l’ensemble des composants nécessaires à la conception de l’interface Patrimony. Ces composants ont ensuite été conçus selon la méthode de l’Atomic Design :

  • Les atomes sont les éléments graphiques de base de l’interface. Ils ne peuvent être réduits ou décomposés en d’autres atomes. Un atome, seul, ne répond pas à un objectif fonctionnel. Il s’agit, par exemple, de la forme des boutons, d’un champ de saisie, d’un visuel de type icône, etc.

  • Les molécules sont composées d’atomes. Elles forment les premiers éléments de l’interface. Par exemple, un bouton dans la couleur primaire et un libellé forment un bouton d’action. Ces molécules sont conçues de manière responsive en imaginant la manière dont leur forme va évoluer selon le support sur lequel elles apparaissent.

  • Les organismes sont des combinaisons de molécules et éventuellement d’atomes. Par exemple, un champ de saisie et un bouton d’action forment l’organisme de publication de message. Les organismes sont par nature des éléments contextuels.

L’idée était de concevoir un système dynamique et interactif en utilisant les fonctionnalités les plus avancées de Figma. Cela permettrait de proposer au client un prototype haute fidélité, qu’il serait facile de modifier et d’étoffer dans le futur.

Construction des pages

Une fois notre système de composants terminé, nous nous sommes attaqués à la cartographie de l’interface, afin d’illustrer la manière dont les différentes fonctionnalités s’imbriquaient. L’arborescence ainsi définie, nous avons utilisé nos composants pour construire les pages Desktop, que nous avons ensuite adaptées en version Mobile. Cette étape amène à penser l’ensemble des parcours pour visualiser l’expérience dans ses moindres détails. Il n’est donc pas rare que certains composants nécessitent une réadaptation.

Animation des pages

Afin que le client puisse se projeter dans l’expérience finale de son produit, il ne nous restait plus qu’à ajouter les interactions de scroll, hover et de transition entre les pages. Cette dernière étape permet également d’aboutir à un prototype haute fidélité, support de test idéal et base de travail pour les développeurs.

Documentation & transmission

Chez Menthalo, nous pensons qu’un projet abouti doit être intelligible et utilisable facilement par les autres parties prenantes. Cela passe par un travail de pédagogie et de documentation sur la façon dont le prototype est conçu. Tout d’abord, un naming explicite des composants est essentiel pour faciliter le travail d’intégration. En complément, nous avons privilégié la création de vidéo explicatives afin :

  • d’expliquer comment était organisé le fichier Figma et donc faciliter la passation aux prochains designers ou développeurs

  • de présenter les prototypes Desktop & Mobile, pour que le client puisse communiquer sur la plateforme à venir

Conclusion

Nous avons accompagné Patrimony dans la conception d’un service complet de gestion de patrimoine : ajout et visualisation des membres de la famille, enregistrement de donations, paramétrages de clauses bénéficiaires, gestion d’actifs financiers, de biens et de documents sensibles... Tout ça en moins de deux mois ! Le développement a débuté directement, alors que le client présentait la nouvelle plateforme à ses clients lors d’une soirée d’inauguration. La plateforme a finalement vu le jour début 2023 pour un nombre réduit d’utilisateurs, dans une optique de tests réguliers et d’amélioration continue.

Membres

Expertises

Product Design - UX/UIStratégie Produit

De

Juil. 2022 à Sept. 2022