A Design System is the complete set of design standards, documentation, and principles along with the toolkit (UI patterns and code components) to achieve those standards.
Benefits of a Design System
Provide a cohesive look and feel, making it easier to understand and navigate the site.
For the company: defining visual and interactive aspects of components enables standardization, and minimizes code discrepancies.
This reduces up-front work (and development time/ effort) and ensures scalability in a faster, more consistent manner.
Stakeholders Consulted
Product, Design, Marketing, Engineers
Results
This allowed us to create code snippets for engineers to ensure we’re using the same components everywhere (and to reduce new/ different variations).
Example Design Systems