Community forum for knowledge and support

Updated 4 months ago

Understanding the Relume, Figma, and Webflow Workflow

At a glance

The community member is new to Relume but familiar with Figma and Webflow, and is seeking help to understand the Relume > Figma > Webflow workflow. They have done some research and watched tutorials, but still have some specific questions about the best process to follow.

The community members discuss the workflow, noting that there is no "magic button" to take Figma designs and automatically generate a Webflow website. However, Relume does have a Webflow app that can import wireframes from Relume's Site Builder into Webflow, creating the pages. The community members also discuss the limitations of Webflow's "Figma to Webflow" plugin, and how to handle components that don't match anything in Relume's library.

The community members suggest finding existing Relume components that are 75% of the way there, and then customizing them in Webflow, rather than building everything from scratch. They also note that while they enjoy building bespoke components in Webflow, they prioritize efficiency.

There is no explicitly marked answer, but the community members provide guidance and resources to help the original poster understand the Relume > Figma > Webflow workflow.

Useful resources

Hi...new to Relume (but familiar with Figma and Webflow)...is there anyone that could spare me a couple of minutes just to help me understand the Relume > Figma > Webflow workflow, please? Id be eternally grateful.

I'm not a complete newbie FYI...it's just one of those things where some clarification on best process that I can't find in tutorials could save me a lot of heartache.

M
S
26 comments

no problem Samuel - here are some resources that we've put together that should help with this. If you've watched all these, I'd likely need more specific questions.
https://www.relume.io/resources

Thanks I've watched a lot of those yes, and done a lot of reading. Let me try and explain. My task is to design and build a new site in Webflow, so far I have:

  1. Done my sitemap in Relume and used the AI tools to create my wireframes (this was awesome)
  2. Taken wireframes into Figma and have a copy of the styleguide in Figma which I am yet to complete

This is where I'm confused....is it now best practice to turn these wireframes into my final site design?

If I'm correct, there's actually a disconnect at the end of the design phase, because you then have to just use those designs as a reference to then go and find the Relume Webflow components anyway?

I'd happily pay for someones time to jump on a call just to check 'best process' before I dive in a rabbit hole haha

yeah at the moment there is no magic button that'll take your final designs in Figma and produce a website in Webflow. However we do have a Webflow app that will bring all of your Site Builder wireframes into Webflow, creating all of the pages etc. We have a style guide as well which you would clone to get started in Webflow. After you've imported your wireframes into Webflow, then you would customize the style guide, and then yeah reference your figma file to reproduce your design in Webflow. Probably not the answer you were looking for.

Have you used Webflow much before or not really?

Thanks for this, and yes that confirms my thoughts. Yes I am Webflow savvy, fairly well.

okay good - so this wasn't that devastating of an answer

Im just questioning if its actually easier to just do the final design using Webflows official plugin

ah yeah it wont produce the results you'd expect - the "Figma to Webflow" plugin developed by Webflow Labs?

it generates a very broken result

and this is actually because of the framework we use - Client-First

that plugin just generates its own code

ok...and how do you manage a component that you design in Figma that doesn't really match anything in Relume? Just build that one bespoke?

yeah, or find one that gets you 75% there. I haven't built a bespoke component in over 100 websites so yeah thats usually my process - find one that has the pieces of what I need and go from there.

and I actually really love building bespoke components in Webflow

but love efficiency more

Ok cool...well thank you. I knew there was a breaking point in the workflow somewhere, but just didn't know how to get around it

appreciate your time

no problem - if you run into any other questions or issues - just let me know. Happy to jump on a huddle sometime too. We have our first #C07LCP9PJUA session today at 10 AM US CT.

super kind...thank you

Add a reply
Sign up and join the conversation on Slack