緣起：
公司一直沒有 Design System，在產品設計上沒有一個規範，導致產品 UI 一致性很差，常常被客戶說「介面很醜」，這對設計師而言是很重的打擊（大人～寃枉啊！！我要申寃～這有貓膩！！）。礙於公司的產品因為技術債等種種問題，在時間及成本上，不太可能把一個很大的系統砍掉重練，所以就 「let it go～let it go～Turn away and slam the door～」（喂～回來）。但是總不能一直以「成本」做為理由，如果沒有下定決心花時間花成本做研發，如何能進步呢？如何跟同業競爭呢？曾經的小老弟，人家十幾年來一直在進步，現在都看不到人家的車尾燈了（抱怨完畢～）。
一直想替公司設計一套 Design System ，讓公司設計師（我）使用，讓前端工程師根據 Design System 製作 component，提高產品 UI 一致性，讓使用者有更好的體驗（UX）。藉由今年的鐵人賽來督促自己，給自己一個挑戰自我的機會（抖～）。

規劃：
在這三十天裡面，規劃了幾個單元：

1. Design System 的意涵與重要性。
2. UI 設計工具的介紹：公司原本是以 Adobe XD 為 UI 設計工具，但希望公司能跟上主流，所以這次採用 figma 來做 Design System，會分幾天來介紹 figma 的一些重要設計方法，直到交付文件的製作為止。
3. Design System 的解析：解析現在市場、業界主流的 Design System ，以供日後重新設計 UI 元件的參考與學習。
4. UI 元件的收集／分類／收斂／統計列表（常用／特殊），統計出要做的 UI 元件有哪些？
5. 定義視覺規範：包括 color、typography、spacing、icon、button、form element、grid system、breakpoint、元件組裝、交付文件（Spec、標註）。
6. Storybook 的實作：以 Storybook 編寫 UI 元件的使用說明及範例，做為與工程師的溝通文件與規範。

目標已訂好，希望能在這三十天內完成挑戰，也算是自己的一個 milestone 。（抖～）