Task questions in dscout usability tests can include a starting URL. When the URL or prototype link is included in the URL field, the URL opens automatically for participants when they start the task. Use your Figma prototype as the starting URL when you want to test it with dscout.

Before adding your prototype, make sure to review Preparing your Figma file for testing, which walks you through how to optimize your Figma prototype and set the share settings properly. 

Figma prototypes can be added to a mission at the mission level or through a mission task question. 

Add a Figma prototype at the mission level

Figma prototypes and task URLs can be managed within your mission in one place, the Manage Task URL’s modal which can be accessed by selecting the Task URLs button in the upper right-hand corner of the Create tab.  

In the Manage Task URL’s modal, you can view all prototypes (or web URLs) in your mission and which task questions they are added to. You can also add, refresh, and delete prototypes. Prototypes or URLs added to a mission through an individual task question will automatically show up here.

  1. Open the Usability test where you want to use the Figma prototype
  2. Click the Task URLs button in the upper right-hand corner of the Create tab.
  3. Click Add URL and select Figma prototype to input a new prototype. You can also include non-Figma prototype URLs (such as live websites).
  4. If you haven't already, you will be prompted to connect your Figma account. Read more about the Figma integration. 
  5. Paste your Figma prototype link (not the file link) with the correct share settings (we recommend Anyone with the link can view. Read more about preparing your Figma Prototype for Testing
  6. Depending on the size of your prototype, it may take a few minutes to process. Once it has been fully processed, the prototype will show as connected. (Note: 100 MB is the maximum supported file size.)

Add a Figma prototype through a task question

  1. Open the Usability test where you want to use the Figma prototype
  2. Add a task question to your Usability test. Learn all about task questions and task URLs.
  3. Select Add in the Task URL container and choose Figma Prototype.
  4. If you haven’t already, you will be prompted to connect your Figma account. Read more about the Figma integration. 
  5. Paste your Figma prototype link (not the file link) with the correct share settings (we recommend Anyone with the link can view. Read more about preparing your Figma Prototype for Testing
  6. Depending on the size of your prototype, it may take a few minutes to process. Once it has been fully processed, the prototype will show as connected. (Note: 100 MB is the maximum supported file size.)
  7. Once the prototype is added, you can also select a Starting Screen and Success Screen for your tasks. Read more about setting a starting and success screen below. 

Note: you have the ability to hide your Figma title in the prototype view if you've hidden Figma UI in your prototype settings; however, the title of your Figma file will still be visible in the URL itself.

Editing the Start Screen (with Figma)

When using a Figma prototype in a usability task question, you can edit the start screen for that task. Editing the start screen will take precedence over the “starting frame” set in Figma for the attached prototype URL. This allows prototypes to be broken into different task questions and is particularly helpful for complex prototypes or usability tests that include multiple progressive tasks to ensure participants begin each task on the same screen. 

  1. Click the Edit icon in the Starting screen container.  

  1. The default start screen is selected in the lefthand sidebar, indicated by a blue checkmark. Choose the desired start screen from the lefthand sidebar and click Save.
  2. Once saved, the starting screen in the task question will update to display the new starting screen designation.
  3. You can edit the start screen for any task question in your mission that uses an integrated Figma prototype.

Setting a Success Screen (with Figma)

When using a Figma prototype, you can also select a Succes screen from your prototype to automatically determine the successful completion of a task. Your Figma account must be integrated with dscout to set a success screen. Setting a success screen is optional. 

  1. Click Select Screen in the Set success screen container.
  2. Choose the desired success screen from the lefthand sidebar and click Save.
  3. Once saved, the success screen in the task question will update to display the designated success screen.

Troubleshooting

If you encounter any errors or issues when adding a Figma prototype to a task question, check out our Figma Troubleshooting Guide

Was this article helpful?

4 out of 6 found this helpful
Have more questions? Submit a request