How to Optimize Figma for Customer Presentations?
Figma is a tool for designing and prototyping digital experiences. It’s also a great way to make customer presentations.
The prototyping functions offered by Figma are a fantastic way to quickly get customer feedback.
During some customer presentations, I encountered an important problem: Figma memory is sometimes insufficient. In fact, two types of occurrences impact the navigation during the start of the animated prototype:
- The prototype turns completely black,
- Shortly after Figma opens, a message appears via a pop-up stating that the memory is insufficient.
I then became Interested In the different ways to fix it and get a fluid prototype. We are now going to discuss 3 issues that greatly improve Figma performance.
1 – Avoiding Hidden Layers
If a component uses a lot of hidden layers, a Figma file can potentially be associated with millions of objects, and that inevitably contributes to exhausting its memory.
Our advice? Create several different components.
2 - Compress your Images
In my opinion, the speed of the prototype is mainly impacted by the images' weight.
In HD quality and in large dimensions, Images can take up a lot of memory. Since Figma does not have any plugins for optimizing images, I personally went through Photoshop and its "Optimize for the web" functionality and then reimported the images into Figma. With this manipulation done, we can really feel the difference.
Another tip: Figma offers a tool that Indicates the resources consumed by each item. Thanks to this functionality, you can quickly judge if your file is too large.
3- Use of an External Library
To gain RAM, it is good practice to have two files:
- A library of all components,
- A file made up of all the models without the components.
In this second file, we authorize the external library via the assets board. Using an external library is a very good practice within the framework of design systems (when several files communicate with the same component file).
4- Conclusion
Figma can be used like Invision.
To do this, it is necessary to optimize your Figma file to avoid memory problems.
To summarize:
- Avoid large images or large vector files,
- Avoid hidden layers in the components, as they lead RAM overconsuming,
- Promote an external library of components.
