Skip to content

Latest commit

 

History

History
36 lines (23 loc) · 2.3 KB

step0.md

File metadata and controls

36 lines (23 loc) · 2.3 KB

This is the guide for anyone who wants to start building or designing a Design System. The below is the Step 0- which means it is pre coding and designing of design system.

1. Audit

If you are not sure of the product or design decisions then the first step should be to meet the products and project teams. Have a look at the existing proxuct's UX, UI, tech-stack, pain areas etc. Make notes from every product and try to look for common components, patterns, colors etc.

2. Survey

If meeting the team is not possible , then do the internal survey. Ask about the what kind of design system they would like to use? What makes them to use a design system? etc.

These 2 steps going to help you to understand about your organization's current product/projects current situation on the UX, UI, Design system etc. Most importantly to make them aware of design system and why it is important.

Once you have the list of the common components, patterns, etc. Now, is the time to UX team to look into the defining the scope. Remember you cannot have every component in the Design system. Why? because reason of design system to have 'reusable' components. The reusable components should be used by more than atleast 2 products. Otherwise every product/project will keep pushing their work on design system team as well as extra components will make the design system heavier.

3. Scope

Defining the scope of the DS is very important from the UX and UI. You should decide what all your DS should have from UX - styleguide, color palattes, design files, design specs, responsive, breakpoints , Dos and Don'ts, which all components etc. From UI, think about the tech stack, repos, architecture etc.

4. Tech stack

For developers this is the most important decision to make. If your company is using only 1 lib/framework then there is no decision to make. Otherwise do a good research of the industry and make list of the available options and their pros and cons. Few things which will help in making decisoions are:

  • Community support
  • Learning curve
  • Stable version
  • Team skills

Summary:

  1. Met your product/project teams and got the insight of the UX, UI etc.
  2. Have the scope of the DS : what all we are going to have from UX and UI.
  3. List of all components to be in the DS
  4. Tech Stack for the development