2015-9-17 用心設計
藍藍設計( www.jghy.net )是一家專注而深入的界面設計公司,為期望卓越的國內外企業(yè)提供有效的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服
來源:優(yōu)界網
作為交互設計師,我覺得有幾個發(fā)展階段:
初入這個領域,大部份人可能更多精力放在如何使用工具、如何畫線框圖、如何將想法變?yōu)閷嶋H可見的Demo;
再往下一個階段的設計師,可能會考慮線框圖怎樣做得更加合理、怎樣可以有更棒的交互效果、關注任務流程和信息結構的設計以及可用性原則;
再到一個更高層次,我覺得需要設計師在前兩個層次的基礎上去前置產品,深刻理解產品需求,深入考慮用戶是如何使用產品的。用戶使用產品有哪些路徑以及在這 些路徑上的實際使用場景是怎樣的。哪些是強場景,哪些是弱場景,在各場景下用戶目標是怎樣的,他們有怎樣的需求,哪些是強需求,哪些是弱需求……
這里主要跟大家分享第3個層次的設計方法,這些方法適合WebBase類產品的設計。
首先做產品的初期,從PM那里拿到需求時,一定不是立馬開始畫線框圖。做一個產品,我們設計師的工作就是要確定兩個核心的問題:1、需要哪些頁面以及這些頁面的關系;2、每個頁面應該如何設計。
對于第1個問題我是這樣考慮的。首先確定產品的用戶群和使用場景,這里的用戶群是產品中實際存在的、互斥的幾個群體,分類方法很多,以產品自身特征來確定,也可以在前期用研的基礎上來確定。基于此思路就產生下面的一個思維圖:
當然,這里需要去判斷哪些是強場景,哪些是弱場景,然后在做設計時,做些取舍。比如強場景下,可以考慮將較核心的路徑入口添加到明顯的位置(如導航)。
拿百度身邊來舉例,這里按這種模型大致羅列了頁面路徑:
(這邊重點介紹設計模型,對于里面的分類方法是否有優(yōu)化空間這里不做特別的探討)
在設計時,我們綜合考慮這兩種用戶,并從中選擇幾個最強的場景,如找美食、商家,這樣就需要有清晰的商家聚合頁及美食聚合頁。
現在,“需要哪些頁面以及這些頁面之間的關系”已經非常清楚了,我們就可以產出如下產品架構圖:
第1個問題解決了,下面看看單獨一個頁面應該如何去設計。
首先還是引用與第1個問題類似的設計模型:考慮此頁面有幾種互斥的用戶,這些用戶在這個頁面有哪些使用場景,每一種使用場景下用戶有哪些需求及對應的功 能。針對每一個功能,從深度、廣度、頻度這3個維度來評價功能的強弱。功能越強,設計時需要優(yōu)先考慮此功能,比如在最明顯的位置給予最強的展現;功能越 弱,則考慮將功能隱藏、合并或置于非核心視圖區(qū)域。
以百度XX產品APP官網為例,引用此模型則可以導出以下思維圖:
由此模型,我們發(fā)現平臺入口、下載入口、產品功能等得分較高,因此這些是我們在設計時需要重點考慮和突出展示的信息。因此,我們做了以下的設計:
在設計一個產品過程中,引入以上設計模型,我們可以真正做到“以用戶為中心“去設計,同時,可以非常清晰的解決以下問題:
· 模擬重現真實用戶實際是如何使用我們的產品,避免盲目的主觀臆斷;
· 設計師與PM能用同樣的思維模式考慮同一個問題,避免無休的爭論;
· 真實考慮每一種用戶的使用路徑,為任務流程的優(yōu)化以及頁面路徑的合理化提供依據;
· 重現每個頁面的用戶目標及需求,從而使頁面布局和功能展現更加合理,符合用戶預期;
通過前面的敘述,希望能給大家?guī)硪恍﹩⑹荆四P瓦€可以有很多優(yōu)化的空間,如果大家有什么好的想法,可以通過微博@wbuild探討。
作者:AfuuLee