Design System / Storybook
Hi Im a dev in a small company that doesn't have such thing as design system.
Recently, the company decided to move to headless CMS for content managment and happened to come across Storybook and Design System.
Based on a shallow research on the internet, Storybook is a tool to make some sort of documentation page for design system and is with many features.
If you use Storybook day to day as a designer / frontend developer, can you give me a quick answer on this?
1. do you use storybook as design system?
2. is Storybook the source of truth for the frontend and the design (e.g. Figma)?
3. what does Design System mean to you as a designer / frontend dev?
Ultimately, I want to know if Storybook is what we need. That is, whether we can have it as a documentation page and make it source of truth for the product and design.
Please correct me and share some of your experience with Storybook.
1 Reply
I've experimented a bit with Storybook and design systems for a personal project.
What I've found is that it is not worth the effort to set up a whole design system if you're only working on small projects. Now, if you want to eventually scale, and reuse a lot of components between projects, then I'd say the investment in time spent setting up both the design system and Storybook could be worth it.
For your design system to actually mean anything, you need your team to follow it. You need a system in place that allows modifications, removals, and additions into the design system. Maybe the team lead (but generally, from my understanding there would be a whole separate team in a larger company dedicated to this role in the design system). Any questions about the design system would also go to this team.
Storybook isn't a design system. It's just a part of the design system. It's where you store your components (component library). I believe there are also plugins that allow you to store your design tokens as well (colors, font sizes, etc). A design system is composed of many things such as the branding, the tone/voice of the brand, content guidelines, illustrations, etc. More can be found here: https://blog.hubspot.com/website/design-system.
Storybook wouldn't be the source of truth. The design system would. Your developers and designers would have to actively manage and maintain the design system for it to be worth anything. Design systems can be a powerful tool that allows designers and developers to properly represent a brand.
As you can see, a design system is a lot of work, and it's probably not worth it for a small company to use one unless, again, you guys are willing to actively maintain it and reuse it across many projects.