Build a Design System in Figma

Design Systems are all rage right now because they offer the ability to design products in a very consistent and efficient way ats scale. I am just in the beginning phases of building out my design system for work and we chose to build it in Figma.

Figma is a great place to start for building a design system but eventually, I will want to convert it over to a forward-facing website with code snippets and documentation as well.

------------------------------------------------------------------------------------

////////// Want to support my content and get extra goodies? Become a member and get perks like member-only content, behind the scenes, design files, and more...

////////// Connect with me here 👍🏼

////////// Sign up for my Monthly Newsletter 📫

////////// Music is from Musicbed click below for a free trial 👇🏼

////////// Equipment 📸

[JesseShowalter]

What do you think about using Figma for your Design System?

[felipefelixsantos]

I Just had a Meetup about Design Systems!
It's a great way to organize the design Pattern of aplications and interfaces. And figma is a great tool as well 😁

Thanks for the vídeo!👏👏👏

[docrock]

This is useful, so easy to understand and very simple explanation. Also your personality and attitude about design is inspiring! Thank you so much Jesse!

[johnnygarces]

this could be the first video in a design systems series with a focus on figma. I got a lot of this video, would be great to implement some components together in a future video. Thanks for all that you do!

[ibanezrg]

This got me excited to move into Figma. Sketch has been irritating lately, and I'm excited to try something new.

[sidehustlediscovery]

Enjoying binge-watching all your videos - Thank you for taking the time to not only share some of the best "how-to" content teaching design - that's online today, but you do so well teaching us! Top-quality production to present the content, too!

[Ozeki_Negima]

This is a GREAT video Jesse. I'm seriously studying UX as a career change and FIgma has smitten me as my tool of choice. Thanks for the great advice on building a design system!

[TerminatorFiles]

This is the first Design System I have seen which seems super logic! Thanks for this great short and to the point video... and nice to have an inside look at how others do stuff. I'll have some work upcoming now, designing my own system for several companies ;).

[renegado]

This is the video that I didn't know I needed. Thanks a lot Jesse!

[stevenranc]

Hey, your tutorials learned me a lot. Very clear, concise and useful. Thanks! 🙏

[toyoubaldo]

Jesse came into this vid with so much hype. I'm ready to CLICK THIS MOUSE.

[RockyRoark]

Haha great video! I love how you have the Adobe Illustrator sticker I created on you laptop! (:

[DayoSamuelMastery]

Hey Jesse,
If you were to do a design system today, with benefit of new updates and new learnings, how would you approach it?

[chrismilne]

Great video - essentially it is like setting up a brand guideline within Figma. Exciting idea!

[vidhyagangula]

Hey Jesse, Will you do a step by step video on how to design this system becoz that's wonderful design system with as minimum as possible components!

[sangy]

Great Information! Thank you. small suggestion- Your thumbnail Video at Right Bottom is overlapping on the Inspector area & it's hard to see what actions you are doing there, I will be helpful if you manage to show the area when you are doing actions there. that's it. Thanks again for bringing another awesome video. Cheers :)

[wasifhafeez]

I really liked it and I was waiting for the typography fonts. hope you make one

[weronikapawelec]

Hey Jesse, great video! How much time did it take you to set up this design system? And do you struggle with perfectionistic thoughts when creating things? If yes, how do you manage them?

[JanusHasseriis]

Do you know the tool Storybook?

The idea is to build and work with your design system directly in code.
It's super cool from a developer perspective because it documents your components and allows you to see variations interact with the component in isolation.

It's also super easy to deploy to a URL of your choice.

[bsewall]

Thanks, Jesse! A design system is definitely on my todo list and this has given me some inspiration to get that going.

Have you thought about making a Sketch vs Figma vs XD video? I'm a Sketch user, but have good things about the other apps as well.