En bref
- Figma ne sait pas enregistrer un prototype tout seul : vous le lancez en mode présentation et vous enregistrez cette fenêtre avec un enregistreur d’écran.
- Réglez l’appareil, l’arrière-plan et les flux dans l’onglet Prototype avant d’enregistrer, et masquez l’interface de Figma pour que le client ne voie que le design.
- Allez plus lentement que si vous étiez seul : marquez une pause sur chaque écran, survolez les éléments volontairement et attendez la fin des délais et des transitions.
- Enregistrez la fenêtre, pas tout l’écran, et commentez les décisions, pas les clics.
- Envoyez le lien de la vidéo avec une question claire, pour que le client sache ce que vous attendez de lui.
Pour enregistrer un prototype Figma, ouvrez-le en mode présentation, réglez l’appareil et les flux dans l’onglet Prototype, masquez l’interface de Figma et enregistrez cette fenêtre avec un enregistreur d’écran tout en parlant. Figma n’a pas d’export vidéo : la qualité de la visite commentée dépend de la préparation du prototype et de la lenteur de vos clics.
Ce guide concerne la vidéo que vous envoyez à un client avant une réunion de relecture, ou à sa place : « voici le nouveau tunnel de commande, et pourquoi il fonctionne ainsi ». Pas une vidéo promo léchée, une explication claire.
Préparez le prototype avant d’appuyer sur Enregistrer
La plupart des vidéos de prototype brouillonnes le sont à cause des réglages du prototype, pas de l’enregistrement. Cinq minutes ici vous épargnent trois prises.
Réglez l’appareil et l’arrière-plan
Les paramètres du prototype se trouvent dans la barre latérale de droite. Cliquez sur un espace vide du canvas pour ne rien sélectionner, puis ouvrez l’onglet . Vous y trouverez :
- Appareil : le type, l’orientation et le modèle utilisés en mode présentation. Un modèle de téléphone place les designs mobiles dans un cadre réaliste, ce qui aide le client à se représenter le résultat.
- Arrière-plan : la couleur derrière le prototype en mode présentation. Choisissez une teinte neutre qui ne concurrence pas le design.
- Flux : les points de départ des parcours sur la page actuelle.
Pour les designs desktop, un cadre d’appareil gêne plus qu’il n’aide. Choisissez plutôt ou , pour que le design remplisse la fenêtre.
Donnez à chaque parcours son propre flux
Un point de départ de flux indique à Figma où commence un parcours, et vous pouvez en avoir plusieurs. En mode présentation, les flux apparaissent dans une barre latérale à gauche, avec leur description.
Nommez-les comme le client les pense : « Inscription », « Commande », « Modifier une réservation ». Chaque enregistrement part alors d’un point propre, et la touche R vous ramène au début du flux en cours si vous devez recommencer.
Vérifiez les interactions au survol et à délai
Les interactions qui dépendent du temps sont celles qui ont l’air cassées en vidéo. Lancez chaque flux une fois avant d’enregistrer et vérifiez ces trois déclencheurs :
| Déclencheur | Ce qu’il fait dans Figma | Que faire en vidéo |
|---|---|---|
| While hovering | Affiche un état tant que le pointeur reste sur la zone interactive, revient en arrière quand il la quitte | Placez-vous sur l’élément, ne bougez plus, dites ce qui a changé |
| Mouse enter | Se déclenche une fois, quand le pointeur entre dans la zone interactive | Entrez une seule fois, franchement, sans ressortir par mégarde |
| After delay | Passe tout seul à la suite après un temps défini sur la frame, en millisecondes | Allongez le délai pour l’enregistrement ou remplacez-le par un clic |
Les écrans en After delay sont le piège habituel : ils passent à la suite pendant que vous êtes encore en train de les expliquer.
Préparez le mode présentation
Ouvrez le prototype avec Présenter dans la barre d’outils, ou appuyez sur ⌘⌥Return. Puis faites le ménage :
- Désactivez les indices de zones interactives. Décochez . Sinon, chaque clic en dehors d’une zone interactive fait clignoter des cadres bleus sur le design, et en vidéo, ça ressemble à une erreur.
- Masquez l’interface de Figma. Choisissez pour retirer la barre d’outils et le pied de page.
- Choisissez une échelle. Sans cadre d’appareil, vous avez le choix entre Taille réelle (100 %), Responsive, Ajuster à la largeur, Ajuster la largeur et la hauteur ou Remplir l’écran. Avec un cadre d’appareil, l’interrupteur d’appareil en bas propose des options comme Ajuster l’appareil à l’écran. La touche Z passe de l’une à l’autre.
- Passez en plein écran si vous enregistrez tout l’écran. Utilisez l’icône plein écran de la barre d’outils de présentation.
- Partez du flux. Choisissez le flux dans la barre latérale, puis masquez la barre latérale pour qu’elle ne soit pas dans le champ.
Enregistrez la fenêtre, pas l’écran
N’enregistrez que la fenêtre du navigateur ou de Figma qui affiche le prototype. Un enregistrement de tout l’écran capte votre Dock, vos autres onglets et la notification que vous aviez oubliée.
Sur macOS, vous pouvez le faire avec l’outil de capture d’écran : appuyez sur ⌘⇧5, choisissez l’outil Enregistrer une partie de l’écran et tracez le cadre autour du prototype. Notre guide pour enregistrer une fenêtre ou une partie de l’écran présente les options, y compris avec plusieurs moniteurs. Si vous débutez dans l’enregistrement sur Mac, commencez par enregistrer son écran sur Mac.
Avant de commencer, passez la checklist de 60 secondes avant d’enregistrer : notifications coupées, onglets sans rapport fermés, contenu de test dans le design plutôt que les données d’un vrai client.
Cliquez plus lentement que vous n’en avez l’habitude
Vous savez où se trouve chaque zone interactive. Votre client, non. En vidéo, votre rythme normal paraît frénétique.
- Marquez une pause sur chaque écran pendant une ou deux secondes avant de cliquer. Dites à quoi sert l’écran.
- Amenez d’abord le pointeur sur la cible, puis cliquez. Le spectateur voit où vous allez avant que ça se produise.
- Survolez volontairement. Pour les états au survol, placez-vous sur l’élément, ne bougez plus, et dites ce qui change.
- Attendez les transitions. Les transitions animées et les overlays ont besoin d’un instant. Cliquer pendant une animation peut la sauter ou tomber sur la mauvaise zone interactive.
- Ne faites pas défiler trop vite. Si une frame défile, avancez par petits pas et arrêtez-vous là où vous voulez que le client regarde.
Si le client risque de regarder sur un téléphone, des clics mis en évidence et un léger zoom sur les petites commandes aident. Nous expliquons quand ça aide et quand ça donne le tournis dans zoom automatique : quand il aide votre spectateur.
Commentez les décisions, pas les clics
« Maintenant je clique sur Continuer » n’apprend rien au client qu’il ne voie déjà. La valeur d’une visite commentée, c’est le raisonnement que vous expliqueriez sinon en réunion.
Une structure simple pour chaque flux :
- À quoi sert ce flux : « Voici comment un client qui revient modifie une réservation. »
- La décision derrière : « Nous avons déplacé le choix de la date à la première étape, parce que d’après le brief, la plupart des modifications portent sur la date. »
- Ce qui reste ouvert : « L’écran d’annulation est provisoire, en attendant le texte des conditions. »
- Ce dont vous avez besoin en retour : « Pouvez-vous vérifier la formulation de l’étape deux ? »
Visite commentée d’un prototype, premier tour
Envoi d’un prototype cliquable pour une première relecture · Environ 3 minutes
Bonjour Claire, voici la première version cliquable du parcours de réservation. Je le parcours une fois depuis le début, ensuite vous pourrez cliquer vous-même avec le lien ci-dessous.
On commence sur la page de réservation. Le principal changement par rapport aux wireframes, c’est que la date arrive en premier, parce que c’est ce que la plupart des gens modifient. Quand vous touchez une date, les horaires disponibles s’affichent juste en dessous, sans nouvel écran.
Deux éléments sont encore provisoires : l’e-mail de confirmation et le texte des conditions d’annulation. Ce dont j’ai besoin, c’est d’un oui ou d’un non sur la date en premier, et des formulations que vous changeriez à l’étape récapitulative.
Pour aller plus loin sur la structure d’une présentation de design, y compris les deuxièmes tours et les comparaisons avant/après, voyez présenter une maquette à un client sans réunion. Si la vidéo est un retour plutôt qu’une présentation, le feedback design en vidéo suit une autre structure.
Envoyez-la avec le lien du prototype
Une fois terminé, envoyez deux choses dans un seul message : la vidéo, et le lien du prototype Figma pour les clients qui veulent cliquer. Mettez aussi dans le message la question à laquelle vous avez besoin d’une réponse, pas seulement à la fin de la vidéo.
Bonjour Claire, voici une courte visite commentée du parcours de réservation. Le lien du prototype est ci-dessous si vous voulez cliquer vous-même. Une question : la date en premier vous convient-elle ? Un oui ou un non d’ici vendredi nous permet de tenir le planning.
https://justrec.app/v/k3f9Qa
Si vous envoyez souvent ce genre de vidéo, notre page sur l’envoi de vidéos aux clients explique comment fonctionnent le lien et la page client, et le guide de la vidéo asynchrone pour la communication client explique quand une vidéo remplace un appel.
Sources
- Centre d’aide Figma : Lire vos prototypes, consulté en novembre 2026.
- Centre d’aide Figma : Définir l’appareil de prototype et les paramètres d’arrière-plan, consulté en novembre 2026.
- Centre d’aide Figma : Déclencheurs de prototype, consulté en novembre 2026.
- Assistance Apple : Prendre des captures d’écran ou effectuer des enregistrements d’écran sur Mac, consulté en novembre 2026.
Questions fréquentes
Figma peut-il enregistrer un prototype en vidéo ?
Non. Figma lit les prototypes en mode présentation et en aperçu en ligne, mais n’a pas d’export vidéo intégré. Vous enregistrez la fenêtre de présentation avec un enregistreur d’écran, comme l’outil de capture d’écran de macOS, QuickTime ou une app dédiée.
Comment masquer la barre d’outils de Figma pendant la présentation d’un prototype ?
En mode présentation, ouvrez le menu d’options et choisissez Masquer l’UI. La barre d’outils et le pied de page disparaissent, et un paramètre est ajouté à l’URL pour que toute personne qui ouvre ce lien voie le prototype sans l’interface.
Comment afficher un prototype Figma sans cadre d’appareil ?
Désélectionnez tout sur le canvas, ouvrez l’onglet Prototype dans la barre latérale de droite et choisissez une option d’appareil sans cadre, comme Taille personnalisée (ajustement) ou Mode Présentation (complet), plutôt qu’un modèle de téléphone ou de tablette.
Quelle durée pour la visite commentée d’un prototype ?
Aussi courte que la décision dont vous avez besoin. Un flux avec les raisons qui le justifient tient en général en deux à quatre minutes. Si vous avez plusieurs flux, enregistrez une vidéo par flux pour que le client puisse répondre à chacun séparément.
Faut-il envoyer le lien Figma ou une vidéo ?
Les deux fonctionnent mieux ensemble. La vidéo explique pourquoi le design fonctionne comme il fonctionne ; le lien du prototype permet au client de cliquer ensuite. Beaucoup de clients ne regardent que la vidéo : elle doit donc se suffire à elle-même.
