Design Systems are increasingly becoming a staple of the modern design process. Unfortunately, there isn't a standard definition of what a design system even is. Thankfully that is starting to change as the process gets fleshed out in the industry. In this multi-part article, I am going to be talking about what a design system is, the different aspects of what it entails, and how you can integrate it in your flow.
What is a Design System?
A design system is a group of patterns and principles that help organize and give purpose to a digital product.
Patterns
Patterns in a design system are the physical (or rather digital) objects that are created to create an interface. Examples can include buttons, text fields, icons, colors, typography and other similar objects. Most of these objects should go off of the same style to make sure that they work together in various situations.
Principles
Design principles define how we create and use those patterns. This is especially helpful when working in a team. Having clear principles guides and directs the vision and direction when making reusable patterns.
"It is one system. The principles are there to connect the dots."
Jurgen Spangl - Atlassian
Defining these principles gives a team or project a shared purpose. In the end, these principles will result in a better system overall that will stay consistent.
Atlassian has a great example of their principles. They clearly outline their purpose and goal that drives their design decisions.
Looking Forward
This is just the first part in a multiple part series looking at Design Systems. In future articles we will go more in depth about principles and different type of patterns. Applying a design system to your project will help with design language and increase efficiency.