We use Figma’s API to create your site, this requires a fair bit of complexity under the hood. If your library has lots of components and variants or lots of people are building libraries at the same time, it can take a while — around 5 to 15 mins and occasionally longer. We’ll email you as soon as it’s done, and we’re constantly working on improving the speed and stability of the builds.
FigMayo will map to how your Figma file is structured. Styles are split out into separate pages and will group as per your nesting. Any page in Figma that contains a published component will be turned into a page on FigMayo. This means that if all your components are on a single Figma page, they will all display on a single page on FigMayo. We’d generally follow Figma’s recommendation (especially as you scale your design system) and add components to different pages. This will make your library easier to browse and increase the discoverability of components. We like to divide our pages into sections that contain related components. So we have a “forms” page that has our inputs, checkboxes, radio buttons etc.
Multi file setup
One of the main benefits of FigMayo is the ability to combine multiple Figma libraries into a single site. This reduces the amount of components in a single library and makes large design systems more manageable. Our setup has a “Foundations” library for our core styles, “Icons” for, well, icons (it definitely makes sense to have icons as a separate library especially if you have hundreds of them. These can often make publishing a lot slower), “Components” for our simple components and “Organisms” for more complex components. We might add another file for “templates” when we have full screens/blocks firmed up.This loosely follows Brad Frost’s atomic design principles, but can be adapted to suit the size and complexity of your design system.
Multi site setup
We support the option to create multiple design system sites that contain multiple libraries. This is ideal if you’re an agency with multiple clients that need documentation or have different ‘sub-brands’/’verticals’, that need to be separated out. We can brand each site separately if needed.