From 91a39fa94a13bf73f4fd8480a81012e8aede1d40 Mon Sep 17 00:00:00 2001 From: Antigravity Agent Date: Sun, 26 Apr 2026 21:34:11 +0900 Subject: [PATCH] chore: Delete processed raw file (Design Systems) --- 00_Raw/Design Systems.md | 17 ----------- .../AI/Scalable-Design-System-Governance.md | 29 +++++++++++++++++++ 2 files changed, 29 insertions(+), 17 deletions(-) delete mode 100644 00_Raw/Design Systems.md create mode 100644 10_Wiki/Topics/AI/Scalable-Design-System-Governance.md diff --git a/00_Raw/Design Systems.md b/00_Raw/Design Systems.md deleted file mode 100644 index 2531b2c8..00000000 --- a/00_Raw/Design Systems.md +++ /dev/null @@ -1,17 +0,0 @@ -# [[Design Systems]] - -## πŸ“Œ Brief Summary -λ””μžμΈ μ‹œμŠ€ν…œμ€ μ• ν”Œλ¦¬μΌ€μ΄μ…˜μ˜ 일관성 μžˆλŠ” UIλ₯Ό κ΅¬μΆ•ν•˜κ³  μ»΄ν¬λ„ŒνŠΈμ˜ μž¬μ‚¬μš©μ„±μ„ μ΄‰μ§„ν•˜κΈ° μœ„ν•΄ ν™œμš©λ˜λŠ” μ²΄κ³„μž…λ‹ˆλ‹€ [1, 2]. 주둜 μ•„ν† λ―Ή λ””μžμΈ(Atomic Design) λͺ¨λΈκ³Ό κ²°ν•©ν•˜μ—¬ λ””μžμ΄λ„ˆμ™€ 개발자 κ°„μ˜ 곡유된 μ–΄νœ˜λ₯Ό ν™•λ¦½ν•˜λŠ” 데 νƒμ›”ν•œ 역할을 ν•©λ‹ˆλ‹€ [1]. κ·ΈλŸ¬λ‚˜ λ””μžμΈ μ‹œμŠ€ν…œ μžμ²΄λŠ” λΉ„μ¦ˆλ‹ˆμŠ€ λ‘œμ§μ΄λ‚˜ μ• ν”Œλ¦¬μΌ€μ΄μ…˜ μƒνƒœ(state)λ₯Ό κ΄€λ¦¬ν•˜λŠ” 방법을 κ·œμ •ν•˜μ§€ μ•ŠκΈ° λ•Œλ¬Έμ—, λŒ€κ·œλͺ¨ ν”„λ‘œμ νŠΈμ—μ„œλŠ” 이λ₯Ό 보완할 λ³„λ„μ˜ ν”„λ‘ νŠΈμ—”λ“œ μ•„ν‚€ν…μ²˜ 방법둠이 ν•¨κ»˜ μš”κ΅¬λ©λ‹ˆλ‹€ [1, 2]. - -## πŸ“– Core Content -* **μ•„ν† λ―Ή λ””μžμΈ(Atomic Design)과의 κ²°ν•©:** λ””μžμΈ μ‹œμŠ€ν…œμ„ 일관성 있게 κ΅¬μΆ•ν•˜κΈ° μœ„ν•œ μœ μš©ν•œ λ©˜νƒˆ λͺ¨λΈλ‘œ μ•„ν† λ―Ή λ””μžμΈμ΄ 주둜 μ‚¬μš©λ©λ‹ˆλ‹€ [1]. μ΄λŠ” μΈν„°νŽ˜μ΄μŠ€λ₯Ό κ°€μž₯ μž‘μ€ μ›μž(atoms) μš”μ†ŒλΆ€ν„° λΆ„μž, 유기체, ν…œν”Œλ¦Ώ, νŽ˜μ΄μ§€ λ“± λ³΅μž‘ν•œ ꡬ쑰둜 상ν–₯μ‹μœΌλ‘œ κ΅¬μΆ•ν•˜μ—¬ μž¬μ‚¬μš© κ°€λŠ₯ν•œ UI 라이브러리λ₯Ό λ§Œλ“œλŠ”λ° κ°•λ ₯ν•œ μ„±λŠ₯을 λ°œνœ˜ν•©λ‹ˆλ‹€ [2]. -* **Storybook을 ν†΅ν•œ λ¬Έμ„œν™” 및 ν…ŒμŠ€νŠΈ:** λ””μžμΈ μ‹œμŠ€ν…œμ˜ μ»΄ν¬λ„ŒνŠΈλ“€μ€ 주둜 Storybookκ³Ό 같은 도ꡬλ₯Ό μ‚¬μš©ν•˜μ—¬ λ¬Έμ„œν™”λ˜κ³  κ°œλ°œλ©λ‹ˆλ‹€ [3]. λ˜ν•œ Happo λ˜λŠ” Chromaticκ³Ό 같은 도ꡬλ₯Ό μ—°λ™ν•˜μ—¬ μ‹œκ°μ  νšŒκ·€ ν…ŒμŠ€νŠΈ(Visual regression testing)λ₯Ό μˆ˜ν–‰ν•¨μœΌλ‘œμ¨, λ ˆμ΄μ•„μ›ƒ, 색상, νƒ€μ΄ν¬κ·Έλž˜ν”Ό, λ°˜μ‘ν˜• λ™μž‘ λ“±μ˜ μ˜λ„μΉ˜ μ•Šμ€ UI λ³€κ²½μ΄λ‚˜ 버그λ₯Ό 사전에 λ°©μ§€ν•  수 μžˆμŠ΅λ‹ˆλ‹€ [3-5]. -* **μ•„ν‚€ν…μ²˜μ  ν•œκ³„ 및 λ‹€λ₯Έ λ°©λ²•λ‘ κ³Όμ˜ 곡쑴:** λ””μžμΈ μ‹œμŠ€ν…œ(μ•„ν† λ―Ή λ””μžμΈ 기반)은 UI의 일관성과 μž¬μ‚¬μš©μ„±μ— μ΄ˆμ μ„ λ§žμΆ”κΈ° λ•Œλ¬Έμ—, κΈ°λŠ₯ κ°„μ˜ κ΄€κ³„λ‚˜ λΉ„μ¦ˆλ‹ˆμŠ€ λ‘œμ§μ„ κ΅¬μ„±ν•˜λŠ” 방법은 μ˜λ„μ μœΌλ‘œ λ°°μ œν•©λ‹ˆλ‹€ [1, 2]. 결과적으둜 ν›Œλ₯­ν•œ UI μ»΄ν¬λ„ŒνŠΈ μœ„μ— ν˜Όλž€μŠ€λŸ¬μš΄ 둜직 계측이 μ–ΉνžˆλŠ” 문제λ₯Ό 막기 μœ„ν•΄, 도메인 λ³΅μž‘μ„±κ³Ό μ• ν”Œλ¦¬μΌ€μ΄μ…˜ 흐름을 λ‹€λ£¨λŠ” Feature-Sliced Design (FSD)κ³Ό 같은 μ•„ν‚€ν…μ²˜μ™€ ν•œ ν”„λ‘œμ νŠΈ λ‚΄μ—μ„œ κ³΅μ‘΄ν•˜λ©° μƒν˜Έ λ³΄μ™„μ μœΌλ‘œ μ‚¬μš©λ˜μ–΄μ•Ό ν•©λ‹ˆλ‹€ [1, 2]. - -## πŸ”— Knowledge Connections -- **Related Topics:** [[Atomic Design]], [[Storybook]], [[Feature-Sliced Design (FSD)]], [[Visual Regression Testing]] -- **Projects/Contexts:** [[UI Component Library Development]], [[Scalable React Architecture]] -- **Contradictions/Notes:** μ•„ν† λ―Ή λ””μžμΈμ„ 기반으둜 ν•œ λ””μžμΈ μ‹œμŠ€ν…œμ€ UI μž¬μ‚¬μš©μ„±μ—λŠ” μ΄μƒμ μ΄μ§€λ§Œ λΉ„μ¦ˆλ‹ˆμŠ€ λ‘œμ§μ΄λ‚˜ μƒνƒœ κ΄€λ¦¬μ—λŠ” 뢀쑱함이 μžˆμŠ΅λ‹ˆλ‹€. λ”°λΌμ„œ ꡬ쑰와 흐름에 쀑점을 λ‘λŠ” Feature-Sliced Designκ³Ό 초점이 λ‹€λ₯΄λ©°, λŒ€κ·œλͺ¨ μ•±μ—μ„œλŠ” 두 κ°€μ§€λ₯Ό λͺ…ν™•νžˆ κ΅¬λΆ„ν•˜κ³  κ²°ν•©ν•˜μ—¬ μ‚¬μš©ν•΄μ•Ό ν•©λ‹ˆλ‹€ [1, 2]. - ---- -*Last updated: 2026-04-26* \ No newline at end of file diff --git a/10_Wiki/Topics/AI/Scalable-Design-System-Governance.md b/10_Wiki/Topics/AI/Scalable-Design-System-Governance.md new file mode 100644 index 00000000..ec94e9e4 --- /dev/null +++ b/10_Wiki/Topics/AI/Scalable-Design-System-Governance.md @@ -0,0 +1,29 @@ +--- +id: DS-GOVERNANCE-001 +category: "[[10_Wiki/πŸ’‘ Topics/AI]]" +confidence_score: 1.0 +tags: [design-system, governance, scalability, theme-system, design-tokens, tokens, ui-kit] +last_reinforced: 2026-04-26 +--- + +# [[Scalable Design System Governance (ν™•μž₯ κ°€λŠ₯ν•œ λ””μžμΈ μ‹œμŠ€ν…œ κ±°λ²„λ„ŒμŠ€)]] + +## πŸ“Œ ν•œ 쀄 톡찰 (The Karpathy Summary) +> "λ””μžμΈ μ‹œμŠ€ν…œμ€ κ³ μ •λœ λΌμ΄λΈŒλŸ¬λ¦¬κ°€ μ•„λ‹ˆλΌ λŠμž„μ—†μ΄ λ³€ν™”ν•˜λŠ” μ‚΄μ•„μžˆλŠ” μ œν’ˆ(Product)이며, λͺ…ν™•ν•œ μ˜μ‚¬κ²°μ • 체계(Governance)와 기술적 μœ μ—°μ„±(Tokens)이 뒷받침될 λ•Œ λΉ„λ‘œμ†Œ 전사적 일관성을 μ§€ν‚€λŠ” λ°©νŒ¨κ°€ λœλ‹€" β€” λŒ€κ·œλͺ¨ 쑰직의 λ””μžμΈ-μ—”μ§€λ‹ˆμ–΄λ§ ν˜‘μ—… μ‹œμŠ€ν…œμ˜ μ •μˆ˜. + +## πŸ“– κ΅¬μ‘°ν™”λœ 지식 (Synthesized Content) +- **μΆ”μΆœλœ νŒ¨ν„΄:** "Token-based Theming and Democratic Evolution" β€” μŠ€νƒ€μΌ 속성을 μΆ”μƒν™”ν•œ λ””μžμΈ 토큰(Design Tokens)을 톡해 기술 μŠ€νƒμ— μƒκ΄€μ—†λŠ” 일관성을 μœ μ§€ν•˜κ³ , μƒˆλ‘œμš΄ μ»΄ν¬λ„ŒνŠΈμ˜ μΆ”κ°€/μˆ˜μ • ν”„λ‘œμ„ΈμŠ€λ₯Ό μ‹œμŠ€ν…œν™”ν•˜λŠ” νŒ¨ν„΄. +- **핡심 κ±°λ²„λ„ŒμŠ€ μš”μ†Œ:** + - **Design Tokens:** 색상, νƒ€μ΄ν¬κ·Έλž˜ν”Ό, 간격 등을 JSON ν˜•νƒœμ˜ λ³€μˆ˜λ‘œ κ΄€λ¦¬ν•˜μ—¬ Web, iOS, Android μ „λ°˜μ— 동기화. + - **Contribution Model:** μƒˆλ‘œμš΄ UI νŒ¨ν„΄μ΄ λ°œκ²¬λ˜μ—ˆμ„ λ•Œ 이λ₯Ό κ²€ν† ν•˜κ³  μ‹œμŠ€ν…œμ— νŽΈμž…μ‹œν‚€λŠ” λͺ…ν™•ν•œ μ›Œν¬ν”Œλ‘œμš° μ •μ˜. + - **Documentation (Storybook):** μ»΄ν¬λ„ŒνŠΈμ˜ μ‚¬μš©λ²•, μƒνƒœ(State), 도메인별 μ œμ•½ 사항을 μ‹€μ‹œκ°„ λ¬Έμ„œν™”. + - **Accessibility Audit:** μ‹œμŠ€ν…œ μˆ˜μ€€μ—μ„œ WCAG 기쀀을 μ€€μˆ˜ν•˜λ„λ‘ κ°•μ œν•˜μ—¬ λͺ¨λ“  μ œν’ˆμ˜ ν¬μš©μ„± 확보. +- **의의:** 쀑볡 μž‘μ—…μ„ μ œκ±°ν•˜μ—¬ 생산성을 높이고, λΈŒλžœλ“œ 정체성을 λͺ¨λ“  λ””μ§€ν„Έ ν„°μΉ˜ν¬μΈνŠΈμ—μ„œ κ²¬κ³ ν•˜κ²Œ μœ μ§€ν•¨. + +## ⚠️ λͺ¨μˆœ 및 μ—…λ°μ΄νŠΈ (Contradictions & RL Update) +- **κ³Όκ±° λ°μ΄ν„°μ™€μ˜ 좩돌:** κ³Όκ±°μ—λŠ” λ””μžμΈ κ°€μ΄λ“œλΌμΈμ„ λ‹¨μˆœ λ¬Έμ„œ(PDF)둜 κ³΅μœ ν–ˆμœΌλ‚˜, ν˜„λŒ€ 정책은 'μ½”λ“œ 기반의 μ§„μ‹€ μ •μ±…(Source of Truth in Code)'을 톡해 λ””μžμΈκ³Ό μ‹€μ œ κ΅¬ν˜„μ„ 1:1둜 μΌμΉ˜μ‹œν‚΄. +- **μ •μ±… λ³€ν™”:** Antigravity ν”„λ‘œμ νŠΈλŠ” λͺ¨λ“  λ””μžμΈ μ‹œμŠ€ν…œ λ³€κ²½ 사항에 λŒ€ν•΄ μ—”μ§€λ‹ˆμ–΄λ§ λ¦¬λ“œμ™€ λ””μžμΈ λ¦¬λ“œμ˜ 곡동 승인 정책을 μ‹œν–‰ν•˜λ©°, 토큰 μ—…λ°μ΄νŠΈ μ‹œ μžλ™ν™”λœ λΉŒλ“œ 배포 정책을 μ€€μˆ˜ν•¨. + +## πŸ”— 지식 μ—°κ²° (Graph) +- [[Atomic-Design-System-Architecture]], [[Uber-Base-Web-Design-System]], [[Inclusive-Design-and-UX]], [[Modern-Web-Design-Best-Practices-2025]] +- **Raw Source:** [[00_Raw/Design Systems.md]]