Is it possible to convert multiple Figma pages to the same Lovable project and/or repository?

General
1

Hello everyone. I have been using the Builder Figma plugin to generate code and open it with Lovable and it’s been a fantastic experience!

But here is the situation: every frame I convert in order to open with Lovable makes Lovable create a new project.

The question is: is it possible to generate code for multiple pages and convert them to be used within the same Lovable project and/or repository?

Thanks in advance!

2

Hi @rodrigueskaio ,

Thank you for sharing your experience with the Builder Figma plugin and Lovable!

Regarding your question, currently, each frame you convert to open with Lovable creates a new project, and there isn’t an option to combine multiple pages into a single Lovable project or repository at this time.

I completely understand how this might be a bit limiting, and I apologize for any inconvenience it may cause.

Best regards,

1 Like
3

Does anyone know if there is an ETA on when this functionality will be rolled-out? Being able to create a Loveable project from a single Figma design is certainly a step forward. But in the long term, not being able to interact between both an evolving design and also multiple design pages is clearly a show-stopper on this type of integration.

4

Hi @ariel ,
I completely understand how valuable it would have been to have the ability to use multiple design pages in a seamless way. At the moment, we don’t have an exact ETA for when this functionality will be available.

Our team is continually working on improving the integration, and while we’re excited about the potential of creating Loveable projects from Figma designs, we also want to ensure that future updates are implemented carefully to maintain quality and performance.

We truly appreciate your feedback and interest, and we’ll be sure to keep you informed as any new features or updates are rolled out. In the meantime, if you have any other questions or need support with anything else, feel free to reach out!

Thanks,

5

As a workaround, can I export code from Builder to GitHub, then to Loveable? I assume this would allow me to integrate multi-page designs (e.g. entire website or SAAS app) to Loveable. Also possibly, you can suggest other work-arounds, as this is a highly critical use-case, given that almost all apps and websites have more than one page. Thanks for your reply.

6

Hi @ariel ,

Yes, you can export code from Builder.io to GitHub and then integrate it with Lovable if both are using the same repository. This process allows you to seamlessly manage multi-page designs (such as entire websites or SAAS applications) by syncing your Builder.io project with your GitHub repository and subsequently integrating it with Lovable for building full-stack applications.

Steps for Integration:

Set Up Repository:

  • Ensure your Builder.io project and Lovable app are both connected to the same GitHub repository. This setup is crucial for maintaining synchronous updates across both platforms.

Export Code from Builder.io to GitHub:

  • Use Builder.io’s export functionality to generate code from your designs and push it directly into your GitHub repository. This process is often facilitated by Builder.io’s Visual Copilot which efficiently translates Figma designs into code.

Integrate with Lovable:

  • Once your code is in the GitHub repository, Lovable can pull updates from there. This integration allows Lovable to utilize the Figma designs converted via Builder.io for creating or updating your application.

Create Multi-Page Designs:

  • By maintaining this workflow, you enable a streamlined system for integrating multi-page designs across platforms, acknowledging the complex needs of modern web and application design.

Push Changes and Manage Branches:

  • You can manage updates and iterations through GitHub’s version control, facilitating collaborative workflows and ensuring that any changes made in Builder.io reflect across your project once pushed.
7

Have we got any solution to this yet? Can i create a flow of 4,5 screens and then import all the screens in 1 go in Loveable?

8

Hello @pspratik,

Thank you for reaching out!

At the moment, exporting multiple screens at once using the Builder Figma plugin isn’t supported. However, we’ve submitted a feature request to our team, and it’s currently under discussion.

We’ll be sure to keep you updated on any progress made regarding this functionality.

Thanks again for your feedback!

Best regards,