How to Optimize Your Prototype

2 min read

Figma prototypes consume a lot of RAM if they are not optimized. This can cause issues for some users, especially on mobile devices.

We recommend adhering to the following simple guidelines to reduce the likelihood of issues on the user's end:

1. Compress Large Images

Figma does not compress images by default, so we recommend compressing them manually. This is especially important if the prototype contains a lot of large images (e.g., avatars or product illustrations).

For quick compression of images to the size used in the layout, you can use compression plugins (e.g., Downsize or any others).

2. Limit Frame Size and Quantity

When navigating a prototype, all the data from the Figma file is loaded. The more frames there are in the prototype, the more memory it will require to load. We recommend keeping only the elements related to the prototype: 1 file — 1 page — 1 prototype.

We also advise avoiding duplicate frames where possible, for instance, by using components for repetitive elements.

It's best to remove any unnecessary frames, images in the margins, pages, or hidden layers.

3. Split Heavy Prototypes into Multiple Parts

Whenever possible, divide large and heavy prototypes into several separate scenarios that the testers can proceed through sequentially.

By adhering to these recommendations, according to our estimates, issues occur on average in less than 1% of respondents on PCs and 1-3% on mobile devices.

If a tester’s device struggles with the prototype, we will attempt to reload it several times. If this does not help, we will politely inform them of the issue and explain that they will be unable to complete the test.

Did this answer your question?