Using Figma Sites in a website test – Maze Help

Figma Sites allows you to publish responsive websites directly from your Figma designs, and integrating Maze's tracking code enables you to conduct user testing and gather feedback on your live Figma Sites projects.

Maze lets you test your AI-generated sites with or without the snippet installed. If you want to iterate quickly, you can launch a test without it and still gain valuable insights through recordings. Installing the snippet only takes one extra prompt and enables quantitative data collection for deeper insights—choose the option that best fits your workflow. See here how to test without snippet

Prompting for URL path changes

When setting up paths on a website test block, the URL needs to change between screens to register a new step in the path. Otherwise, you might see a message that states no clicks were detected when setting up expected paths.

To solve for this, you can leverage the example prompt template below to ask the AI to build the site with URL path changes in mind. We recommend adding additional instructions on how you’d like the AI to structure the paths in your URL, as these prompts are meant to function as a starting foundation.

Multi-page sites

This should be a multi-page website where, when I click any links to navigate to a new location, the browser should go to a new page and the URL should change (not a single-page application). I am going to perform UX testing in Maze with this prototype website, so in order to track participant activity, I need the URL to be unique for each separate page. Please also use a shared layout or template so all pages pull in the same head section.

Single-page applications (SPAs)

This should be a single-page application where when I click any links to navigate to a new location, the browser should update the URL so that they each have a unique path. I am going to perform UX testing in Maze with this prototype website, so in order to track participant activity I need the URL to be unique for each separate page.

Install the Maze tracking code on your website with snippet-based testing

To enable snippet-based usability testing on your live website, you’ll need to install a unique code snippet that enables this feature to run on your website.

You’ll also be prompted to follow these steps from your draft maze if you haven’t added the code to your URL’s domain yet when creating a website testing block.

Learn how to install the Maze tracking code on your website

How to add tracking code to Figma Site

Once you have obtained your tracking code from Maze, follow these steps to add the snippet to your code in Figma and use your Site in a Website Test:

Create a new Site in Figma
Go to Site Settings (⛭) from the left sidebar
Paste Maze snippet into Start of <head> under Custom code
Publish Site & copy URL
Create a new maze and include a Website Test block
Paste URL into block and click Add

Still need help?

If you have any questions or concerns, please let our Support team know — we'll be happy to help!