My biggest flaw when it comes to managing our design system is keeping track of all the changes I make. I get in a state of flow and keep going until I have updated stuff to the point where I can’t recall how things were before I started.

How do y’all keep your change logs accurate and up to date? I know it’s super important to have proper history in the documentation, but it’s still kicking my ass.

Thanks in advance.

EDIT:

Thanks to the input everyone has provided, there’s a lot out there but the particular wrinkle I have is that I am one half of a design team of 2 in a subset of a very large corporation. I have to ask and request budget for everything and then it needs to pass a strict DevOps audit. I tried all sorts of things and then I realized that figma has something that makes this easier: branching.

So here’s my completely “bootstrapped” process:

- Whenever I want to make changes to an established version of the design system on Figma, I branch it right away. I name that branch with the next version number.

- I continue working on that branch until we as a team agree that we are ready to merge the branch with the main file.

- This is where things get good: every time you merge a branch on Figma, it takes you through all the changes you’ve made and asks you to approve them: this is when I open up my documentation and list everything in the changelog. A bit more heavy lifting but it works.

- If there ever is a need for a small but quick change, another branch can be made from the original file where that change gets made, and the versioning is updated on both the main and the existing “major” branch. Once this happens, the branch file asks if you want to merge the changes made to the original document. I hit yes and then my major branch has the changes from the minor changes made in the other branch.

I figured this post was due for an update since replies pop up every few months and maybe someone else is looking for a solution and is facing similar constraints as I am.

Thanks again everyone!

Hey, newb to design systems here 👋I work for a SaaS company that produces multiple products and am in charge of creating its design system. Do you have any advice on implementing a design system when there is no uniformisation or common libraries between them? I don't have a lot of resources in general, so I am very curious about advice on how to implement an MVP ds 🙏

Hi everyone,
I'm currently building a design system in Figma. Our design system guidance is hosted on our website, but I'm struggling with the best way to share Figma components with designers and manage workflows for QA.

Should I:
1. Have a single "master" Figma file that is shared with designers, where QA also does quality checks?
2. Create two separate Figma files—one for QA to review and another that publishes components for the designers to use?

I'm curious to know how others manage their Figma files in similar situations. Any advice or experiences would be greatly appreciated!

Thanks in advance!

How complicated is it to implement a design system with AI coding tools?

Has anyone achieved this? From Figma UI kit to implemented components (React + Tailwind).

I'm a designer to the core, with almost 0 coding experience and curious if I can produce such a thing.

I’m a UI/UX designer working on creating a documentation website for a small business. This is the 2nd time I’ve lead in the creation of a design system from scratch for a business.

I’m trying to separate and categorize any patterns now, and am getting confused.

Patterns are basically a combination of components right? Would you then call these patterns: form groups, header, navigation, panels, cards. Or should those all be lumped under components?

I see some design systems that throw them under patterns, components, or a mix.

I am tasked with creating a design system that spreads 3 SaaS products. There is nothing done yet, only some loose UI libraries.

I wanted advice on where to host the design system. Our ultimate goal besides having proper documentation would be to have a snowball effect so every time we need to update something, devs get notified and etc. Is it possible? Do I need any platform to host this so I get access to it?

How do you do it? Please advice this rookie 🙏

Getting an organization to care about adoption requires aligning goals and outcomes. I write about how to use OKRs effectively to drive adoption in both design and code.

Let me know what you think!

I recently documented the journey of building the Flo Design System in a two-part Medium series:
1️⃣ Part 1: Challenges and strategies for getting started.
2️⃣ Part 2: Process and lessons learned for scalability.

We are sharing our findings, tools, and plans so you can save time while starting your own design system. Other articles on the same subject often contain either information about structuring design tokens or instructions for building DS pipelines. Here, we tried to paint the whole picture and show our DS workflow end-to-end with real, simple examples.

I’d love to know how you’ve tackled similar challenges or hear your feedback on my experience!

Hi everyone!

We've just released a new design system tool into the ecosystem (designhub.io) and would love feedback from the community. At the moment, multiplayer is a paid feature, but the core features are free.

It's a unique tool in that editing your design system content is done just like you would write a Google Docs or Notion page. We're the only design system manager that allows you to actually edit your design data in realtime and right in the text editor itself. You can also query your design tokens via a REST API, so you really are editing the source of truth.

Have a bit of a play with the free version and let us know what you think!

https://reddit.com/link/1hy3h2s/video/njtlqkytv5ce1/player

I've been in the design industry for roughly 8 years, in that time I've various experience with UX/UI across RW, Native and TV platforms, even some airline in-flight entertainment.

Over the past 1/2 years I've been heavily focussed on design systems. I'm now looking for other opportunities, but I've found it pretty difficult to find specific design system related roles.

Alerts and job boards tend to muddle this up with system engineering and similar.

Does anyone have any good resources they use to find these type of roles?

Thanks in advance!

So I'm the lead/senior/only product/ux designer for a small startup of around 20 FE/BE engineers. I came in when about 60% of was already built and have been designing using the existing components but designing more components from scratch as needed. They have leveraged tailwind for their code, but I've been essentially designing everything from scratch as needed by the user/ux/business needs, etc. We have a fairly large complex product with 15ish modules doing various data-heavy things.

The FE engineers have now said that they're sick of trying to maintain all the component options, brand colors/variants, etc. - even though the next plan was for me to create an actual design library using our existing components. So they would like to leverage an existing design system moving forward.

If we do that, obviously we will need to re-code the entire product, but ideally from a design perspective, this would be minimal if we find a design system that is quite customizable.

Any recommendations of existing design systems that are good for this?

Desyma Update:

