UI 函式庫與設計系統的建置
2023年1月 – 2024年1月 · 雄獅資訊（雄獅旅遊集團）
設計團隊能使用共用的 Figma 元件庫，前端團隊實作對應的元件，在維持 UI/UX 一致性的同時大幅減少了重複的程式碼。這套函式庫在我離職前已用於正式專案，其他成員也持續擴充。
- 專案背景
- 公司第一套跨專案的設計系統，目的是統一多個產品的樣式與 UI，並讓設計團隊有一份共用的元件庫。
- 我做了什麼
- 盤點既有程式碼與 UI，消除重複並提高可重用性。
- 與團隊討論技術選型，分配調查項目並決定導入方針。
- 設計並整備前端實作與 Figma 元件庫的對應關係。
- 支援各產品團隊的導入。
- 我負責的階段
- 環境建置技術選型設計實作指導與支援
- 團隊組成
- 3 人，我擔任 lead。 Lead：初期環境建置、技術選型、設計方針決定、導入支援。
- 技術環境
- TypeScriptReactNxLernapnpm workspaceRollupJestCypressESLintTailwind CSSStorybook
- 工作語言
- 中文（台灣）
回頭看
這是我收穫最多的一個專案。當時沒有資深工程師可以問，我帶著兩位成員，從技術選型到環境與工作流程都得自己摸索。
過程真的很辛苦，嘗試、失敗了很多次，也遇到完全不知道發生什麼事的問題。但正是那個過程讓我們學到最多。
在我離開公司前，這套函式庫已經用在正式專案上。它並不完美，但其他成員持續加入新元件，也從我們的經驗裡學到東西，把環境調得比我們留下時更好用。