To take advantage of the fast and efficient testing provided by Maze, we suggest optimizing your Figma prototype before importing it into Maze. This ensures shorter load times and decreased payload for testers. If facilitated by an optimized prototype, the testing process will be an extremely quick and easy step in your design flow.
Here's how to prepare your prototype before importing it into Maze.
Tips for optimizing your Figma prototype
-
Create a dedicated testing file. Duplicate your working Figma and use the copy for the prototype that you'll use for testing with Maze. In this file, remove any pages, frames, assets, images, and elements not relevant to testing before importing. This ensures a clean and lightweight testing file. If you import your working file with potentially hundreds of additional frames instead of the dedicated testing file, this could impact your ability to import your prototype and could make it impossible for testers on mobile devices to take the test.
-
Limit your frames and pages. When you import your prototype into Maze, all frames and pages within that prototype are rendered and imported. If your prototype includes a lot screens, importing will take longer and the testing experience may be slower than usual.
-
Use frames for screens. Maze is designed around the assumption that each screen you'll be testing will be a top-level frame within your Figma file. If your screens aren't contained in frames, or if your screens are components that don't reside within a frame then you'll have trouble with Maze processing your prototype correctly.
To avoid that, we recommend limiting the number of frames and pages in your prototype to the ones you need for testing. Limiting the size of your prototype to match the scope of your test makes the creation of a test that much easier. By not having a plethora of screens which increase load time, you'll also ensure testers don't leave the test because of performance issues, thus biasing your test results. Fewer screens to go through means fewer errors when setting up a test and more accurate test results.
- Compress images. The most simple of the 3 tips: Compress your images before uploading them to Figma. Figma doesn't compress images by default, so you must do so beforehand to avoid loading heavy images and slowing down the workflow. This is especially important if inserting PNG with photographic elements that may result in very large filesizes.
A large and heavyweight prototype will take longer to load on users' devices, and might lead to them leaving the test because of it. We've found that if a test takes more than 12s to load on average, most testers will give up before even getting started. This can also make it harder to test on older devices with less memory.
Optimizing your Figma prototype with the tips above ensures users will have a light testing experience and avoids biased data such as give-ups or bounces due to performance issues.
What to do if your Figma prototype takes more than 12s to load
If your prototype takes more than 12s to load, go back to your Figma prototype and optimize the file based on the tips above. When done, refresh your prototype in Maze with the changes made.