Creating a Design System: The Online Guide

A step-by-step guide based on our own case study

Earlier this year, our CEO Marcin Treder wrote a series of posts describing his work in helping to build UXPin’s internal design system.

We wanted to condense his experience into a simple step-by-step guide. A quick reference for anyone about to embark on or already in the middle of their design systems process.

Image for post
Image for post
Design systems help operationalize design, freeing up product teams to focus on the real business and user problems.

We’re very proud to introduce our open online guide to building a design system. Our goal was to make the guide as thorough and technical as possible based on lessons we’ve learned the hard way in our journey so far:

  1. Create the UI Inventory for the Design System
  2. Get Organizational Buy-In for the Design System
  3. Build a Multidisciplinary Design Systems Team
  4. Establish Rules and Principles for the Design System
  5. Build the Color Palette for the Design System
  6. Build the Typographic Scale for the Design System
  7. Implement an Icons Library for the Design System
  8. Standardize Other Style Properties
  9. Build the First Design System Pattern
  10. Run a Sprint Retrospective
  11. Conclusion
  12. Recommended Resources

We hope this will help product teams get a head start on scaling design consistency and efficiency.

If you’ve worked on a design system yourself, we’d love to hear your thoughts.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store