Design system Lộ trình học từ cơ bản đến nâng cao

Recommended Resources

!
"
"
!

Find the detailed version of this roadmap
along with resources and other roadmaps

Design System Checklist
Invision Design Systems Handbook

Design System

http : // roadmap.sh

Traits of a Good Design System

What is a Design System
Why need a Design System

Stakeholders Involved

Understand the Basics

Design System Examples

Design System vs Component Library
What is Atomic Design

Component
Stakeholders Involved
From Scratch

Component Library

Making a Design System

Design Language

Terminology

From Existing Design

Governance
Guidelines
Pattern

Icons

Visual Forms

Sizing

Spaces

Existing Design Process

Color

Typography

Visual Audit

Pilot
Token
UI Kit

Identify Design Elements
Existing Design Analysis
Identify Components
Avatar

Writing Guidelines

Badges

Tone of Voice

A/B Tests and Experiments
Banners

Buttons

Terminology

Regional Requirements
Cards

Drop Downs

Documentation

...

Form Elements

Design Principles
Vision
Brand

Accessibility

Units

Functional Colors

Grid

Creating Design Language

Logo

Dark Mode

Breakpoints

Guidelines

Guidelines

Spacing

Accessibility

Monochrome Version

Layout

User Onboarding

Small Use Guidance

Microcopy Guidelines

Placement & Clearance Guidance

Colour

Usage Guidance
Defining Design Tokens

Iconography
Accessibility

Di!erent File Formats

Typography
Style

Creating Core Components

Responsiveness

Naming

Grid Relation

Grid Relation

Avatar

Input Text

Sizes

Keywords

Readability

Banner

Input Switch

Reserved Icons

Performance

Badge

Select

Guidelines

Guidelines

Button

Textarea

Card

List

Carousel

Loading Indicator

Dropdown

Modal

Icon

Tabs

Input Checkbox

Toast

Input Radio

Tooltip

Tooling

Development
Component Catalog

Design

Documentation
Design Editor
Code Style
Plugins
Unit Testing
Version Control
Accessibility Testing
Contribution Guidelines

Roadmap

Semantic Versioning

Milestones

Release Strategy
Commit Guidelines
PR Templates
Contribution Guidelines

Ticketing
Communications
Task Management
Community Meetings

Project Management
Analytics

Communication Channel
Open Hours

Component Analytics

FAQs

Error Logging
Tooling Analytics
Service and Health Metrics

Design System