資源有限時,該怎么對待細節優化?
小團隊在資源有限的情況下,要怎么對待細節優化呢?作者分享了自己的一些思考。
我們都知道國民級應用“微信”之父張小龍對細節的苛刻程度:大到按鈕應該放在左邊還是右邊,小到圖像差了幾個像素,“微信3.1版本和3.0的區別是微信會話列表每一行高度少了2個像素”在彼時成為“微信”之父細節設計的經典案例之一。
然而,微信像素級別的細節優化是建立在騰訊大量的人力、財力資源支持前提下的,如果是小團隊資源有限時怎么對待細節優化?
1.細節優化的重要程度
即使在用戶體驗蓬勃發展的今天,細節優化也只是為產品能擊敗對手增加了些許籌碼,但未能在勝利的天平中起到決定性的作用。決定產品生死的依然掌握在用戶剛需、產品大方向手里。例如12306,雖然所有用戶都在吐槽它的體驗,但依然阻擋不了它的成功,相反,一些用戶體驗極佳的應用,我們把玩幾天“借鑒”它們的設計后,就再也沒有打開過。
所以,細節優化環節的重要程度是比較低的,至少在項目初期是不重要的,在項目相對成熟運作后,擁有一定的優化資源,我們就可以著手進行細節優化。
2.預防優于治療
疾病發生后治療過程帶給病人的是無盡的痛苦,如果平時多喝熱水、多運動、注意飲食作息規律,做好預防就能顯著減少疾病的發生。細節優化同理,如果有一名靠譜的交互設計師,在交互設計時就盡可能把細節考慮周全,就不會像今天這樣細節優化列表堆積如山。
見微知著,在細節的處理上就可以看出交互設計師的水平層次,有經驗的交互設計師,會更注重細節性的設計,交互設計師已經制作好的原型就包括了一定的交互細節。以視頻類應用為例,視頻圖像的占位符中用文字標注為“視頻封面”,屬于視頻標題或者作者名稱的位置也具體描述出來,當前頁面所屬菜單也通過高亮來顯示…如果缺乏細節的表達,恐怕受眾需要苦學推理才能理解作者需要表達的含義,見下圖中包含細節和無細節的對比圖。
其他比較重要的需要著重考慮的設計,以三個方面分開說明,分別是:交互邊界、特殊狀態和場景設計。
2.1交互邊界
交互邊界≠產品邊界,為方便區分兩者,我們先來了解一下什么是產品邊界。以夜視項目為例,它立足于視頻,核心功能也是視頻,用戶對它的認知也是貼上了“視頻”的標簽,這是毫無疑問的。
然而,當夜視發展到一定階段,它需要在核心功能的基礎上,新增次級的功能,可以是獲取電影票、看直播、購買視頻周邊商品等功能,但絕不是看天氣、購買火車票等超出用戶對夜視APP認知范圍的功能,因為,一旦超出用戶的認知范圍,用戶的使用意愿是極低的。由于產品自身基因限制,無法拓展或者花費巨大代價去拓展的功能界線,就是所謂的“產品邊界”。
如果說產品邊界是立足于功能層面,那么交互邊界就是具體到界面層面的,或者界面中的具體控件。以夜視的首頁為例,當前已完成的交互稿,還應當包括頁面底部的細節,即首頁滾動后的內容,以及是否設置有滾動邊界(最大的屏幕滾動距離),或者滾動多少屏后自動刷出新的視頻內容?
交互邊界也可以是具體到某個組件,例如文本輸入框,限制最大輸入字符數,同樣屬于交互邊界的范疇。
2.2特殊狀態
用戶在使用產品時,會遇到一些特殊狀態,需要設計師在設計流程中就考慮進去,常見的有:等待狀態、初始狀態、空白狀態、網絡異常4種。
(1)等待狀態
國內較多的APP都設置有啟動頁,原因是APP調接口刷新數據需要等待時間,主要目的是減少用戶的等待焦慮,在短短的不到3秒的時間內也期望起到品牌展示的作用。用戶啟動APP、刷新頁面之間所處的狀態,我們可以稱之為等待狀態,需要為等待狀態進行過渡性頁面設計,除非我們有絕對的信心通過技術上的優化能把頁面數據的加載時間控制在300毫秒以下。以啟動APP到進入夜視首頁為例,我們需要設計啟動頁來減少用戶的等待焦慮。
(2)初始狀態
首次為客戶呈現的頁面狀態,都可以稱之為初始狀態,需要特別強調的是,部分功能初始狀態會隨著用戶的操作而發生變化。以APP登錄狀態為例,用戶首次下載使用APP,用戶打開“我的”頁面時,默認初始狀態為未登錄狀態;用戶登錄后,下次進入“我的”頁面,默認初始狀態為已登錄狀態。
(3)空白狀態
設計師在設計頁面的時候,往往容易忽略頁面的空白狀態,用戶打開頁面后一片空白,認為APP沒有提供任何有價值的內容,用戶體驗極差。頁面空白產生的原因可能是服務器數據缺失,也可能是頁面內容需要用戶進行某種操作才能呈現,不管如何,空白狀態的設計也是交互設計師需要考慮的事情。
以“關注”頁面為例,用戶未關注任何作者前,“關注”頁面理論上應該是空白的頁面,最簡單的方式是在頁面增加提示語“您還沒關注任何作者”,但是,我們也可以有更好的處理方式,在空白頁面為用戶推薦一些熱門作者引導其關注。
(4)網絡異常
網絡異常需要考慮兩種狀態:無網、弱網。無網是指完全斷開網絡,弱網是指網絡還處于連接狀態,但是網絡緩慢(如處于2G網絡)或者處于擁堵狀態(如春節微信搶發紅包人員過多服務器過載),兩者是有區別的。
網絡異常狀態不同,處理的方式也不同,以下拉刷新“首頁”為例,在無網的環境下,下拉刷新時可直接回彈,并出現toast提示“無法連接到網絡,請稍后重試”;如果是弱網,則保持在刷新中的狀態,計算超時時間,例如30秒,再使頁面回彈,并出現tosat提示“當前網絡環境較差,請稍后重試”。
順便說一句,每次進入首頁時,應該使用緩存的解決方案,即默認展示上次APP退出前已經加載好的內容,能有效避免因網絡原因導致的空白頁面出現。
2.3場景設計
把產品設計和用戶的實際使用場景結合起來,是最能體現設計“走心”的點,在做場景設計時,至少需要考慮人物、時間、地點、事情4個因素。
用戶(人物)在乘坐地鐵(地點)上班(時間)路上,打開夜視APP想要播放視頻(事情),就是一個典型的場景描述,但具體這個場景如何作用到設計中呢?這時,就需要我們從場景中推導出更多的影響因素,想象一下,用戶外出的時候,就基本離開了WiFi環境,只能使用4G網絡,而視頻播放需要耗費大量的流量。這時,用戶的手機處于4G網絡下,打開視頻默認自動播放是否合理?再聯系到國內運營商移動流量費用偏高的現實,答案顯然是不合理的。
基于用戶實際使用場景而采取的設計解決方案,就是所謂的場景設計,按照上述的例子,我們可以采用這樣的解決方案:當用戶處于4G網絡環境,點擊視頻播放時,不再自動播放視頻,并提示用戶“正處于4G網絡,本次播放將消耗xxM流量”。
3.細節優化分級
資源有限時,細節優化更應該區分先后順序,常見的優先級是流程>功能>UI,以用戶登錄為例,存在以下流程、功能、UI三個細節優化問題:
- 流程:優化登錄流程,縮短登錄所需的驗證步驟,原“登錄密碼”+“手機驗證碼”的組合,改為單一驗證或者指紋登錄。
- 功能:增加第三方登錄功能,降低新用戶注冊登錄的門檻。
- UI:登錄界面樣式優化,原擬物風格變為扁平化的風格。
為什么是流程>功能>UI?因為流程和用戶使用產品完成目標的成功率和時間息息相關,優化流程對提升用戶體驗的作用更明顯;而功能多數為新增或者替代性功能,變更后用戶體驗未必能達到預期,且需要一定的時間適應;最后,界面層級的優化一定程度上具備主觀性,好看是否取決于用戶個人主觀標準。
當多個細節優化都同屬于其中一類或者沒有明顯分類時,我們還需要一套更科學的分級方法:按照問題的優先級來進行分級。具體做法是按照影響范圍大小和嚴重程度高低兩個標準建立xy坐標軸,并且根據問題的落點劃分為4個象限,影響范圍大且嚴重程度高的問題優先級最高,反之則最低,處于兩者中間的屬于優先級中等。
作者:夜雨,高級交互設計師,專注金融行業-智能投顧方向,大部分時間在復雜后臺系統中遨游。
本文由 @夜雨 原創發布于人人都是產品經理。未經許可,禁止轉載。
題圖來自PEXELS,基于CC0協議
666
有點啟發,不錯!
不錯!如果能多分享一些交互細節的案例就好了,加油
?? 可以可以,等下篇