Abandonnez les MVP, adoptez des prototypes minimum viables (MVPr)

Publié: 2022-03-11

La poursuite de la perfection est un piège subtil qui entraîne souvent les concepteurs dans une boucle sans fin d'itérations et de révisions. Cela est particulièrement vrai dans le monde des produits numériques, où chaque interaction et élément graphique peut devenir un objet d'obsession du design.

Mais, lorsque nous prenons du recul et observons la nature interdisciplinaire de la conception de produits numériques, il est facile de voir comment les concepteurs tombent dans le piège de la perfection.

Pensez à toutes les personnes et à tous les rôles impliqués dans la conception d'un seul produit numérique :

  • Chercheurs en conception
  • Concepteurs d'interface utilisateur
  • Architectes de l'information
  • Concepteurs UX
  • Concepteurs de produits
  • Chefs de produit
  • Stratèges de contenu
  • Experts de la marque
  • Rédacteurs UX
  • etc.

D'une manière ou d'une autre, chacun de ces points se croise. Par exemple, l'interface utilisateur d'un produit ne peut pas réussir si son expérience utilisateur n'est pas prise en compte. Avec l'interdépendance vient la pression de comprendre comment les décisions de conception s'influencent mutuellement : "Si nous faisons X, comment cela affectera-t-il Y et Z ?"

Ce type de prévision stratégique peut être précieux, mais il peut également entraîner la stagnation du processus de conception et le coincer dans la redoutable boucle de perfection : « Nous devons obtenir X correctement avant de pouvoir exécuter Y et Z ».

Alors, quelle est l'alternative ? Existe-t-il un moyen de créer, de lancer, de tester et d'améliorer rapidement des produits numériques basés sur des mesures et des informations du monde réel tirées de personnes réelles ?

Dans ce guide, nous aborderons ces questions à travers le prisme de prototypes minimum viables et fournirons aux concepteurs un processus étonnamment simple pour créer, tester et affiner les produits numériques.

Illustration du processus de conception de prototype minimum viable
Cette illustration n'a pas le détail réaliste d'une image satellite, mais elle contient suffisamment d'informations visuelles pour la rendre facilement identifiable comme notre planète d'origine. De la même manière, les prototypes minimum viables fournissent aux utilisateurs « juste assez » de fonctionnalités pour décider si un concept de produit en vaut la peine ou non.

Simuler le lancement avec un prototype minimum viable

Personne ne sait rien… Pas une seule personne dans tout le domaine du cinéma ne sait avec certitude ce qui va marcher. Chaque fois, c'est une supposition et, si vous avez de la chance, une instruite. – William Goldman, scénariste primé aux Oscars

Les premières décisions du processus de conception de produits numériques sont, au mieux, basées sur des conjectures. Tant qu'un produit n'est pas entre les mains des utilisateurs réels, tout est théorique. D'un autre côté, lancer un produit avant qu'il ne soit prêt peut nuire à sa réputation (une erreur coûteuse).

Et s'il existait un moyen de simuler le lancement et de déterminer la viabilité d'un produit bien avant le début de tout effort de conception majeur ?

C'est la valeur du prototype minimum viable (MVPr), une approche de conception de produit qui nécessite beaucoup moins de temps et d'argent que le « produit minimum viable » plus familier.

Voici un aperçu du processus de conception du prototype minimum viable (MVPr) :

  1. Découverte
  2. Recherche
  3. Architecture des informations
  4. Aspect visuel
  5. Lancer
  6. Test

Attendez! N'est-ce pas le procédé que tout le monde utilise ?

Oui, et nous verrons qu'en nous appuyant sur l'essentiel des étapes ci-dessus, nous pouvons réussir…

  • Simuler la fonctionnalité d'un produit réel ;
  • Imiter le lancement d'un produit réel ; et
  • Découvrez si un produit réel vaut la peine d'être construit.

Étape par étape : comment créer un MVPr

1. Découverte : Commencez à prendre des décisions

Une excellente façon de démarrer le processus de découverte consiste à rechercher des sites Web, des blogs et des applications similaires à votre idée. Découvrez leurs histoires, leurs marchés cibles, leur fonctionnement, etc. Si vous constatez qu'aucun des concurrents concernés ne fait ce que fait votre prototype, continuez à avancer.