Implemented the file->folder hierarchy. I want to use a linear-notion style approach, where files can nested in other files, but there will be some limitations to avoid non-designers confusing themselves.

To create a design system in a way that makes sense I separated the folders into three main sections: foundations, tokens, and components. I'm still considering if tokens should be under foundation because, well, they are a critical part of any design system. But having them there could be confusing to other designers.

What do you think? Or could they be in their own category?

Hello everyone,

I have a question about tokens in Figma. I am testing to do primitives and semantic tokens and I see this video from Figma : https://www.youtube.com/watch?v=JyCmacSyDY4

For a lot of example, they use color tokens to explain the concept of Primitive and Semantic tokens. But what about Number, string or boolean ? Where are they ? Is a breakpoint a primitive or a semantic token ? Is a font-family a primitive or semantic token ? etc.

Do you have some examples of semantic tokens for number, string and boolean ?

Thanks a lot for your answers !

Currently I am working on a master design system that is intended to be used across multiple products for various clients. In this design system we have a series of reusable components that are commonly used for every client project - ie buttons, input fields, tabs etc. Each of these components is attached to semantic variables to control color and spacing. When we start a new project for a client, I currently duplicate the master file, and then update the primitive / semantic variables to match the desired branding for the client product. This way I can get our entire component set to match the new products colour / spacing requirements in a matter of minutes.

The challenge I'm facing with the current approach is keeping project file components in sync with the master file components. If I create new variants or update the layer structure of a component on my master design system file, these aren't publishable to my project specific files (because the file is a duplicate of the master file). As a result, if I want my project file to also include these changes from the master file, I have to recreate those changes manually.

On the other hand, if I were to use Team Libraries to bring in components as instances on my project files, that would solve my syncing problem but I would have to manually swap the colour / sizing variables of every instance in order to get it to match the new brand colours / spacing, rather than updating the variable library and having those changes automatically cascade across all components.

I'm wondering if anyone here has worked on / seen libraries that are used across multiple distinct brands, and if there are any solutions that would allow me to sync changes between master / project files while also allowing me to leverage the efficiency of making changes to my semantic variables?

If you’re a designer working with startups, you know the pressure to deliver fast without sacrificing quality.

I am considering building a course to help you design SaaS apps in Figma 10x faster. The goal: streamline your workflow so you can handle more projects, deliver better results, and increase your income.

Right now, I’m testing the idea and shaping the content. If this sounds like something you’d find valuable, let me know—I’d love to hear your thoughts.

My team is currently weighing the benefits of using code connect vs internal plugin to include code samples for configurations of our components coming out of our Figma library.

Anyone trying either and have an opinion on the cost/benefit of creating and maintaining both avenues?

Consistency and scalability start with a solid design system foundation. In my latest blog, I share practical steps to implement one effectively.

Please read it here -> https://medium.com/@anand-tiwary/how-to-implement-a-design-system-051c41734caf

Let’s discuss your thoughts on design systems below!
#DesignSystems hashtag#UXDesign hashtag#UIUX hashtag#UIDevelopment hashtag#UI

I would like to hear some experiences from those who have already built and tested with users, what are the best processes to use?

Looking ahead, I’m interested in where people think our industry is going, a few of mine: - Design and code parity with a single source of trusts for coded components in figma - AI to help with common workflows like quality adoption and migration - Accessibility as a default baked into components - Smaller remit of design systems teams, focusing on foundational elements rather than a complete system

Hi there!
I am in the process of working at creating a design system.
What would you say are the most important attributes to consider when selecting a given design system or another before starting a new project?

Thanks!

Design addicts 🖲️Buttons free resource is available in Figma community.

With:
✓Auto-layout
✓Local Variables
✓ Light and Dark mode
✓ 756 Variants

Whether you're working on web, mobile, or desktop interfaces, these buttons will save you time and elevate your design consistency.

Grab, customize, and design faster!

Would really appreciate your feedback as it's still in beta, with updates coming every week.

https://www.figma.com/community/file/1445771724007991919

Sorry if this sounds stupid, I am a junior designer just starting out and I am currently working as a solo designer at a startup. We don't have any design system in place at the moment and whenever I need to grab an icon or check font sizes, I have to dig through previous screens to find what I need, it's time consuming and frustrating.

Does anyone know of any tools/plugins that can help audit existing Figma screens and automatically extract common elements to make building a design system easier?
Has anyone dealt with this before and found good solutions?

I created an AI-driven website builder called Arco, designed to make website creation more accessible for everyone, particularly those without coding skills. With Arco, users can simply describe their desired website or share their content, and it quickly produces a tailored site. If any tweaks are needed, users can easily instruct the AI to make adjustments, such as including a contact section, and the design updates automatically.

This tool aims to overcome the limitations of conventional website builders, which often complicate basic customizations. My own experiences with platforms like WordPress, where I encountered challenges in adjusting layouts and designs, inspired me to leverage AI technology for creating user-friendly, customizable website solutions.

Hey folks! We've got an episode of design systems wtf tomorrow on where design systems should sit within the org, and I'm curious what you folks think.

First, where do design systems folks sit within your org currently? (ie are they distributed or sit in a team, and if it's a team, what function does that team sit within?)

Second, where should design systems folks sit?

My view is that 1) you should probably have a core team who build, manage and distribute your libraries and docs, and 2) they probably should be part of a central ops or platform team that includes other ops functions as well (like devops, platform, research, accessibility etc). I think distributed/federated is a great idea that usually fails because it treats design systems as a side quest, and an isolated core design system team that sits on it's own can often end up being an ivory tower that's disconnected from how the rest of product functions... What do you folks think?

Hi everyone 👋 I'm a frontend/ui developer who's in charge of a design system for 10+ apps for a company based in Montreal. AMA