盗墓笔记同人小说,大主宰

用戶在使用 App 時(shí)，除了正常的使用場景，還會碰到許多特殊場景：頁面內(nèi)容為空（缺省頁面）；網(wǎng)絡(luò)異常；信息輸入錯(cuò)誤；App 升級等。如何友好的設(shè)計(jì)特殊場景下的 App 頁面，對于用戶體驗(yàn)至關(guān)重要。這也是互聯(lián)網(wǎng)產(chǎn)品設(shè)計(jì)人員的基本功。

這些特殊情況下的 APP 設(shè)計(jì)我會陸續(xù)寫文章介紹，今天先講講 " 網(wǎng)絡(luò)異常時(shí)，APP 該如何設(shè)計(jì)？"天祺網(wǎng)絡(luò)

網(wǎng)絡(luò)異常有兩種情況，一種是網(wǎng)絡(luò)切換，即從 WiFi 狀態(tài)切換到 3G/4G 網(wǎng)絡(luò)；第二種是網(wǎng)絡(luò)中斷，APP 與服務(wù)器的數(shù)據(jù)傳輸。

網(wǎng)絡(luò)切換

一些需要消耗大量流量的 APP，用戶一般只會在 WiFi 的網(wǎng)絡(luò)狀態(tài)下運(yùn)行（土豪用戶除外），像視頻 APP，音樂 APP，還有現(xiàn)在很火的直播 APP。南寧網(wǎng)站建設(shè)

當(dāng)網(wǎng)絡(luò)狀態(tài)從 WiFi 切換到 3G/4G 時(shí)，為了防止用戶消耗流量，APP 會采取一定的設(shè)計(jì)形式來告訴用戶，網(wǎng)絡(luò)狀態(tài)切換了，請小心。

QQ 音樂 & 蝦米音樂

QQ 音樂、蝦米音樂，不僅提示了用戶的網(wǎng)絡(luò)狀態(tài)切換了，還告訴了用戶這種情況下該怎么辦，是繼續(xù)用流量播放還是訂購免流量包。

告訴用戶發(fā)生了什么，遇到了什么問題，也給用戶提供解決問題的辦法和入口，這才是好的設(shè)計(jì)。

網(wǎng)絡(luò)信號不好或網(wǎng)絡(luò)中斷

網(wǎng)絡(luò)中斷，APP 無法與服務(wù)器交換數(shù)據(jù)。一般有三種設(shè)計(jì)形式處理網(wǎng)絡(luò)中斷問題。

①整頁提示

當(dāng)由于網(wǎng)絡(luò)信號不好或網(wǎng)絡(luò)中斷等原因引起頁面數(shù)據(jù)無法調(diào)取狀態(tài)時(shí)，頁面做此處理。

閃電購 & 貓眼

整頁異常的設(shè)計(jì)樣式包括三部分：icon 或者插畫形式；網(wǎng)絡(luò)異常文案；重新連接網(wǎng)絡(luò)的 button。

上面兩圖分別是閃電購和貓眼的整頁異常設(shè)計(jì)，都采用了品牌形象的插畫形式，不僅增添了趣味性還起到了宣傳品牌形象的作品，可謂一舉兩得。閃電購在 button 下還增加了一個(gè)入口：搞不定網(wǎng)絡(luò)，看看小貼士。因?yàn)橛胁糠钟脩艨赡懿⒉磺宄?dāng)前的網(wǎng)絡(luò)中斷是由于什么引起的，尤其對于小白用戶來說，添加一個(gè)下貼士的入口，幫助用戶解決問題。所以從用戶體驗(yàn)的角度來看，閃電狗比貓眼做的更用心。

②預(yù)設(shè)圖和占位符提示

當(dāng)由于網(wǎng)絡(luò)信號不好或網(wǎng)絡(luò)中斷等原因引起頁面數(shù)據(jù)無法調(diào)取狀態(tài)時(shí)，我們可以事先在 APP 中預(yù)設(shè)好圖標(biāo)和占位符來替代加載的數(shù)字、圖片、文字等數(shù)據(jù)。也就是預(yù)處理過程。

京東

keep& 一個(gè)

這種設(shè)計(jì)形式有一個(gè)最大的好處就是當(dāng)網(wǎng)絡(luò)中斷時(shí)間很短時(shí)，用戶幾乎察覺不到網(wǎng)絡(luò)中斷，APP 就已經(jīng)恢復(fù)正常了。這就是利用設(shè)計(jì)技巧，不給用戶帶來額外操作成本和認(rèn)知負(fù)擔(dān)。

③ toast 和 dialog 提示

網(wǎng)絡(luò)信號不好或網(wǎng)絡(luò)中斷時(shí)，用戶還在繼續(xù)操作 APP，為了提示用戶，會采用 toast 或 dialog 的形式來提示用戶網(wǎng)絡(luò)異常。

path& 招行

上面兩個(gè)頁面都使用了 dialog 來提示用戶網(wǎng)絡(luò)異常，但是又有所區(qū)別。因?yàn)樽筮叺?path 直接給出 " 設(shè)置 " 入口，讓用戶直接前往設(shè)置界面開啟網(wǎng)絡(luò)，而右邊招行的 dialog 就遜色一點(diǎn)，僅僅是提示了用戶網(wǎng)絡(luò)異常，如果僅僅是提示用戶網(wǎng)絡(luò)異常，直接用 toast 的會更好，因?yàn)?toast 不會獲得用戶焦點(diǎn)，并且不會中斷用戶的操作。