Cette étape ne nécessite aucune expertise. Le secret, c'est de passer de l'intention à l'action.

Portez une attention particulière aux forces et aux faiblesses de vos concurrents. Comment pouvez-vous utiliser ce qu'ils ont déjà accompli (ou n'ont pas réussi à accomplir) pour rendre votre prototype plus solide ?

Après 1 à 2 heures de recherche, vous devriez être en mesure d'identifier vos concurrents les plus importants et d'apprendre les aspects clés de chacun.

Processus de développement de nouveaux produits de recherche de concurrents
Cet exemple récapitulatif de concurrents de l'industrie du voyage met en évidence l'objectif principal de la phase de découverte : découvrir les opportunités et les défis créés par les forces et les faiblesses des entreprises rivales.

2. Recherche : Définissez vos utilisateurs

Qui est votre utilisateur cible et pourquoi devrait-il se soucier de votre produit ? Comprendre cela est crucial, mais nous devons commencer par des hypothèses calculées. Il est préférable de partir d'une vision fortement opiniâtre. Ne devinez pas ou n'essayez pas de faire « quelque chose pour tout le monde ». Nous ne voulons pas de design édulcoré.

Au lieu de cela, regardez de plus près les sites concurrents trouvés lors de la phase de découverte et laissez le bon sens brosser un portrait de vos utilisateurs potentiels.

Voici quelques domaines d'investigation pratiques facilement accessibles sur le web :

  • Visitez les sites d'évaluation et voyez ce que les gens disent de leurs expériences avec vos concurrents.
  • Suivez les influenceurs de l'industrie de votre produit sur les médias sociaux et observez comment ils engagent leur public.
  • Recherchez des articles de presse réputés qui fournissent un aperçu détaillé du fonctionnement de vos concurrents.
  • Découvrez les interactions de vos concurrents avec leurs utilisateurs sur les réseaux sociaux.
  • Voyez si vous pouvez trouver des forums où les problèmes ou problèmes de vos concurrents sont discutés.

Des informations précieuses peuvent être obtenues à partir de chacune de ces avenues sans investissement financier important. Ceci est particulièrement important pour les petites équipes de conception travaillant avec des budgets restreints. Les grandes marques dépensent beaucoup d'argent en recherche, mais les petites équipes et les indépendants doivent trouver des moyens d'être plus ingénieux.

Processus MVP d'informations sur les utilisateurs
Les profils d'utilisateurs peuvent être généraux ou assez détaillés. Au début du processus MVPr, il est important d'en découvrir le plus possible le plus rapidement possible.

3. Architecture de l'information : structurez votre prototype

Comment le prototype fonctionnera-t-il et quelles sont les informations les plus importantes sur lesquelles se concentrer ?

Le moyen le plus simple de commencer à répondre à cette question consiste à analyser des sites de premier ordre similaires au prototype que vous construisez. L'aspect général et l'expérience du site que vous choisissez de référencer doivent être exceptionnels.

Commencez par briser le site en morceaux. Quelles sont toutes les pages pertinentes et comment sont-elles structurées visuellement ? N'ayez pas peur d'inverser le wireframe du site, puis de le recréer avec vos propres informations, couleurs, images, etc.

Pourquoi s'y prendre de cette façon ? Votre site fonctionnera probablement de la même manière que les sites concurrents - vous avez simplement des objectifs différents en tête. Nul besoin d'inventer un système complexe si les utilisateurs réagissent bien à une expérience établie.

*Conseil de pro : lors de l'étude de l'architecture des informations d'un site, une technique utile consiste à prendre des captures d'écran et à les mettre en niveaux de gris afin de ne pas être distrait par l'impact de la couleur (ce qui peut être assez persuasif).

Comment construire une architecture d'information MVP
Un excellent moyen de réduire le bruit et de se concentrer sur ce qui est important est de convertir les captures d'écran du produit en niveaux de gris.

