User Testing with Figma

Testing prototypes with users can be a challenge, but user testing with Figma and Userbility is simple.

Testing early designs and prototypes with users can have a huge impact on the success of any new product, feature, tool, or website.

According to studies, every dollar spent on enhancing user experience yields $10-$100 in benefits, increased sales, and increased profits.

This post provides you with the information you need to test your Figma prototype yourself with Userbility.

Let’s dive in!

Traps to avoid when user testing with Figma

Mentioned earlier, user testing prototypes can be a tricky business, but there are a few simple traps you can avoid to ensure a successful study:

• Provide correct link sharing access: set your Figma prototype link sharing access to ‘Anyone with the link’. This will ensure participants are able to access your prototype. Once the test has concluded, change the link sharing access back to ‘Anyone at your company’ or ‘Only invited people’.
  
  
• Select the correct device in test creation: don’t test on devices that your prototype isn’t designed for; this will ensure that participants are emulating real-life situations. If you’re testing a mobile app, for example, run your test on a mobile. If you’re testing a website, run it on a laptop.
  
  
• Provide alterative navigation paths: a prototype may be low fidelity, but users will still try to use it in ways that were never intended by the designer. Offer multiple navigation paths within your prototype so that users won’t become frustrated when they can’t use it in the way they want.
  
  
• A thorough, yet concise scenario: testing with prototypes is less common than testing with live websites, so, it’s important to prepare users ahead of time, letting them know that not all functions may be available.
  
  

User Testing with Figma Setup Checklist

It’s even more critical to spend a bit more time setting up Figma prototypes for user testing than for a live website. This is due to

To make the setup process simple, we’ve broken it down into 3 steps:

1. User test creation
2. Participant recruitment
3. Study analysis
   
   

User test creation

Creating a user test for testing your Figma prototype is simple! Follow these simple steps:

1. Figma link sharing: to begin user testing your Figma prototype, all you need to do is create a shareable link of your designs. To create a shareable link of your prototype, head to Figma and generate the share link from within your project. Be sure to set your access permissions to ‘Anyone with the link’, as this will allow participants in your user test to access your Figma prototype. You also want to set access to, ‘Can view prototypes only (Figma design)’.
   
   
2. Define a clear testing script: a well-designed user testing script includes three parts: scenarios, tasks, and questions. The opening scenario should be crafted carefully; it sets the stage for the rest of the study and allows participants to get into the right frame of mind. It also allows you to explain to participants what they will be testing and why.
   
   Tasks are what you observe – what the user participant is doing and how they’re doing it. For example, using the prototype, find the make-up category.
   
   Questions are what you ask throughout the user test, to understand the participants thoughts, feelings and the why behind their actions.
   
   
3. You only need 5 participants to get started: when planning your user test, it can be tempting to believe that more feedback from more people will lead to better results. However the most effective way to run a user test is with a small group of five participants and run as many tests as you can afford.
   
   Userbility’s pricing allows you to pay-as-you-go. You only pay for the number of participants you need, when you need them.
   
   

Participant recruitment

Recruiting the correct participants to test your Figma prototype can be the difference between a successful and successful study.

To ensure you’ve recruited the correct participants, follow these 3 core actions:

1. Filter by behaviours: while demographics allow you to filter a large pool of prospects to a smaller subset, they do not provide information on the specific behaviors that make up your target users. A 30-year-old male can both be a user for Bunnings and hair loss treatment . Filter by behavior to find your ideal participants—people who shop online 3+ times a week, have or are renovating their kitchen.
   
   
2. Avoid leading questions in pre-screening: when posing pre-screening questions, be aware of the wording of your questions. Leading questions can cause respondents to give you the answer they think you want rather than their true opinion e.g. Do you shop at Bunnings? Yes or no. Re-write your screener questions to be open ended e.g. How often do you shop at Bunnings? Never, once a week, once a month, etc
   
   
3. Add fake answers to your pre-screen questions: if your customers are familiar with your brand, product or website, they will be able to choose the correct answer to your question. Adding a spoof answer will help weed out those who are pretending to know the answer e.g. Which hardware stores do you shop at? Bunnings, Mitre10, Bobs Building Supplies, Good Timber Australia
   
   

Study analysis

Analysing a prototype user can be broken into 2 parts:

1. Recording observations
2. Building insights

You record observations by noting down behaviours e.g. User landed on the homepage and immediate dismissed the pop-up.

By combining observations from a series of participants, you’re able to identify a pattern in their responses and build an insight e.g. 12 of 13 participants dismissed the pop-up on page load.

Recording observations

Start your Figma user test recordings and take notes on what the participant is doing—such as ‘landing on homepage then navigating to makeup category’.

It’s useful to add a ‘tag’ to each observation, as this will allow you to find them when building an insight.

Not sure what to record? It is important to stay focused on the test objectives when recording observations. This will ensure that you don’t miss anything important in your notes.

Building insights

With a compiled (and tagged) list of observations, you can build insights.

An insight is usually highlighted when there is a trend in user behaviour and observations are triangulated within the study e.g. if a trend in behaviour is to immediately dismiss the pop-up and post-study feedback indicates the pop-up is frustrating and intrusive, it’s fairly accurate to say ‘the pop-up is frustrating users’.

Wrap-up

The user testing process of Figma prototypes is quick and efficient. You can use user testing to validate ideas, identify critical usability issues, and boost conversions. When you’re ready to test your prototype on real users, be sure to create a user testing script and check your link sharing settings before publishing your test.

Start user testing your Figma prototype with Userbility to get immediate feedback to help shape, refind and polish your Figma prototype.