Creating an app with Figma
Last updated
Last updated
There are two ways to import your Figma file to Bravo: importing it through our platform and by using our Figma Bravo Plugin.
Let's explain how to import the following sample design file:
1. Go to the Apps page, click create a new app.
2. In your Figma file, click Share, then Copy link. Make sure the permission for "Anyone with the link" is can view.
3. Back in Bravo Studio, paste the share link of your Figma file. Click Connect Bravorized Figma file
4. Wait for Bravo to do its magic. It's transforming your Figma design into native app screens.
5. Once the project is successfully created from your file, you will see a preview of the app screens created from your Figma file.
Ran into an error? Check out the troubleshooting page.
6. Check out your app with the Bravo Vision previewer app. 🚀
📱Bravo Vision previewerThe Figma Plugin allows you to import your current Figma design into Bravo.
Open your Bravo Plugin and select the Import tab.
Click on Sign In to connect to your Bravo Studio account.
Click on Open browser and Confirm the given code from the Figma plugin and the opened browser.
4. Once confirmed, this confirmation message will appear. Close the window and return to the plugin.
Click on Create New Project to import a new Figma design to Bravo.
Make sure that your design has at least a frame or a UI element for it to be imported.
Wait for Bravo to do its magic. It's transforming your Figma design into native app screens.
7. Once the project is successfully created from your file, in Bravo you will see a preview of the app screens created from your Figma file.
Ran into an error? Check out the troubleshooting page.
8. Select Update Project to sync your Figma file with Bravo whenever you make any modifications.
In addition, you have the option to create a new project using the same Figma file. Simply click on the Create another new project link.
10. Check out your app with the Bravo Vision previewer app. 🚀
📱Bravo Vision previewer