Ensuite, profitez des ressources en ligne qui permettent aux concepteurs de passer rapidement de zéro au prototype interactif. Il existe des tonnes de kits d'interface utilisateur, de modèles HTML, de thèmes WordPress, etc. N'ayez pas peur de les modifier pour les adapter à votre prototype, et ne vous souciez pas de la perfection des pixels ou de la beauté du code. A ce stade, personne ne s'en soucie. Ils se soucient de savoir si votre produit est utile ou non.

Voici comment cela fonctionne avec un kit d'interface utilisateur gratuit :

Créez un MVP avec un kit d'interface utilisateur gratuit
Le kit d'interface utilisateur dont vous avez besoin dépendra du type de prototype que vous concevez. Dans ce cas, l'utilisation d'un modèle axé sur le contenu visuel permet une réorganisation rapide et sans douleur.

Qu'avons-nous accompli dans l'image ci-dessus ?

  • Nous avons supprimé toutes les couleurs et les images.
  • La barre de navigation est restée intacte.
  • La fonctionnalité du système de filtrage est restée la même, mais la formulation a été modifiée.
  • Nous sommes passés de deux colonnes à une afin de mieux mettre en valeur les images que nous prévoyons d'utiliser.

En moins d'une heure, nous avons une base visuelle sur laquelle développer davantage notre prototype.

4. Conception visuelle : Réutilisez les ressources d'interface utilisateur gratuites

L'aspect visuel et la convivialité de votre prototype ne peuvent être séparés de son fonctionnement. Il ne s'agit pas seulement de graphismes. Un design visuel percutant raconte une histoire et offre une expérience à valeur réelle.

Ici, la cohérence visuelle est essentielle car elle aide les utilisateurs à se familiariser avec un produit et à naviguer plus efficacement. Pour obtenir ce type de cohérence au début du développement de votre prototype, il est judicieux de réaffecter les ressources d'interface utilisateur gratuites.

En travaillant de cette façon, vous n'aurez pas à passer des heures à développer un système de conception cohérent. La typographie, les styles de boutons, l'iconographie et tous les autres composants importants de l'interface utilisateur sont pris en charge.

Wireframe de conception MVP à maquette haute fidélité
Au lieu de passer du temps à concevoir une interface utilisateur cohérente sur plusieurs écrans, profitez d'un kit d'interface utilisateur et concentrez-vous sur la création de contenu. Dans cet exemple, nous sommes rapidement passés du wireframe à la maquette haute-fidélité.

5. Lancement : coder ou ne pas coder ?

Il est temps de partager votre prototype avec le monde. Heureusement, il est plus facile que jamais de transformer des maquettes en prototypes dynamiques. Grâce à une multitude d'outils intuitifs, vous n'avez même pas besoin de savoir coder, mais devriez-vous apprendre ?

Le MVPr sans code

Lorsque vous avez terminé la conception visuelle, intégrez le prototype dans une page de destination afin que les visiteurs puissent interagir avec et fournir des commentaires généraux sur votre idée. À ce stade du processus de conception MVPr, il existe plusieurs façons de créer un prototype sans code. Voici vos options :

Prototypes de base

  • InVision possède toutes les fonctionnalités nécessaires pour construire et tester un prototype de base, et il offre une expérience indolore et sans complications.

Prototypes Rich Media

  • Pour les interactions, transitions et animations sophistiquées, Principle est très utile.

Prototypes 100% réalistes

  • Framer permet aux concepteurs de simuler n'importe quelle expérience de produit numérique imaginable. C'est l'option parfaite lorsque le prototype doit avoir l'air réel en termes d'animation native et de codage basé sur la logique (Ex : si ceci, faites cela).
  • Webflow offre le pouvoir de concevoir, de créer avec du code et de lancer des sites Web réactifs sur un canevas 100% ce que vous voyez est ce que vous obtenez.
Programmes de conception de prototypes MVP interactifs Cliquez pour voir l'image en taille réelle.
Voici un tableau utile qui décompose les forces et les faiblesses de plusieurs programmes de conception pouvant être utilisés pour créer des prototypes interactifs avec rapidité et précision. (Source : Cooper)

Le MVPr codé

Le code peut être un allié formidable. Sans aucun doute, c'est la meilleure façon de construire votre produit. L'inconvénient majeur est que vous devez savoir comment écrire du code pour profiter des avantages de la personnalisation avancée. Sans une base de connaissances appropriée, choisir d'expérimenter avec du code vous ralentira.

