From July 31, 2020, you can now import your Figma models directly to Bubble. A huge time saver for page integration? We were able to test it, and you will find here our feedback on this new Bubble.
How do I use Figma import on Bubble?
We’ve done a detailed summary of the set-up, and you’ll also be able to see the rendering on a demo page. To begin with, in order to achieve the Figma import, we will need some keys to connect it to your Bubble platform. Here are the different steps:
Get your API key
Towards Figma’s settings by clicking on your profile at the top left.
The API key must be generated on Personal Access Tokens.
Recover the Figma ID from the file
Open your Figma file. In your URL, you will have something like https://www.figma.com/file/id/name-of-the-file
Take what is right after file; in the example, it is id.
Bubble setting
If you want to see the result obtained from this Figma, you will find the Bubble here. Saas Design made the Figma.
This feature will make it even smaller for your app to develop. In a matter of seconds, all your screens are imported.
Our opinion on the Figma Bubble import
Importing saves significant time for the import of screens. But it will have to be retired because the import will not create groups but usually shapes, which can make the responsive more complex.
In short, a nice addition, but that will not revolutionize the integration time as many elements need to be reworked.
You have questions on your Bubble platform, ask it in the comment section or contact us.
