A design sprint bootcamp for young entrepreneurs

Loucas Papantoniou
June 09, 2015
Translation from the english version.
Juste avant de fermer le studio pour les vacances de fin d’année nous avons décidé de nous exercer sur Boost, notre nouveau service de design.
Boost est une méthode de conception qui permet –en une courte semaine et grâce à une approche centrée sur l’utilisateur– d’améliorer très rapidement des produits ou des services en ligne par des optimisations ciblées.
Nous avions déjà pratiqué d’autres Boost avec nos clients, mais nous voulions expérimenter un Boost fictif, entre nous, pour améliorer le service et par curiosité de s’essayer à un nouveau type de projet.
Bien que ce Boost soit fictif, il était impératif de s’appuyer sur la réalité en se basant sur un service que la plupart des internautes belges utilisent.
Beaucoup d’idées sont arrivées sur la table, notre choix s’est rapidement orienté vers Immoweb, le site de référence pour la recherche de biens immobiliers sur le marché belge. Le contenu d’Immoweb est riche, quantitatif et des milliers de visiteurs y recherchent, chaque jour, leur futur logement.
Ce projet était typiquement adapté à Boost: complexe, ambitieux et avec un besoin continu d’optimisation.
Nous devions veiller à rester réalistes sur ce qui pouvait être accompli en une courte semaine, que nous appelons un sprint en référence aux méthodologies agile. Pour cette raison, nous avons appliqué la règle des 80/20, aussi appelée le principe de Pareto, qui dit simplement que:
“80% des effets sont le produit de 20% des causes.”
En conception cela signifie que si 20% des fonctionnalités d’un produit sont utilisées 80% du temps, il faut y consacrer prioritairement ses efforts. Nous avons considéré que la page de présentation d’un bien faisait partie de ces 20% utilisés 80% du temps. En ciblant Boost sur cette page nous pouvions améliorer sensiblement l’expérience du produit en une semaine.
Note: Étant donné le cadre fictif nous avons du faire abstraction des contraintes et des objectifs business du client. Normalement ces éléments sont indispensables à la bonne réalisation d’un travail de conception car il s’agit de produire des solutions répondant à la fois aux besoins des utilisateurs et aux objectifs business – c’est la clé de la réussite d’un produit.
La page de présentation d’un bien actuel sur Immoweb (Il est utile de préciser que les éléments globaux tels que l’en-tête, la navigation principale et le pied de page étaient hors de portée de ce sprint.)
Une fois le projet choisi nous avons planifié le sprint. Habituellement nous découpons la semaine en quatre jours:
Après le lancement, durant une à deux semaines, nous monitorons l’impact des changements apportés. Nous retrouvons ensuite notre client pour évaluer les résultats et lui donner des conseils sur l’amélioration continue de son produit.
Dans le cadre de cet exercice, le projet étant fictif et les fêtes de fin d’année à notre porte, nous nous sommes limités aux trois premiers jours.
Les deux premiers jours d’un Boost se déroulent de manière très collaborative. L’équipe est composée des décideurs du côté client et de deux designers qui travaillent en tandem. Les autres membres de Central interviennent en fonction des besoins du projet (content strategists, copywriters, visual designers, développeurs,…)
Dans ce cas-ci, il n’y avait pas de client. Nous avons donc constitué une équipe plus large de quatre personnes. Loucas, notre concepteur UX, a animé les ateliers de conception. Sarah, notre stratègiste de contenu et rédactrice, a révélé ses dons en croquis. Quentin et David ont réglé les problèmes de conception lors du prototypage.
L’objectif de la première journée était de définir quel(s) problème(s) nous voulions solutionner? Lors d’un atelier de deux heures, les participants ont superposé leurs précédentes expériences de recherche d’un bien immobilier afin d’en extraire une histoire commune.
Loucas a partagé son vécu d’expatrié à la recherche d’un logement dans une ville bilingue, Bruxelles. Sarah a raconté ses souvenirs d’achat d’appartement avec Ryan, son amoureux. David a décrit le temps passé à chercher, avec Laetitia, un nouveau nid pour sa famille. Nous avons tous convenu, après ces échanges, que:
Cherchez une nouveau logement est une expérience passionnante et créative, qui se transforme rapidement en un processus long, stressant et fatiguant.
Il faut d’excellentes compétences de recherche et savoir bien collaborer lorsqu’elle est collective.
Les utilisateurs commencent par filtrer les résultats en fonction de critères tels que la localisation, le prix ou le nombre de chambres. Ils sélectionnent ensuite ceux qui semblent intéressants, les partagent avec leurs partenaires, planifient les visites, suppriment les biens des listes, etc.
Nous avons ensuite analysé les plateformes concurrentes en Belgique et ailleurs, ainsi que celles offrant des services différents mais avec une expérience comparable telles que Airbnb et Booking.com.
Nous y avons identifié les modèles de conception (design patterns) qui pouvaient nous être utiles, les plus pertinents ont été sélectionnés pour l’atelier de conception.
Pour rendre le projet plus concret, des archétypes utilisateurs (personas) ayant chacun leur propre histoire ont été imaginés: il s’agit de Inge et Tom, un jeune couple qui envisage de s’installer à Bruxelles, et de Josette, une veuve de 72 ans qui cherche un petit appartement pour s’y installer avec son chien Emile.
Ces archétypes nous ont aidés à définir pour chaque cas les critères de recherche et à distinguer les différents parcours des utilisateurs. Tout ce travail d’analyse et de recherche a généré plein d’idées à tester lors du prototypage.
Inge, Tom and Josette: les 3 personas choisis pour raconter nos histoires.
À la fin de l’atelier de deux heures nous avons résumé notre analyse et défini nos objectifs et avons convenu qu’il était évident et nécessaire pour les utilisateurs de:
Pour y parvenir, nous avons décidé de concentrer ce Boost sur:
Nous avons utilisé le framework HEART de Google Venture’s pour trouver les indicateurs de mesure de succès pertinents. Le HEART signifie bonHeur, Engagement, Adoption, Rétention et succès des Tâches.
“Pour savoir quels indicateurs choisir, vous devez commencer par définir vos objectifs. Ainsi vous pourrez identifier les indicateurs qui vous aident à mesurer votre progrès vers ces objectifs.”
— Jake Knapp, Google Ventures
Nos objectifs étant de gagner du temps dans la recherche d’un bien immmobilier et de rendre le processus plus agréable, nous avons décidé de mettre l’accent sur la mesure du bonheur et sur le succès des tâches.
Dans les deux cas, un test d’utilisabilité permettrait de vérifier la pertinence des solutions de conception.
L’objectif de la deuxième journée était d’élaborer un croquis (wireframe) de notre page optimisée qui servirait de modèle pour réaliser le prototype.
Nous avons commencé cette journée en annotant nos remarques sur une version imprimée de la page actuelle du site Immoweb.
Cet exercice rapide a permis de définir la hiérarchie du contenu de la page et d’identifier les éléments que nous aurions besoin de repenser. Nous avons très vite distingué deux sections, la section principale en haut (hero) et la section détaillée.
La première fournit en un coup d’oeil les informations clés du bien, la seconde énumère tous les petits détails de manière claire et concise.
Annotations sur la page produit existante
Une fois le contenu défini, nous avons exploré les différentes solutions d’organisation possibles. Pendant 10 minutes top-chrono, chacun de nous a dessiné la section principale du haut (hero).
Nous avons affiché tous les dessins au mur, chacun a voté pour les idées les plus pertinentes avec des pastilles et nous avons ensuite pris 10 minutes pour les critiquer. Très vite, les idées se sont emboîtées pour envisager la solution souhaitée.
Croquis rapides de la page produit
Pendant 10 autres minutes nous avons répété l’exercice en sélectionnant dans les croquis précédents les éléments les plus intéressants et en supprimant les moins pertinents.
Le même processus a été appliqué pour la section détaillée. Nous avons ensuite assemblé les deux sections en une seule, pour finalement converger vers une idée commune.
Le résultat a été affiné jusqu’à obtenir un wireframe consolidé à prototyper le jour suivant. Lors d’un précédent Boost, un client nous avait dit en sortant:
“Ce qui nous aurait habituellement pris une semaine, a été résolu en une demi-journée.”
Le wireframe consolidé du deuxième jour
Le troisième jour, nous avons continué la conception en codant un prototype –à partir du wireframe– qui pouvait être manipulé dans un navigateur.
Cette méthode est beaucoup plus efficace pour tester rapidement différentes solutions. Elle nous permet de collaborer facilement, de réutiliser le code et surtout de tester les interactions dans un environnement habituel tout en faisant abstraction du style.
En partant d’une première version du prototype fidèle au wireframe nous avons testé différentes évolutions. Après quelques ping-pong d’idées nous avions produit quatre versions de la page de présentation d’un bien.
La version 1 était une transposition exacte du wireframe finalisé la deuxième journée. Ici, pas de surprise:
Cependant, lors de l’analyse de la solution dans le navigateur, il s’est révélé que le prix du bien était un facteur de recherche très important et que nous devions le mettre plus en avant.
Nous avons donc déplacé le prix sur le haut de la page avec les autres critères essentiels: le type de bien, la surface, le nombre de chambres et une caractéristique du bien mise en avant. Nous avons également donné plus d’importance au call-to-action de prise de contact ainsi que plus d’espace pour afficher le logo et les informations de l’agence.
Faute de meilleure idée, la carte a été déplacée dans le diaporama.
Après un check-in avec l’équipe, nous avons constaté une augmentation de complexité dans cette deuxième version. La page était divisée en trois zones de contenu au lieu de deux. Nous avions une zone pour le titre et les critères essentiels, une zone pour les détails, et une autre pour le reste.
Nous avons donc simplifié en maintenant le prix en haut de page mais en déplaçant le titre et les critères principaux juste sous les images. Nous avons ajouté le call-to-action “Ajouter aux Favoris” et placé une carte en pleine largeur en dessous de l’annonce du bien.
Dans cette dernière version des photos ont été ajoutées afin d’augmenter le réalisme du contenu. La localisation géographique étant un critère important, nous avons replacé la carte en haut. Nous avons remplacé le bouton “Ajouter aux Favoris” par une icônes étoile et rajouté les services promotionnels en bas de page en supposant qu’ils étaient important dans le business model.
Lors d’un Boost habituel, nous testons ce jour-là le prototype avec les utilisateurs et nous apportons les ajustements nécessaires. Si besoin, un autre sprint est planifié pour la conception visuelle de la page. Les modifications sont alors mises en ligne et les résultats sont évalués en fonction des objectifs fixés le premier jour.
Dans ce cadre fictif il n’y a pas eu de quatrième jour. À la place, il était temps d’échanger nos vœux , de distribuer les cadeaux et les chocolats, et de lever nos verres pour célébrer l’arrivée de 2015. Bonne année ;-)
De gauche à droite: David, Pascal, Loucas, Quentin et Jonathan
Si vous avez lu jusqu’ici, cet article vous a probablement intéressé! N’hésitez pas à le partager ou à le recommander. Si Boost vous intéresse, vous pouvez nous contacter ou lire une autre étude de cas.
Quoi qu’il en soit, merci d’avoir lu cet article!
Loucas Papantoniou
June 09, 2015
Loucas Papantoniou
November 28, 2013
Central
February 21, 2015