01 / Enter details
先知道要準備什麼。
清楚的起點與步驟，讓使用者在填寫時知道整個流程還有多遠。
下一步
SOUTHEAST / MEMBER EXPERIENCE
讓使用者看懂自己的資訊、目前狀態，以及下一步。
為保護隱私，展示畫面中的個資與保單明細已遮蔽。
我負責 Southeast Insurance 登入後的保戶專區體驗，從需求對齊、wireframe 到 UI 設計與工程交付。保戶專區包含保單資訊、續保、會員資料與服務流程；重點是讓這些功能之間建立清楚、一致的使用邏輯。
01 / The Challenge
很多需求，但缺少一致的使用體驗。
專案初期，不同部門各自提出功能需求與呈現方式，窗口很難一次整合所有意見。真正的挑戰是保留各部門的業務需求，同時讓整個保戶專區仍然像同一個產品。
Different needs / Shared logic
保單資訊會員資料車險預約服務流程
一個保戶專區，一致的使用邏輯。
需求整合概念示意
02 / Clarifying the Flow
先把流程弄清楚，再開始畫 UI。
登入、車險預約與保單查詢，都有不同身份、資料狀態與例外情況。我先用 wireframe 和 user flow 拆解流程，再與客戶逐步確認功能邏輯，讓後續設計建立在清楚的規則上。
把例外情況，也放進設計裡。
03 / Making Progress Visible
讓使用者知道自己現在在哪裡。
車險到期預約是一個多步驟流程。我加入明確的進度設計，讓使用者隨時知道目前所在階段，以及接下來還需要完成什麼。
從「告訴使用者流程」，到「讓流程持續提供回饋」。
04 / One Portal, Different Services
功能不同，但不需要每次重新學習。
新版建立共通的 navigation、form、card、step、status 與 feedback pattern，讓保單查詢、車險預約、旅遊險名單維持各自需求，同時保有一致的使用邏輯。
05 / Responsive UI & Visual Direction
讓資訊清楚，也讓品牌自然存在。
UI 延續新版官網的橘色主視覺，搭配白色空間與深藍色功能元素。重要狀態、步驟與提醒使用品牌色突出，主要操作維持清楚且穩定的視覺層級。
桌面與手機維持相同的資訊邏輯，並依畫面空間調整卡片排列、表單與導覽方式。
/ Mobile Navigation
把完整導覽，帶到小螢幕。
手機版以展開式選單提供服務入口，保留原有的服務分類，讓導覽適應較窄的畫面。
06 / From Design to Delivery
從需求整理，到最後的實作細節。
這部分從需求整理、wireframe、Desktop / Mobile UI，到最後與工程師確認實作細節，都由我完整負責。交付的內容包含不同狀態與操作流程，讓設計意圖可以被理解，也可以被實作。
設計，是把複雜的需求整理成可以被理解、被使用，也可以被實作的系統。