編輯導語：產品設計與用戶的體驗感息息相關，但是很多時候產品經理在產品設計過程中會忽略掉可能影響到用戶體驗感的一些因素，比如一些異常狀態的出現會讓用戶產品卸載的想法。因此，如何處理好非正常狀態的用戶體驗是產品經理需要做好的一件事。本文通過四大維度，讓你了解加載和異常狀態設計應該如何做。

產品經理在產品規劃設計中，場景考慮的全面性決定了產品呈現給用戶的體驗優劣。我們往往在產品設計中更多的考慮到正向流程是否順暢，功能是否有缺失。

卻忽略了頁面性能、用戶網絡、接口異常等帶來異常情況的影響，其實在用戶交互中，任何一個功能都存在狀態異常和加載有問題的情況，這是無法避免的事實。

正向流程的產品設計中，產品間不會出現太大的優劣，很難給用戶帶來“WOW”的尖叫感，反而異常狀態倘若處理不友好，更易招致用戶的吐槽和卸載。那么如何盡可能的處理好非正常狀態的用戶體驗就顯得尤為重要。

我簡單的將用戶的加載和異常狀態分為四部分：

1. 加載場景：用戶網絡、接口性能等均會導致頁面在打開時面臨“慢”的問題。大多數時候除了用戶第一次打開頁面，其他時候可采用緩存機制來避免加載慢的問題；
2. 缺省場景：空態頁面、接口異常、數據異常等情況會導致該場景出現；
3. 網絡異常：這種情況其實在5G時代還是普遍存在的，運營商在偏遠地區、密閉空間存在網絡不穩定，導致出現網絡異常情況；
4. 邏輯異常：如今算法普遍應用的時代，很多平臺都會圈定用戶進行投放營銷，當訪問用戶與圈定的用戶不相符時，會出現邏輯判斷導致的相關提示信息。

一、加載與異常

1. 加載場景

1）全局加載

任何APP內有也不可或缺的模塊——運營活動，當我們打開活動時，經常會遇到一個小動態圖片在頁面中間運動，這個頁面就是全局加載的loading頁。

為什么需要該loading頁呢？

目前的活動多為H5頁面，當用戶打開時需要請求接口及下載元素，在此背景下就受到一些客觀因素的影響導致頁面從用戶點擊到呈現會有一定的時間差。

如果在該時間差內就一個空蕩蕩的頁面，會增加用戶心理感知的等待時間。當加入有趣的動態小圖在頁面上運動時，用戶的注意力會被吸引，從而在感知上減少了用戶等待時間。

該加載方式的優點是完整的將頁面元素展示給用戶，當然也有缺點，比如在業務模塊多的情況下加載時間會較長。

2）骨架圖加載

很多時候我們為了減少用戶在頁面打開的時間差，會采用此加載方式，讓用戶先看到頁面的布局，該布局可采用帶有擦亮效果。通常該加載方式常用于模塊結構較固定的模塊，而非整個頁面。

比如資源模塊就很適合這種方式，目前當平臺SKU達到一定數量時，就會有機器學習算法的介入，往往這種資源接口相比于熱門推薦類的接口耗時更久。

3）下拉加載

常用于頁面內容刷新操作，像淘寶這類超級APP當下拉到一定高度時也會有其他隱藏的功能，比如淘寶二樓。如上圖，可明顯感覺到這個模塊還是有操作空間的，比如京東的形象好小人+宣傳語，讓用戶眼前一亮的同時，也傳遞出平臺的亮點。

4）上拉加載

上拉加載，常見于feed流，為實現沉浸式瀏覽的場景。上拉加載也可能是由于數據分頁的原因導致采用該方式。從接口層面考慮數據量較大時，一次性拉出所有的feed信息與用戶與平臺而言都是有損失消耗的。

5）局部加載

多用于導航TAB切換，比如類目、品類導航的局部切換，從而達到不影響整體頁面的瀏覽。

2. 缺省場景

1）空數據/內容被刪除

空數據包含初始狀態空數據和清空（刪除）狀態空數據，清空狀態的空數據比如公眾號分享出去的內容被作者刪除后的頁面。

2）接口異常

其實在我們理解中這種情況出現算作服務異常，可屬于bug范疇，但實際很難規避，比如接口請求超時未返回信息。

3. 網絡異常

網絡異常，如果是多年資深的手機用戶都會遇到。

若頁面部分已呈現，則可考慮tips提示和彈窗提示處理；若頁面無法正常顯示，則建議考慮缺省頁。比如當打開APP時，很多app是用native寫的，用戶正常打開是可以展示APP首頁，當用戶發生點擊等行為時，則會提示網絡異常。純H5的話，更多的是直接考慮缺省頁。

4. 邏輯異常

1）判斷異常

跳轉的頁面有邏輯判斷，比如無訪問權限，可使用Dialog彈窗引導到指定頁面。

2）查詢異常

常見于用戶搜索行為和篩選行為導致的無結果，比如搜索框內搜索了某關鍵字導致無結果，可使用插畫+文字的空態頁承接，現在更多大廠也會在其頁面做推薦（猜你喜歡）。

在垂直搜索領域，用戶輸入的信息越長尾越可能出現無查詢結果，所以查詢異常的空態頁還是很有必要的。

3）操作異常

某些關鍵信息未輸入、輸入錯誤、未勾選等情況都會導致的操作異常提醒，比如登錄頁面的手機號碼輸入位數不夠，可使用toast提示告知用戶。

二、使用建議

所有的加載與異?？梢酝ㄟ^空態頁、toast提示、tips提示、彈窗（模態、非模態）、loading來提升用戶使用過程中的體驗，但有一個原則：能避免就避免，這并非是體驗的最佳選擇。

異常狀態的文案可根據平臺特征進行擬人化，比如支付寶的我也是有底線的；圖片可動圖化，動圖是僅次于視頻的表達形式，動圖盡可能做到全平臺統一，便于給用戶整體的認知，如果有能力強烈建議結合平臺吉祥物。

合適的場景選擇合適的交互，比如登錄頁輸入異常就采用toast提示2.5s，toast文案不宜過長。2.5s是個人經驗之談，可根據個人自行調整。

本文由 @唐頌LIVE 原創發布于人人都是產品經理，未經許可，禁止轉載

題圖來自?Unsplash，基于 CC0 協議