Need Help Understanding Relume to Figma to Webflow Workflow? | Relume Community

Need Help Understanding Relume to Figma to Webflow Workflow?

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.

26 comments

Matt J.
·
Samuel F. 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
Samuel F.
·
Thanks Matt J. 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?
Samuel F.
·
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?
Samuel F.
·
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
Matt J.
·
Samuel F. 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?
Samuel F.
·
Thanks for this, and yes that confirms my thoughts. Yes I am Webflow savvy, fairly well.
Matt J.
·
okay good - so this wasn't that devastating of an answer
Samuel F.
·
Im just questioning if its actually easier to just do the final design using Webflows official plugin
Matt J.
·
ah yeah it wont produce the results you'd expect - the "Figma to Webflow" plugin developed by Webflow Labs?
Samuel F.
·
Yeah
Matt J.
·
it generates a very broken result
Samuel F.
·
interesting
Matt J.
·
and this is actually because of the framework we use - Client-First
Matt J.
·
that plugin just generates its own code
Samuel F.
·
gotcha
Samuel F.
·
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?
Matt J.
·
Samuel F. 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.
Samuel F.
·
Yep, gotcha
Matt J.
·
and I actually really love building bespoke components in Webflow
Matt J.
·
but love efficiency more
Samuel F.
·
Yeah im with you
Samuel F.
·
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
Matt J.
·
for sure
Samuel F.
·
appreciate your time
Matt J.
·
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 🔒[private feed] session today at 10 AM US CT.
Samuel F.
·
super kind...thank you