# Design System

## Design System Features
- Layout
- Color
- Typography
- Components
- Theming
- Design source file
- Mobile guideline
- Icons/Images/Spacing
- Data Visualization

## Design Tokens
Design tokens are all values that are needed to construct and maintain a design system

**Like**- Color, Typography, spacing. Ex- primary-color, econdary-color, cta-bg-color.

These values are used in place of hard-coded values in order to provide flexibility, and symmetry across all products


## Best Practices while Creating a Design System
- Keep scalability in mind
- Focus on reusability of components
- Efficient communication across teams/stakeholders
- Keep it simple
- Put smart documentation
- Create a proper roadmap
- Do proper versioning
- Proper testing of all features
- Make it adaptable maintainable and testable
- Make it contextual- demonstrating, context will include showing screenshots/videos of component
- Keep an issue tracker tool like Jira for BUG reporting
- Set rules on how someone can contribute
- post rollout follow-up with user and client
- Setup a feedback collection tool


## Design System Success Metrics

**Adoption Metrics**
Are teams aware of using and engaging with the design system?

**1.1** Number of queries around using/engaging with system design per week. Fewer queries indicate good adoption metrics.

**1.2** Percentage of products of a company are built with a design system. A low number will indicate bad adoption metrics.


**Outcome Metrics-**
Are we successfully achieving the goals that we had set with the design system?

**Ex**- How much time will require for a module to get delivered with and without the design system.

Less time with the design system will indicate good outcome metrics.




Thanks, Happy Learning👏👏👏👏 …