Designer Zack Aronson asks an interesting question:

There are a lot of great articles about design systems, but I’m not sure I’ve seen much written about how to start one.

When SuperFriendly works with clients to create design systems, the first thing we’ll do is an audit of the existing digital landscape. Do you have a public-facing website? A native mobile app? Some microsites? An intranet?

Of all of those, what are some interface elements that all of them have? Some common answers tend to include:

• Navigation
• Buttons
• Headings
• Lists
• Paragraphs
• Forms
• Tables

It’s tempting to add everything that you think might go in a design system or should go into a design system, but try to resist that urge for now. Only include the components that already exist in all of the sites and apps. A good design system should be a collection of your organization’s best institutional knowledge.

If you don’t use buttons a lot in those products, don’t include them! Front-end designer Brad Frost is fond of saying, “A design system is the story of how your organization makes products.” If your products don’t have lots of buttons in them, including buttons as a prominent element tells the wrong story about what you do and make. This focus is key to making sure your design system remains distinct.

Zack: if I were advising your 3-person design team, I’d suggest that each of you pick a component that’s already used frequently in your products. Looking at your site, those 3 components might be:

1. Navigation
2. Primary Heading
3. Footer

Pick the best version of each of these. That might be the footer from an intranet and a navigation and footer from main website. And “best” might mean from a UI design perspective, or that the markup is top-notch, or that it’s built modularly… you decide.

Next step: put those 3 components somewhere. That could be a custom website you build, like Material Design or Polaris. But it could also be a wiki somewhere within your firewall. Or a Github repository. The important thing is that it contains:

• At least some front-end code you need to implement this component (because a Sketch library is not a design system)
• Some guidelines on how (and how not) to use this component
• A URL that you can send to someone

Congratulations on launching v1 of your design system! That’s right: v1 of a design system can just be 3 components. Heck, it can be only 1 component! If that 1 component saves you some time on your next project and makes everything that much more consistent from both a design and code standpoint, you’re experiencing the full benefits of a design system.

Join 57,400+ subscribers to the weekly Dan Mall Teaches newsletter. I promise to keep my communication light and valuable!