Morningstar 金融客戶 UI/UX 重建專案

在限定時間內完成多套金融服務界面重建，服務香港主要金融機構

專案概述

重建金融服務界面，統一設計系統

負責 Morningstar 企業元件客戶遷移專案的 UI/UX 設計工作，需要重建多套金融服務界面，服務香港主要上市銀行、指標保險集團、國際金融機構等客戶。

多套

金融服務界面

4 種

不同界面系統

統一

設計系統

我的角色

Product Designer

負責整體界面設計與團隊協作

專案時間

2024年5月開始

在緊迫期限下完成界面重建

核心設計挑戰

客戶體驗一致性

零學習成本 - 用戶操作習慣不能改變
多語言支援 - 繁中/簡中/英文界面
品牌客製化 - 每家銀行都有自己的 CI/VI 需求

關鍵約束：遷移過程中不能影響任何一家銀行的日常營運，因為金融服務的中斷會直接影響客戶交易。

設計解決方案

統一設計系統

元件標準化

基金篩選器 (Screener)
排名表格 (Ranking Table)
比較工具 (Compare)
X-Ray 分析

認證機制

客製化管理後台

視覺一致性

響應式設計框架
多品牌客製化支援
多語言界面標準

設計改進案例

桌面版介面對比

拖曳滑桿查看改版前後差異

‹ ›

改版後改版前

手機版介面對比

響應式設計優化

‹ ›

改版後改版前

介面優化重點

簡化搜尋流程，提升查找效率
重新整理資訊架構，降低認知負擔
優化視覺層次，強化重要資訊
統一設計語言，符合 Morningstar 品牌

設計成果

提升基金搜尋的易用性
建立可擴展的設計系統
改善響應式體驗
符合金融機構合規要求

專案成果

設計交付物

統一的金融界面視覺語言
可重用的 UI 組件庫
支援多品牌客製化的設計框架

專案影響

主要金融機構順利遷移
降低後續維護與更新成本

關鍵學習

這個專案讓我深度理解了大規模系統遷移的複雜性，特別是在金融業的嚴格要求下。學會如何在技術限制與用戶需求之間找到平衡點，以及如何設計向下相容的解決方案。最重要的是，體會到在 B2B 專案中風險管控比創新更為重要。

專案反思與學習

專案經驗與學習

大規模界面重建經驗：負責多套金融服務界面的設計工作，學習如何在大型專案中建立一致性

專業成長

金融界面設計專業：深入了解金融產品的界面需求和用戶使用情境
設計系統建立：學會建立可擴展的設計規範和組件庫
專案管理能力：在時間壓力下合理分配設計資源和工作優先級