À propos de ce cours
Cette leçon présente InVision, longtemps l'outil de référence pour partager des prototypes et recueillir des commentaires, et sa fermeture le 31 décembre 2024. Elle enseigne la démarche de revue qu'il a popularisée : partager avec les bons droits et un objectif, écrire des commentaires utiles (où, quoi, pourquoi), trier, corriger, résoudre et versionner. Elle montre comment réaliser cette démarche aujourd'hui dans Figma et tenir un journal de revue. Trois activités organisent une revue croisée entre binômes.
| Durée | Niveau | Prérequis | À la fin de la leçon |
|---|---|---|---|
| 1 heure (cours et 3 activités) | Débutant, chapitre « Digitaliser le produit avec les outils d'UI » | Concevoir des interfaces avec Adobe XD | Vous connaissez l'histoire d'InVision et vous savez organiser une revue de maquette : partager, commenter, trier, corriger, résoudre |
-
Objectifs
- Savoir ce qu'était InVision et pourquoi il a fermé.
- Comprendre le cycle de revue d'une maquette.
- Partager une maquette avec les bons droits et un objectif clair.
- Écrire et traiter des commentaires utiles.
- Réaliser cette démarche avec les outils actuels.
-
InVision : ce qu'il faut savoir
- InVision a été, dans les années 2010, l'outil de référence pour partager des prototypes et recueillir des commentaires. Les designers y importaient leurs écrans (depuis Sketch, Photoshop ou XD), les reliaient, puis envoyaient un lien au client ou à l'équipe.
- Il proposait aussi Inspect (les spécifications pour les développeurs), DSM (la bibliothèque du design system) et Freehand (un tableau blanc).
- Face à des outils tout-en-un comme Figma, InVision a perdu ses utilisateurs. Freehand a été racheté par Miro en 2023, puis InVision a annoncé en janvier 2024 l'arrêt de ses services de conception et de collaboration.
- Ces services ont fermé le 31 décembre 2024, et les prototypes, commentaires et bibliothèques ont été supprimés.
- On ne peut donc plus utiliser InVision. Mais le nom reste cité dans les offres d'emploi, les référentiels et les anciennes documentations, et surtout, la démarche de revue qu'il a popularisée reste indispensable.
-
Le cycle de revue d'une maquette
- 1. Partager: envoyer le lien, avec les bons droits et un objectif (« Validez le parcours de commande avant vendredi »).
- 2. Commenter: chaque relecteur épingle ses remarques sur l'élément concerné.
- 3. Trier: le designer regroupe les commentaires, élimine les doublons, priorise, décide (corriger, expliquer, reporter).
- 4. Corriger: il modifie la maquette.
- 5. Résoudre: il répond à chaque commentaire et le marque « résolu », seulement une fois la correction faite.
- 6. Versionner: il nomme la nouvelle version et prévient les relecteurs.
-
Partager avec les bons droits
- Lecture: pour un client, un usager testeur, un enseignant. Il peut voir et commenter, pas modifier.
- Modification: pour les designers du projet seulement.
- Lien de prototype plutôt que lien du fichier pour un test ou une présentation : la personne voit l'application, pas le canevas.
- Précisez toujours ce que vous attendez: quel parcours relire, quel type de remarques (contenu, accessibilité, cohérence), et pour quand.
- Vérifiez qu'aucune donnée personnelle réelle ne figure dans la maquette partagée.
-
Écrire un commentaire utile
- Un bon commentaire dit où (écran, élément), quoi (le constat), pourquoi (une règle de la charte, un résultat de test, un critère d'accessibilité), et propose une piste ou pose une question.
- Il porte sur l'interface, jamais sur la personne. « Le prix se lit mal » plutôt que « tu as mal choisi la couleur ».
- Un commentaire = un sujet: plus facile à traiter et à résoudre.
- Le designer répond à chaque commentaire, même pour dire « gardé tel quel, parce que… ».
-
La même démarche aujourd'hui
- Figma reprend toutes les fonctions d'InVision : lien de prototype, commentaires épinglés (touche C) avec mentions @ et statut « résolu », Dev Mode à la place d'Inspect, bibliothèques à la place de DSM, et FigJam pour les ateliers.
- Les versions nommées et les sections marquées « Prêt pour le développement » remplacent les statuts de validation.
- D'autres outils proposent aussi le partage et les commentaires : Penpot (libre), Miro (qui a racheté Freehand) pour les ateliers.
- Gardez une trace des décisions dans un journal de revue (numéro, écran, commentaire, type, priorité, statut, réponse) : les commentaires résolus disparaissent de la vue, les décisions doivent rester.
🍽 Exemple : CantineCampus
- Le binôme partage le prototype de CantineCampus avec le directeur (lecture) et un autre binôme (commentaires), avec un objectif : « Relisez les parcours Commander et Ajouter de l'argent avant jeudi ».
- Quatorze commentaires sont reçus : huit corrigés, trois expliqués, deux reportés en version 2, un doublon. La version « v1.1 · après revue » est nommée et annoncée.
⚠ Piège : marquer un commentaire « résolu » sans l'avoir traité fait disparaître le problème de la vue, pas de la maquette.
-
Aide-mémoire
-
Activités
Activité 1Réécrire des commentaires · ⏱ 10 min
- Réécrivez ces commentaires pour les rendre utiles : « bof », « pas clair », « change la couleur », « bien ».
- Chaque commentaire dit où, quoi, pourquoi, et propose une piste.
📁 Résultat attendu : les quatre commentaires réécrits.
Activité 2Une revue croisée · ⏱ 30 min
- Partagez le prototype de votre binôme avec un autre binôme (droit de lecture et commentaires), avec un objectif écrit.
- Relisez le sien : au moins six commentaires utiles, épinglés sur les éléments.
- Triez les commentaires reçus dans un journal de revue (type, priorité, décision).
📁 Résultat attendu : le journal de revue et les captures des commentaires.
Activité 3Résoudre et versionner · ⏱ 15 min
- Corrigez les commentaires prioritaires, répondez à tous, marquez résolus ceux qui sont traités.
- Nommez la nouvelle version et prévenez les relecteurs avec la liste des changements.
📁 Résultat attendu : la liste des changements et le nom de la version.
-
Erreurs fréquentes
| Symptôme | Cause | Solution |
|---|---|---|
| Les relecteurs modifient la maquette | Droit de modification donné | Partager en lecture |
| Commentaires « bof », « pas clair » | Pas de consigne de revue | Objectif et type de remarques demandés |
| Commentaires résolus sans correction | Résolution prématurée | Résoudre seulement après correction |
| Décisions oubliées | Pas de journal | Journal de revue : décision et réponse |
| Lien InVision dans un ancien document | Outil fermé fin 2024 | Recréer le prototype et partager depuis Figma |
-
Bilan
- InVision a popularisé le partage de prototypes et les commentaires ; ses services ont fermé le 31 décembre 2024.
- La démarche reste : partager, commenter, trier, corriger, résoudre, versionner.
- On partage avec les bons droits et un objectif.
- Un commentaire utile dit où, quoi, pourquoi et propose une piste.
- Aujourd'hui, Figma réunit ces fonctions ; un journal de revue garde la trace des décisions.
Une maquette que personne n'a relue n'est pas finie : elle n'a simplement pas encore rencontré ses premiers défauts.