網絡異常時APP該如何設計
用戶在使用App時，除了正常的使用場景，還會碰到許多特殊場景：頁面內容為空(缺省頁面);網絡異常;信息輸入錯誤;App升級等。如何友好的設計特殊場景下的App頁面，對于用戶體驗至關重要。這也是互聯網產品設計人員的基本功。就跟隨小編去了解下吧，想了解更多相關信息請持續關注我們應屆畢業生考試網!
這些特殊情況下的APP設計我會陸續寫文章介紹，今天先講講“網絡異常時，APP該如何設計?”
網絡異常有兩種情況，一種是網絡切換，即從WiFi狀態切換到3G/4G網絡;第二種是網絡中斷，APP與服務器的數據傳輸。
網絡切換
一些需要消耗大量流量的APP，用戶一般只會在WiFi的網絡狀態下運行(土豪用戶除外)，像視頻APP，音樂APP，還有現在很火的直播APP。
當網絡狀態從WiFi切換到3G/4G時，為了防止用戶消耗流量，APP會采取一定的設計形式來告訴用戶，網絡狀態切換了，請小心。
QQ音樂&蝦米音樂
QQ音樂、蝦米音樂，不僅提示了用戶的網絡狀態切換了，還告訴了用戶這種情況下該怎么辦，是繼續用流量播放還是訂購免流量包。
告訴用戶發生了什么，遇到了什么問題，也給用戶提供解決問題的辦法和入口，這才是好的設計。
網絡信號不好或網絡中斷
網絡中斷，APP無法與服務器交換數據。一般有三種設計形式處理網絡中斷問題。
>>>①整頁提示
當由于網絡信號不好或網絡中斷等原因引起頁面數據無法調取狀態時，頁面做此處理。
閃電購&貓眼
整頁異常的設計樣式包括三部分：icon或者插畫形式;網絡異常文案;重新連接網絡的button。
上面兩圖分別是閃電購和貓眼的整頁異常設計，都采用了品牌形象的插畫形式，不僅增添了趣味性還起到了宣傳品牌形象的作品，可謂一舉兩得。閃電購在button下還增加了一個入口：搞不定網絡，看看小貼士。因為有部分用戶可能并不清楚當前的網絡中斷是由于什么引起的，尤其對于小白用戶來說，添加一個下貼士的入口，幫助用戶解決問題。
>>>②預設圖和占位符提示
當由于網絡信號不好或網絡中斷等原因引起頁面數據無法調取狀態時，我們可以事先在APP中預設好圖標和占位符來替代加載的數字、圖片、文字等數據。也就是預處理過程。
京東
keep&一個
這種設計形式有一個最大的好處就是當網絡中斷時間很短時，用戶幾乎察覺不到網絡中斷，APP就已經恢復正常了。這就是利用設計技巧，不給用戶帶來額外操作成本和認知負擔。
>>>③toast和dialog提示
網絡信號不好或網絡中斷時，用戶還在繼續操作APP，為了提示用戶，會采用toast或dialog的形式來提示用戶網絡異常。
path&招行
上面兩個頁面都使用了dialog來提示用戶網絡異常，但是又有所區別。因為左邊的path直接給出“設置”入口，讓用戶直接前往設置界面開啟網絡，而右邊招行的dialog就遜色一點，僅僅是提示了用戶網絡異常，如果僅僅是提示用戶網絡異常，直接用toast的會更好，因為toast不會獲得用戶焦點，并且不會中斷用戶的操作。
摩拜單車&網易考拉
摩拜單車和網易考拉采用了toast的形式提示用戶網絡異常。
【網絡異常時APP該如何設計】相關文章：
如何快速全面搞定App搜索功能設計10-07
該如何改進設計搜索框07-30
響應式網站該如何設計10-16
交互設計新手該如何學習10-20
如何處理PHP異常10-30
如何描述APP的隱藏手勢操作10-17
當面試官問你缺點時該如何回答10-27
新手駕考時該如何打方向盤10-04
APP中圖標設計的應用技巧06-07