網管平台後台重整，資訊層級清楚、日常操作順手

(挑戰)

功能持續增加，後台需要更清楚的導覽結構

平台為多家集團企業的官網監控流量與資安狀態。功能隨客戶數量增加，新增功能持續加入下拉式側邊欄，工程師需要往下滑動選單，才能查找想要的功能。

有時使用者不確定要找的功能隸屬於哪個選項。對需要快速排除緊急狀況的工程師而言，縮短查找時間是首要目標。

售前業務、產品經理、技術人員與前後端工程師，對平台各有不同期待。團隊以約 2 個月進行多場訪談，記錄使用上遇到的困難，分類、排序後確立專案目標，並參考客戶提供給合作企業的平台教學手冊。

(做法)

先設計主要頁面，再歸納規範

平台技術門檻高，需同時考量多種操作情境與響應式設計。需求複雜、元件多樣，因此改為先設計使用頻率最高的主要頁面，完成後找出主要頁面之間的共通邏輯，整理歸納，再將設計規範套用到其餘輔助頁面。

元件歷經規劃、設計、審稿、調整、測試與確認，超過 10 次迭代，才完成高泛用性的元件組合。

(關鍵設計)

三項關鍵設計

橫向面板

新版將同類型功能分組，以塊狀區分，並組合主次側邊欄、下拉選單、書籤、樹狀圖與多層彈跳視窗，加上由左到右的橫向面板，使用者可以分層切換，快速找到功能。

泛用元件

使用頻率高、資料量龐大的頁面，例如主機列表，以泛用性高的表格元件與拓樸圖元件承載。主機列表可點擊右鍵，針對不同主機進行完整操作，並依功能類型整理排序。

視覺化複雜資訊

平台品牌綠色貫穿介面，並以此色提示狀態正常，紅色與黃色代表異常；所有色彩層級都低於文字，達到重點提示卻不刺眼。拓樸圖、主機與流量狀態以圖像呈現，單色漸層輔助辨識。網站狀態分為 20 種，設計出近 200 個表單專用圖示，讓 MIS 人員在黃金時間內迅速排除網站障礙。

(成果)

半年如期完成，於資安展亮相

合作初期，客戶希望整個專案能在資安展之前完成。歷時半年，如期交付，讓平台團隊在資安展上獲得不少合作機會。

體驗優化涵蓋即時監看、符規預檢、IP 派發與使用管制等路徑。