π Design System
μ°λ² λμμΈ νλ«νΌ
Airbnbμ λμμΈμμ€ν
State of Design Systems 2019
Fluent Design System
toss, design, system
The full stack design system
λμμΈ μμ€ν 7νΈ - μ»΄ν¬λνΈλ₯Ό λμμΈν λ κ³ λ €ν΄μΌ ν κ²λ€
WEB DESIGN STYLE GUIDE
λμμΈ μμ€ν μ€κ³ κ°μ΄λ
β π
- Audit existing components - κΈ°μ‘΄μ μ¬μ©νλ μ»΄ν¬λνΈλ₯Ό λ¨Όμ νμΈ
- Research on other design systems - λ€λ₯Έ λμμΈμμ€ν μ¬λ‘λ₯Ό κ²μ
- List out components - μ»΄ν¬λνΈλ₯Ό 리μ€νΈλ‘ μ 리
- Plan a timeline - νμ΄ν¬,컬λ¬,λ μ΄μμμ μ 리νκΈ° μ μ κΈ°λ³Έ κΈ°λ₯μ λκ° μμ ν κ±΄μ§ νμλΌμΈμΌλ‘ μ 리
- Research and discuss components - μ»΄ν¬λνΈλ₯Ό μ‘°μ¬νκ³ ν λ‘ νλ κ³Όμ μ λ¬Έμμ κΈ°λ‘ (μ¬μ©μ¬λ‘, λͺ¨λ²μ¬λ‘, νμ¬μ μ»΄ν¬λνΈ νμ©)
- Create design symbols - μ€νμΌκ°μ΄λ μ μ (ν μ€νΈ, λ μ΄μ΄μ€νμΌ λΌμ΄λΈλ¬λ¦¬,UI λμμΈν€νΈ λͺ λͺ κ·μΉ μ 리(ν¬κΈ°, 무κ², μμ, μ λ ¬ λ° μ λμ΄) )
- βDesignβ design system - λμμΈμμ€ν μ Zeroheightλ₯Ό μ¬μ©νμ¬ λμμΈκ³Ό μ½κ² λκΈ°ν κ°λ₯
- Implement design system - λμμΈμμ€ν μ ꡬννλ €λ©΄ κ΄λ ¨ μ΄ν΄κ΄κ³μμμ μν΅μ΄ μ€μ