Design System

Design System is a collection of reusable ComponentsComponents
Components are portions of reusable code within your system and they serve as the building blocks of your application’s interface.

Source :

Book- Design Systems Handbook

#🌱def / §Design
, build using AtomicAtomic

Atoms are the smallest, building block material in Design System, that can’t be broken down any further without breaking the functionality.
In Zettelkasten method, it recommends building atomic content (single concept, independent, that can grow later)
In database systems ACID (Atomicity, Consistency, Isolation, Durability) talks about the same. Here, atomic transaction reference to indivisible and irreducible operation.

and Sub-atomic Design TokensDesign Tokens
Design tokens are the “subatomic” foundation of a Design System implementation. They are the values needed to build a design system, like color, space, typography etc., represented as data.

Design token types

Global tokens

Global tokens values, represented by context-agnostic names.
Eg : Hex value represented as Gray-100

Alias tokens
Alias tokens relate to a specific context, making purpose/context easier to identify.

Eg : Gray-100 represented as bg-co...
particles that follow the guideline, behave consistently, and together work as the building block of the product.

A design system is not a pattern library or a sticker sheet. Atoms being consistent or similar in a design system won't make the final result compatible. For that, it requires a clear documented guideline on behavior and usage patterns. Usage patterns, organisms and templates makes system scalable Design is ScalingDesign is Scaling
§Design is not just about visual aesthetics. One reason businesses invest in design is that it defines product, builds consistency, reduces learning curve, thus attracts and retains customers, and reduces support costs.

Source :

Book- Design Systems Handbook
To Write : Essay- Explaining the Obvious

#🌱opinion / §Design

Design system is like Lego, but does come with some, themes and rules. The combinations are not endless.

Consider the design system as the single source of truth which groups all the elements that will allow the teams to design, realize and develop a product.

Start with Scorecards to Pilot Design System MigrationScorecards to Pilot Design System Migration

Do Interface Inventory, and find the frequency of usage of common components. Apply Pareto Principle

It is better to start with a pilot project, instead of doing for the entire project.

Sweet Spot

Potential for reusable components/patterns.
Components with High-Business value.
How easy is to build them. Time frame
Inspire someone, make them design system evangelist
Marketing potential.
Can be decoupled and built / don't break.

instead of over planning and under achieving.

Sources :

#🌲topic / §Design