Set up the Figma integration
With Dscout’s Figma integration, you can take your usability tests to the next level by letting your participants interact directly with your design concepts and prototypes. The integration also allows Dscout to collect click event data and generate heat maps you can use during analysis.
Note: It is possible to add prototypes to usability tests without the Figma integration. However, analysis won’t include click event data or heat maps.
Requirements
To use the Figma integration, you’ll need:
A Figma account.
Access to the Figma files you want to use in Dscout missions.
Note: The Figma integration is enabled on the user level rather than the account level. This means individual teammates can choose to connect to Figma or disconnect at any time.
Connect Dscout to Figma
You can connect Dscout to your Figma account from within your profile settings or directly within the builder when creating a usability test.
Tip: Connect Dscout to Figma before adding prototypes to your missions. If you’ve already added prototypes, be sure to re-sync them once you’ve connected to Figma to collect click event data and generate heat maps. For more information, see Re-sync a prototype.
To connect to Figma from your profile settings:
On the Profile settings page, click Integrations in the left sidebar.
Under Figma, click Connect Figma account.
Log in to your Figma account, granting Dscout access when prompted.
Now, you’re returned to your profile settings where you’ll see a Connected badge letting you know the integration was successfully enabled. Next, add a prototype to a usability test! For more information, see Add a Figma prototype to a study.
To connect to Figma from within a usability test:
Navigate to the Usability test tab of your study.
Click Task URLs at the top of the builder. The Manage Task URLs modal is displayed.
Click Manage Figma integration.
Click Connect Figma.
Log in to your Figma account, granting Dscout access when prompted.
Now, you’re returned to your usability test where you’ll see a Connected badge letting you know the integration was successfully enabled. Next, add a prototype to a usability test! For more information, see Add a Figma prototype to a study.
Disconnect Dscout from Figma
If you wish to disconnect Dscout and your Figma account, you can do so at any time from either your profile settings or from within a usability test.
Note: Any prototypes added prior to disconnecting your Figma account will remain connected, meaning they will still collect click event data and generate heat maps. If you wish to disconnect these prototypes, you can delete them from your missions individually.
To disconnect Figma from your profile settings:
On the Profile settings page, click Integrations in the left sidebar.
Under Figma, click Disconnect Figma account. A confirmation modal is displayed.
Click Disconnect to confirm.
Now, Dscout is no longer connected to your Figma account. You can reconnect at any time by repeating the process above.
To disconnect Figma from within a usability test:
Navigate to the Usability test tab of your study.
Click Task URLs at the top of the builder. The Manage Task URLs modal is displayed.
Click Manage Figma integration.
Click Disconnect Figma. A confirmation modal is displayed.
Click Disconnect to confirm.
Now, Dscout is no longer connected to your Figma account. You can reconnect at any time by repeating the process above.