Enjeux

  ✅ Créer un outil SaaS/CRM à destination des professionnels de la rénovation énergétique
  ✅ Faciliter la gestion des clients, dossiers et travaux
 ✅ Devenir un logiciel de référence dans le secteur

Plan d’actions

1. Définition des besoins des utilisateurs et de leurs points de friction

2. Création d’une User Journey sur la base des besoins identifiés

3. Création d’une architecture de l’information

4. Définition d’un Product Backlog

5. Conception et itérations de wireframes basse-fidélité

6. Création d’un prototype animé pour des tests utilisateurs

7. Création du Visual Design et des maquettes graphiques

1. Définition des besoins des utilisateurs et de leurs points de friction

Le projet a débuté par un atelier de Découverte sur Miro. Cet atelier a pour but de faciliter la montée en compétences de nos équipes. Nous avons ainsi convié les chefs de projet mais aussi et surtout les « sachants », c’est-à-dire les personnes en contact direct avec les utilisateurs, qui connaissent la réalité terrain.

Lors de cet atelier, nous avons demandé aux participants de nous partager des insights insoupçonnables sur les utilisateurs, comme par exemple le fait qu’ils aient « peu de patience ». Ensuite, nous leur avons demandé de nous partager « ce qui compte le plus pour eux » puis leurs galères – au quotidien, de façon hebdomadaire ou à l’année.

2. Création d’une User Journey sur la base des besoins identifiés

À partir des données récoltées pendant la phase précédente, nous avons créé une User Journey. Elle a pour but de décrire toutes les actions que les utilisateurs doivent pouvoir réaliser en parcourant le produit. Séquencée en plusieurs étapes et temporalités, cela permet aux designers mais aussi aux parties prenantes d’avoir une vision claire sur le périmètre à concevoir.

3. Création d’une architecture d’information

Maintenant que nous connaissons les actions que les utilisateurs sont amenés à réaliser, nous avons déterminé les différentes briques qui devront être représentées dans le produit à travers l’architecture d’information. C’est une étape très importante et à ne pas négliger lors de la conception d’un produit, encore plus lorsque ce dernier n’existe pas encore. C’est aussi un autre livrable de référence pour toutes les parties prenantes car il permet, dans le détail, de déterminer les principes de navigation et des futurs parcours en incluant des logiques de conditions et de choix de la part des utilisateurs.

4. Définition d’un Product Backlog

Avant de débuter la phase de conception, nous avons pour habitude de construire un Product Backlog. Ce dernier se base sur l’architecture d’information et permet d’avoir une estimation temporelle détaillée. Il permet d’avoir un périmètre défini et accessible à tous. À l’intérieur, on retrouve des tâches, qui correspondent à des pages ou des parcours du produit. Face à chaque tâche, on retrouve une estimation en heure précise. Les tâches sont créées pour chaque résolution.

5. Conception et itérations de wireframes basse fidélité

Une fois le Product Backlog validé, nous avons entamé la phase de wireframing. Les wireframes basse-fidélité ont pour but de représenter rapidement l’ensemble des pages et parcours du produit, ainsi que l’idée que les designers se font de leurs fonctionnalités. C’est une étape importante puisqu’elle permet de mettre à plat l’ensemble des pages. Les parties prenantes peuvent ainsi se projeter sur le fonctionnement du produit.

Pendant cette phase, plusieurs revues de design en asynchrone sont réalisées sur l’outil Loom. La vidéo de la revue est ainsi consultable à n’importe quel moment, autant de fois que possible, et enregistrée en ligne. Cela permet de gagner du temps et est très pratique lorsque les agendas sont chargés.

6. Création d’un prototype animé pour des tests utilisateurs

Afin de faire tester rapidement la pertinence de notre conception, nous avons réalisé un prototype interactif sur la base de nos wireframes. Nous avons d’abord déterminé les parcours clés, puis nous avons imaginé des scénarios. Nous avons ensuite rendu les wireframes cliquables. L’idée de ces tests est avant tout d’infirmer ou d’affirmer nos hypothèses auprès des utilisateurs.

7. Création du Visual Design et des maquettes graphiques

La dernière étape avant la fin du projet ! Puisque c’est un nouveau produit, aucune réelle identité n’existait encore. Pour cette piste graphique, le client nous a laissé carte blanche. Il a seulement choisi une palette de couleurs que nous avons reprise puis retravaillée. Nous avons donc fait le choix de partir sur une piste moderne, qui change des produits SaaS B2B que nous avons l’habitude de voir.