設計總結:58同城寶PC端改版總結
工具型后臺的視覺設計如何著手?
項目背景
58同城寶是什么?
“58同城寶”是一個針對生活服務信息做廣告推廣的平臺,依托58同城海量的商戶和每天更新的生活數據,58同城寶為媒體方提供最豐富最真實的生活信息,同時,媒體方也能從信息推廣中獲得豐厚的分成收益。用戶在同城寶系統完成申請-審核-投放-數據監測-收益結算等。
改版背景是什么?
舊版同城寶后臺樣式與體驗還停留在多年之前,樣式過時,隨著業務的擴大升級,現有功能架構已無法滿足用戶的需求,功能體驗不足的問題也日趨明顯。
舊版頁面展示,以數據報告頁面為例
產品目標
此次業務升級在基礎功能上進行架構、功能邏輯的優化。并支持快速創建廣告、媒體,自動生成鏈接。同時增加策略、維度上的數據展示,從而增強數據分析,提供參考意義。加入審核機制,增加媒體、位置監控維度。
設計目標
本次改版需要針對已知問題進行解決,設計主要從三個方面著手:
A.新
1.布局
采用全屏自適應的設計,讓用戶沉浸其中,可以讓用戶對當前信息更加聚焦。
同城寶的用戶在使用過程成中有大量的表單信息填寫工作,由于形式單一內容枯燥等問題,用戶注意力容易分散,所以全屏沉浸式的設計在其中就起到了關鍵性的作用,對操作更加聚焦,有利于用戶降低使用的時間成本以及降低用戶的出錯頻率。
2.結構
頂部品牌標識&部分輔助功能展示區,左側部分為可擴展的樹形結構功能區,右側為主要內容展示區。
功能模塊區分明確,有利于延續用戶使用習慣,讓用戶控制界面而不是界面控制用戶。
3.科學嚴謹的品牌色
色彩在產品設計中是一個不可或缺的要素,不同色相色溫傳遞給使用者不同的使用感受甚或影響其操作效率及操作準確度。
同城寶以帶有理性嚴謹的藍綠色為主色調。主色的確定主要是經過市場上同類型競品的多方面對比分析,我們要通過色彩讓58同城寶在功能上趨同在品牌上求差異,在強調其科學,專業的產品屬性的同時傳達同城寶的獨有產品特色。
頁面區塊背景部分用簡單的“白-灰-白”進行區分。突出主體內容,減少用戶閱讀阻力,提供更優質舒適的體驗。
B.簡?
1.按照用戶行為路徑進行信息分區,減少操作路徑
舊版申請結算頁面主要功能操作是由彈窗完成,用戶的操作的路徑長且復雜,影響用戶處理效率。改版后按照用戶的行為路徑“讀取信息–>操作信息”從上到下依次展開,重新進行信息比例分區。減少用戶交互次數,提高用戶處理業務效率。
2.零散信息歸類整合,減少頁面閱讀負擔
原來版面信息呈現層次邏輯混亂,信息分散,影響閱讀。改版把信息重新歸納整合,提高閱讀效率。
C.快
1.統一全平臺的規范
不同業務模塊內容都各不相同,我們從每個區域挑選其可共用部分進行規范制定,統一全平臺的視覺設計表現。
規范的建立有利于同品牌的快速產出,提高工作效率,有利于品牌的建立,加深用戶對品牌的認知以及好感度,有利于維護頁面的一致性提升用戶體驗。
2.打包相同信息,尋找共性模塊
尋找主信息中的通用性模塊進行打包,使其在不同的主信息結構中進行復用,提高產出效率。
寫在后面
同城寶項目預計在10月份上線,我們會持續跟進上線效果數據,不斷的完善我們的流程與設計語言,致力于打造屬于58的特色同城寶平臺。
編輯:劉靜頤
本文來源于人人都是產品經理合作媒體@58用戶體驗設計中心(微信公眾號@58UXD),作者@ 劉靜頤
題圖來自Pixabay,基于CC0協議
邏輯清晰,好評!
抄襲 ??
感謝
學習筆記:全屏沉浸式有利于聚焦,統一全平臺規范,減少用戶操作