Relume
Log in

Community forum for knowledge and support

Updated 10 months ago

New to Webflow, Figma and Relume and I Have a Question About Workflow

At a glance

The community member is new to Webflow, Figma, and Relume, and has a question about the industry standard workflow. They are unsure whether to go from Relume wireframes to Figma and then to Webflow, or directly from Relume to Webflow. Another community member provided a detailed walkthrough of their Relume to Figma to Webflow workflow, including steps like cloning Relume and Webflow starter projects, importing wireframes, updating style guides, and transferring the final site to the client's Webflow workspace. The reasoning behind the private tab sign-up and guest invitation process for the client's Webflow workspace was also explained.

Useful resources
DDaniel Hughes
·

New to webflow, figma and relume and I have a question about workflow. What is the industry standard or what are the pros and cons of using Relume? Specifically, after I get my wireframes do I export to Figma and use time (bill clients) and then from figma to webflow? Or do I go from relume wireframes and export to webflow? As someone new to this process I see lots of resources like FIGMA TO WEBFLOW videos and relume has a relume>webflow but they also have relume >figma. So the way I see it that I need to learn is either relume>webflow or relume>figme>webflow. Thanks for your time.

1
M
D
B
8 comments
MMatt Johnson

I did a full walkthrough of how I work with the site builder tool. and how it translates to figma and back to webflow - its an hour or so long...rough draft. It might give you some insights
https://relume.notion.site/Using-the-Relume-Site-Builder-Full-Walk-Through-409e549d44594f0986c7b3453d93a5e4?pvs=4

DDaniel Hughes

thanks so much

--

BBlair

Hey Daniel, this isn't very clear to most people TBH 😊

Relume

  • Sitemap
  • Wireframes
  • Get layout and content finalised

Figma
  • Clone Relume starter project
  • Install Relume plugin
  • Import site map and wireframes
  • Update style guide page in Figma with fonts, colours etc
  • Add logo and images to wireframes
  • Modify components by detaching and recreating to enable faster styling of wireframe.
  • Get design approved
  • Export assets (images)

Chrome
  • Install Relume extension

Relume
  • Clone Webflow starter project (style guide)

Webflow
  • Install Relume app
  • Site settings / Fonts
  • Import wireframes (or copy and paste components from Relume)
  • Make sure page structure is:
  • Body
  • Component
  • Navbar
  • Main
  • Sections (components)
  • Footer
  • Update style guide page (fonts, colours...)
  • Get approved

Webflow (to create account on behalf of your client)
  • In private tab, sign up for webflow with your email (name+client@domain.com)
  • Invite yourself to workspace as a guest (requires Freelancer workspace plan)
  • Accept invite via email
  • In your workspace transfer final site to client workspace you just set up
  • Accept transfer via email
  • Change workspace account email to client's email
  • Get client to add a paid site plan to the site you transferred (requires their credit card)
  • Update other site settings, e.g SEO

Publish site from client's workspace.

Done ✅

JJack Glacken

this is an excellent resource! Can you explain the reasoning behind the process with the private tab:

  • In private tab, sign up for webflow with your email (name+client@domain.com)
  • Invite yourself to workspace as a guest (requires Freelancer workspace plan)

This side of managing client projects is kinda hard to find content on!

BBlair

Sure, the goal is to have a client who is new to Webflow set up with a new WF account (workspace) and for you to be a guest and for the site to be transferred to their workspace.

I tried explaining all this to a client and we got there in the end, but it is easier if you just do it all for them and then change the WF account email to their email and it's all done. Plus you're a guest so can do whatever you need.

They just need to add the site plan with their credit card.

JJack Glacken

Very nice... That's really useful 🙏

BBlair

I got that tip from 🙌

JJack Glacken

Matt knows a few tricks alright!

Add a reply
Sign up and join the conversation on Slack