系統/平台設計
Blentity Manager +
Tudi EMR.
兩個產品都從 0 到 1,都是團隊唯一的設計師,也都兼著做 PM 的事。
Blentity Manager — Design System
Blentity 是一款整合 FIDO 無密碼認證、加密隨身碟與檔案加密的硬體安全裝置。Blentity Manager 是其桌面管理軟體,也是該公司第一個由設計 + 前端團隊共同開發的跨平台軟體。
團隊過去以韌體與硬體工程師為主,沒有面向一般消費者的設計經驗。我作為產品設計師,自然也把產品需求分析的工作一起扛了(又一次兼任 PM)。
需求分析
使用者分析
功能規格與流程設計
Design System 建置
Design Token 定義:以 Tailwind UI 為基礎,結合公司品牌規範延伸出 Design System 與 UI 元件庫。用 Design Token 管理色彩變數,透過 Figma 外掛匯出至前端。
元件規範:跟前端工程師一起建立 UI 元件庫,定義每個元件的狀態(focused、disabled、hover 等)跟使用規則。
UI 設計
交付規範
統一命名跟檔案結構規則,產出 UI 頁面狀態、規格文件跟流程文件,讓工程師不用反覆來問。
成果:Blentity 群募達成率 307%。在日本最大 IT 展覽(IT Week 2024)獲得超過 20 家潛在客戶詢問。為該公司建立了軟體開發的設計基礎,可沿用至未來產品。
Tudi EMR — Design System
在團隊開發了 4 年面向中國市場的 Tudi HIS(近 400 間診所客戶、流失率低於 1%)之後,決定進軍美國市場,開發面向矽谷中醫診所的 Tudi EMR。
Tudi EMR 包含三個子系統:Web 預約掛號系統、Web 診所管理系統、iPad 行動病歷系統。
研究方法
需求定義
Design System 選型與建置
評估多個 UI Library 後,選定 Tailwind UI 作為 Design System 基礎,向前端工程師提案並獲得採用。在 Tailwind UI 之上定義客製化的設計規則,建立適合醫療系統的元件規範。
UI 設計
品質確保
每週 Sprint Review、共用 Notion Buglist 追蹤問題、2 輪可用性測試(1 輪內部預測試 + 1 輪遠端外部使用者測試),即時修正問題並記錄長期改善事項。