Il existe de nombreux kits de démarrage de code pour vous aider à démarrer. Par exemple, le kit d'interface utilisateur que nous avons présenté ci-dessus a sa propre version HTML disponible en téléchargement :

Kit d'interface utilisateur gratuit pour le développement de produits allégés avec HTML
Maintenant, le kit d'interface utilisateur.


Outil de développement de produits allégé Readymag
Readymag est un outil de conception en ligne qui aide les professionnels de la création à créer facilement des microsites, des portfolios, etc.


Développement de prototypes minimum viables réactifs Webflow
Webflow permet aux concepteurs de créer des sites Web réactifs dans le navigateur.


Themeforest comment construire un produit minimum viable
ThemeForest fournit des milliers de thèmes et de modèles personnalisables.

6. Test : tirer parti des statistiques publicitaires

La sauce secrète pour tester votre prototype réside dans des outils qui vous permettent d'obtenir le meilleur aperçu avec le moins d'effort tout en offrant de la valeur. Tout ce dont vous avez besoin, c'est de quelques dollars et d'une résolution patiente de problèmes.

Une première étape pratique pour évaluer l'intérêt pour votre produit consiste à créer une annonce et à cibler les personnes trouvées pendant la phase de recherche. En fonction de votre public et du type de produit que vous concevez, vous pouvez diffuser des publicités sur Google, LinkedIn, Instagram ou Twitter. Pour les produits business-to-consumer, Facebook est recommandé.

*Conseil de pro : AdEspresso est un endroit pratique pour exécuter des centaines de versions de vos publicités sociales en même temps tout en recueillant des analyses comparatives utiles.

Diffusez des annonces et vous apprendrez deux choses :

  1. Le nombre de personnes qui ont vu votre annonce
  2. Le nombre de personnes ayant cliqué sur votre annonce

Une fois que vous avez confirmé que votre public cible souhaite interagir avec vos publicités, vous devez créer de la valeur pour vos premiers utilisateurs. Voici comment:

  • Ajoutez un formulaire « s'abonner » et demandez aux utilisateurs de donner leur adresse e-mail.
  • Faites un suivi pour leur faire savoir quand vous lancez.
  • Assurez-vous que vos canaux de médias sociaux sont opérationnels afin de pouvoir intégrer des boutons sociaux, permettant aux utilisateurs de faire connaître votre produit.

Utilisez cette stratégie et vous gagnerez :

  • Une liste d'adresses e-mail pouvant être utilisées pour les premiers efforts de marketing
  • Personnes recommandant votre produit à leurs réseaux personnels et professionnels
  • Une compréhension plus claire de savoir si quelqu'un est enthousiasmé par votre produit

La première fois que vous obtenez de vrais commentaires, votre produit est en ligne. Grâce à ce cycle de création de valeur, d'analyse de comportement et d'itération de solutions, vous apprendrez ce qui fonctionne et ce qui ne fonctionne pas, et vous vous rapprocherez d'un produit que les gens souhaitent réellement utiliser.

Lancez et apprenez avec audace

L'objectif ultime du prototype minimum viable est le suivant : passer de suppositions de conception éclairées à des commentaires réels et exploitables avec rapidité et confiance.

Il s'agit d'un processus qui considère l'incertitude et les faux pas comme des opportunités d'amélioration. Surtout, il récompense l'action. Une bonne conception nécessite une prise de décision audacieuse et une volonté d'aller de l'avant face à l'imperfection.

Alors ne vous embourbez pas dans la poursuite de la perfection, et essayez de ne pas vous comparer aux méga marques et à leurs énormes ressources. Continuez à avancer et vous vous retrouverez bientôt avec un produit considérablement perfectionné que les gens sont ravis d'utiliser.

• • •

Pour en savoir plus sur le blog Toptal Design :

  1. Prototyper en toute simplicité - Un tutoriel InVision Studio
  2. Comment mener un Design Sprint efficace
  3. Qui savait qu'Adobe CC pouvait filaire ?
  4. Tests UX pour les masses : restez simples et rentables
  5. Cartes de parcours client - Qu'est-ce qu'elles sont et comment en créer une