Tester un prototype Figma

21 mai 2024 15:36

Apprenez à configurer votre test de prototype Figma dans UserTesting.

Sur cette page :

À propos de Figma

Figma est un outil de conception de prototypes interactifs qui permet d'élaborer des maquettes en collaboration avec votre équipe.
En l'associant à UserTesting, vous pouvez collecter des avis sur vos prototypes afin de générer des données exploitables à partir de l'audience de votre choix.
L'intégration FigJam vous permet d'intégrer et de regarder des extraits vidéo et des vidéos de sessions UserTesting.
Vous souhaitez en savoir plus sur Figma ? Consultez le centre d'aide de Figma.

Ouvrez le fichier de votre design.
Cliquez sur Lecture pour passer en mode présentation.
Dans la barre de menu, sélectionnez Partager le prototype.
Sous les paramètres Découverte de partage des liens, choisissez Toute personne disposant du lien. Consultez le centre d'aide de Figma pour obtenir des informations de sécurité concernant les liens publics.
Cliquez sur Options dans la barre d’outils pour ajuster la façon dont vous voulez que les contributeurs voient votre prototype :
- Prototypes pour ordinateurs : Sélectionnez Adapter la largeur.
- Prototypes mobiles : Sélectionnez Adapter à l'écran.
Désélectionnez ces options pour éviter toute confusion pour les contributeurs qui ne connaissent pas bien ces prototypes :
- Afficher les conseils des zones actives en cas de clic
- Afficher la barre latérale
- Afficher l'IU Figma
Cliquez sur Copier le lien pour copier l'URL de votre prototype dans le presse-papier.
Remarque : le fait de modifier l'une des options de votre prototype modifiera votre URL.

Cliquez sur Créer test, puis sur Créer un test.
Choisissez Prototype dans la fenêtre Que souhaitez-vous tester ?
Ajoutez votre audience.
Élaborez votre plan de test.
- N'oubliez pas d'inclure tout contexte nécessaire pour chaque scénario.
- Par exemple, préparez vos contributeurs à interagir avec votre prototype en donnant l'explication suivante : « Un prototype vous sera présenté. Veuillez noter que tous les éléments de la page ne seront pas interactifs. »
- Pour les tests mobiles, n'oubliez pas de cocher la case qui spécifie l'utilisation d’un navigateur natif.
Ajoutez l'URL de votre prototype à la tâche.
- Ajoutez autant de tâches supplémentaires que nécessaire sans avoir besoin d'ajouter l'URL du prototype pour chaque tâche.
- Les contributeurs effectueront chaque tâche dans l'URL du prototype que vous avez initialement ajoutée.
- Ajoutez uniquement une nouvelle URL si vous utilisez un autre exemple de prototype.
Cliquez sur Apreçu du plan de test pour voir la Vue Contributeur et vous assurer que votre test se déroule comme prévu.
Conseil de pro : Prévisualisez votre test dans une fenêtre de navigation privée pour veiller à ce que tout le monde puisse y accéder.
Une fois que vous avez vérifié que tout fonctionne comme prévu, lancez votre test.

Une fois votre test terminé, donnez vie à vos résultats en intégrant des extraits vidéo, des sessions et des compilations de moments clés dans vos tableaux blancs FigJam.
Utilisez notre intégration FigJam et notre modèle FigJam.

Indiquez vos attentes à vos contributeurs

Dans le scénario de votre plan de test, indiquez aux contributeurs qu'ils vont interagir avec un prototype qui n'est pas un site entièrement fonctionnel.
Les liens ne fonctionneront pas tous et le prototype peut mettre du temps à charger.

Optimisez le prototype pour qu'il charge le plus rapidement possible

N'oubliez pas que les contributeurs participent par l'intermédiaire de la connexion Internet de leur domicile et que tout le monde ne dispose pas d'une connexion haut débit.
Un prototype lourd et volumineux prend plus de temps à charger et peut inciter les contributeurs à abandonner le test.

Créez un fichier dédié au test

Dupliquez votre fichier Figma contenant les designs que vous voulez tester.
Dans le nouveau fichier, supprimez les pages, ressources, images et éléments qui ne concernent pas le test afin d'obtenir un fichier de test propre et léger.

Définissez des étapes si votre prototype est complexe

Si un aspect de votre prototype risque de dérouter les participants, ajoutez des étapes à votre test.
Cela permet de préparer les utilisateurs à commencer chaque étape de votre test au bon endroit.
Figma prend en charge plusieurs points de démarrage permettant de réaliser cette opération.

Compressez les images avant de les importer dans Figma

Cette opération est importante si vous utilisez un fichier PNG contenant des éléments photographiques pouvant donner lieu à des fichiers volumineux.
Utilisez le module complémentaire Downsize de Figma pour compresser les images volumineuses.

Utilisez les animations intelligentes avec parcimonie

Utilisez les animations intelligentes uniquement lorsque nécessaire pour réduire le temps de chargement.
Essayez d'utiliser des transitions plus simples qui consommeront moins de mémoire vive.

Partagez votre test de manière sécurisée avec vos contributeurs

Vous pouvez demander à vos contributeurs de signer l'accord de confidentialité de votre entreprise avant d'accepter votre test si une confidentialité supplémentaire est requise.
Vous trouverez de plus amples informations sur le partage sécurisé de liens publics dans le centre d'aide de Figma.