Hi everyone,
I have a newbie question relating to figma libraries/design systems.
Our website is built on Webflow using Relume.
We've got a designer to build our UI, but I'd like to set up a proper design system moving forward as we're loosing a lot of time and I'd like everything to be consistent and easier to make.
How should I go about it?
Right now I customized the library from Untitled UI in Figma, and published it. But I'd ideally want this to work right off the bat with the Relume LIbrary Updates.
How do I go about building something that I won't have to rebuild everytime the library updates - do I just have to accept that nothing will sync?
basically how I would approach this is start with the Relume Figma Pro Kit and I would customize the existing UI that is in that style guide to your liking.
I would then extend that style guide to include any additional UI components, patterns, variables, etc.
So now, when you go to build, in webflow you clone the Relume Webflow Style Guide and start pasting in components from Relume, you are already at least 75% there. And then from that point you are adding in your additional components from Figma, to Webflow.
Once you have your design system matching one to one from Figma to Webflow, its just a matter of pasting in Relume components to match the layouts, and adding in your additional components or content that were custom made. Hopefully this makes sense...
Ultimately, as nice as Untitled UI is - if your end deliverable is a webflow built website, I would at least start with the Relume style guide.
It might be possible to at least start with the Relume Style Guide, and bring Untitled UI as a library - style both style guides to match, and then you have a hybrid - but you'd still have to build out any of the Untitled UI components in Webflow manually because the sample library that exists is really only that - a sample - its no the full Untitled UI library and its also not following the same naming conventions as the main Relume Library.
So your only benefit from using Untitled UI in my opinion, is what it was originally intended for which is a Figma kit/design system - not a shortcut in Webflow.