後臺管理UI設計
對於後臺管理類平臺來說,互動和內容是比UI更重要的事情。所以在設計之前,一定要和產品經理及互動設計師研討確認操作流程。
根據平臺的使用者畫像,可以為平臺設定整體風格。本次設計採用比較年輕的顏色結合商業插畫,給使用者一種輕鬆掌握的感覺。
在設計時,為了整個產品的開發進度和易用性,參考了AntD的設計規範和元件程式碼。
整個平臺因為層級較深,所以統一採用右邊導航的方式,icon的應用使平臺UI更加精緻。前端頁面開發固定了導航內容自適應,柵格系統採用8+n*8的間距。
開發時總有一些流程圖關係圖沒有現成的元件,可以參考GoJs元件庫得知開發可實現的型別,而後在上面進行改良設計。
*以上為產品的部分頁面
後臺產品整體比較複雜,建議產品+設計師+前端一起使用線上平臺交流設計稿,三方可以同時共享互動、標註和批註。
我司前端開發icon時統一引入字型格式,這樣開發出來的頁面icon不模糊不變形,且可以根據需要自行賦色,所以每次icon都會統一繪製後上傳iconfont專案組。