用好的交互設計來管理復雜-“個人中心”
“復雜是世界的一部分,但它不應該令人困惑,好的設計能夠幫助我們馴服復雜,不是讓事物變得簡單(如果復雜是符合需求的),而是去管理復雜”。復雜是可以被管理的,但要做到這一點,我們都必須做好自己該做的那部分工作。
在探討如何用好的交互設計來管理復雜篇章中,我們第一篇講了“篩選器”,可參考用好的交互設計來管理復雜-“篩選器”。今天我們來分析另外一個產品中大家都會遇到的復雜點:個人中心。
抽屜式、二級導航
偏工具化的App,默認的首頁通常會提供產品最核心的內容,從而使得用戶每次在需要使用都感覺非常輕松,一打開APP就可以快速使用。當某件東西的運轉、可選項和外觀與人們的概念模型相匹配,它就會被認為是簡單的。
產品設計,應該是降低用戶學習成本,符合用戶的使用習慣,了解用戶大腦中已存在的概念模型非常重要。那么“個人中心”作為一個二級模塊,被放置左上方,為核心的工具化功能做輔助,且不宣兵奪主,又可以令用戶能形成感覺登記,在用戶需要查看個人信息或者設置工具項時,方便打開即可。因為人們在瀏覽信息或布局時,視線往往趨向于從左上角移動到右下角。
古騰堡圖表簡單的說明了閱讀產品時的習慣性軌跡。
譬如滴滴打車的核心常用功能是“打車”,多看閱讀的核心常用功能就是“閱讀”(書架),那么把“個人中心”用這種模式放置工具界面的導航上,就比較合適。這樣的交互設計會讓主界面清爽,并收拾了很多屬于個人中心的復雜內容,放置二級界面,感覺主次分明,管理合理。
獨立Tab,多層列表
當產品有較多的信息,需要展示在個人中心,同時個人中心是用戶對比核心模塊而言,并行存在的一級入口時,通常我們可以用獨立的Tab來放置“我/我的”(個人中心)這個模塊。對于個人中心中的分類較多,條目需要較為清晰時,建議使用多層的列表呈現內容,多層的列表會顯出內容與內容之間的階層關系。一般情況下,這類列表主要適用于文字信息為主要內容的列表,列表內容里面沒有圖片或者圖片不是很重要的信息。
另外,除了文字外可能還會用到一些按鈕,選擇框等一些交互控件來輔助列表的交互。多層列表的方式,高效且具有極佳的視覺可視性,能夠一眼看出整體信息架構能夠同時瀏覽與處理多個階層的內容。如下圖所示的案例:
模塊化,網格縮圖
與前一個交互設計對比,把列表替換為用網格縮圖的方式呈現,讓用戶可以使用視覺圖片的方式瀏覽內容。 這樣的設計,圖像比文字還容易辨識,而且更容易的區分。 因為詳細內容與列表呈現在同一個畫面,能輕松的閱讀信息。當然模塊化設計有個需要注意的地方,那就是當用戶需要依賴文字來尋找的內容時,就不適合使用了,因為使用者必須不斷跳躍瀏覽。
如果你的產品的個人中心模塊,眾多內容中,有部分模塊需要強調,那么使用網格縮圖的方式,就會比多層列表方式更加容易突出優先級或者重點,譬如下圖所示,當你想要突出訂單模塊的內容,就可以通過留白和布局,從界面設計本身就區隔化,讓用戶一目了然。
綜合上面三類常見模式,我們可以看到,無論選擇哪種方式,在設計個人中心之前,首先應該思考,本交互動作的設計是否已滿足內容的需要,同時也要考慮整個產品交互的一致性以及平臺的兼容性。另外,交互方式要符合用戶的操作習慣。只有從根本上管理復雜,才能夠設計出簡單的產品。從此思考自己的產品的需求是什么,打造一款產品滿足自己的需求。
作者:權莉,微信昵稱:Mandy權。一名快樂的產品經理!
本文由 @權莉 原創發布于人人都是產品經理。未經許可,禁止轉載。
其實個人覺得現在的很多個人界面的復雜,是流程上的復雜造成的,所謂的個人界面有的時候就像一個功能的垃圾桶,所有不知道放在哪里的功能都被壓縮在了里面。
無論以那種方式呈現,其實是按需求呈現的,而能幫助我們管理復雜的,個人認為是流程上的梳理和功能的篩選和分類。管理復雜更多的應該做在前面的流程呢。 ??
產品整體的功能設計,一定是來源于產品定位。每一個模塊都會是相輔相成的,沒有絕對的正確。 ??
分析的很到位
這個垃圾桶用的好