我看到這篇文章超級實用损话，看了一遍記不全虐急，所以就抄錄了一版复亏，希望多在腦海中留下點(diǎn)印象暗挑。
在設(shè)計中挽霉，一些異常情況經(jīng)常很容易被忽略劳闹，在后期的實踐過程才發(fā)現(xiàn)原來還有這種狀態(tài)……本篇文章匯總了常見的異常情況及處理方式碾牌，趕緊來收藏學(xué)習(xí)曹阔！
一茉盏、快速了解異常是什么鉴未？
異常在百度中的解釋是這樣的，異常鸠姨，拼音：yì cháng铜秆，是一個漢語詞匯。釋義非正常的讶迁；不同于平常的连茧。
在設(shè)計中異常指的是除了正常狀態(tài)之外的情況，舉個例子，假如你要設(shè)計一個下載按鈕啸驯，那么下載按鈕需要有幾種狀態(tài)呢客扎？
正常狀態(tài)下需要提供的下載按鈕的狀態(tài)應(yīng)該有：點(diǎn)擊下載（下載前）、正在下載（或者是下載中罚斗、已下載59%等描述）徙鱼、下載完成，如果你在設(shè)計中只提供了這三種下載狀態(tài)是不夠的（其實有部分新手設(shè)計師针姿，只提供了點(diǎn)擊下載這種狀態(tài)）袱吆。還應(yīng)該考慮如果下載中出現(xiàn)了斷網(wǎng)，或者是用戶暫停下載等情況的時候應(yīng)該怎么處理呢搓幌？這就是異常情況杆故，所以除了前面三種狀態(tài)，還需要提供繼續(xù)下載溉愁，下載失敗等狀態(tài)。下載完成后饲趋，現(xiàn)在的設(shè)計一般是會自動安裝的拐揭，此時顯示安裝中，如果不自動安裝還需要提供安裝操作奕塑，安裝完成后提供打開的操作堂污。當(dāng)然這里面包含的異常狀態(tài)主要是暫停后的繼續(xù)下載、下載失敗等龄砰。
下圖就是我做的下載按鈕盟猖，可以看到其實很多狀態(tài)如點(diǎn)擊下載、下載完成换棚、安裝式镐、打開等在視覺表現(xiàn)上是一樣，只是文本不同固蚤，即使是這樣娘汞，這些應(yīng)有的狀態(tài)無論是交互設(shè)計師還是視覺設(shè)計師都應(yīng)該給出的，不然程序員會不知道哪一種情況用什么形式的按鈕夕玩。其實在一些登錄你弦、支付、提交等按鈕燎孟，還有一種「不可用」的狀態(tài)禽作，用戶未輸入信息時，登錄按鈕置灰揩页，只有當(dāng)用戶輸入相應(yīng)的信息后旷偿，按鈕才高亮。
二、異常情況的匯總通過上面的例子狸捅，相信已經(jīng)充分了解到設(shè)計中的異常是什么衷蜓，以及異常的處理方式，那么接下來總結(jié)一下設(shè)計中常見的異常情況尘喝。異常情況處理其實分為兩種情況磁浇。
兩種異常情況處理
1. 界面中有明顯的提示，需要用戶了解此情況的朽褪，并且影響用戶進(jìn)行下一步操作的置吓，
主要包含以下7種情況：與網(wǎng)絡(luò)環(huán)境等有關(guān)的：下載失敗、服務(wù)器出錯缔赠、斷網(wǎng)衍锚，網(wǎng)速過慢、加載失敗嗤堰、網(wǎng)絡(luò)連接失敶髦省（wifi 密碼正確，連接不成功）踢匣；
空狀態(tài)：搜索結(jié)果為空告匠、無瀏覽記錄、無收藏离唬、無購買記錄后专、無訂單記錄、無下載記錄等输莺；
表單類異常：密碼錯誤戚哎、輸入字符太少，數(shù)量超額嫂用，賬號密碼等不符合相應(yīng)規(guī)則型凳、賬號過期、必填項未填寫（提示并定位）尸折、必填項的輸入字符為空等啰脚；時效性：
二維碼/驗證碼的過期/失效處理，例如具有實效性的鏈接实夹，二維碼等橄浓；
限定值：上傳文件超過限定大小、操作過于頻繁（刷新頻繁亮航，點(diǎn)贊荸实、抖一抖，戳一戳等缴淋，需給出友好提示）准给；
不可用：賬號不存在泄朴、賬號過期、選項不可選露氮、按鈕置灰等祖灰；
其他：外接設(shè)備連接失敗（如遙控器畔规、音響局扶、手機(jī)等）、斷電/電量過低叁扫、安裝失斎琛；
2. 用戶在操作中是感受不到這種異常莫绣，并且對用戶的操作有較小影響的畴蒲。
主要是用戶切換任務(wù)引起的異常：如按 home 鍵突然退出/切換應(yīng)用、返回鍵退出对室、下載過程退出等模燥。
以上就是在設(shè)計中常見的一些異常情況匯總，看到這里软驰，可能很多朋友就要說了涧窒，這么多，我怎么記得住锭亏。我個人的建議是，如果你熟悉上面的這些異常的話硬鞍，其實在設(shè)計類似的模塊時就會考慮到相應(yīng)的情況慧瘤；如果你不熟悉這些，你可以把文章描述的異常情況當(dāng)作一個檢查表固该，設(shè)計到相應(yīng)的模塊時锅减，可以參考是否會出現(xiàn)上方的情況。三伐坏、異常處理接下來分析一下這些異常情況的處理方式怔匣，按異常方式來處理。與網(wǎng)絡(luò)環(huán)境等有關(guān)的：下載失敗桦沉、服務(wù)器出錯每瞒、斷網(wǎng)，網(wǎng)速過慢纯露、加載失敗剿骨、網(wǎng)絡(luò)連接失敗（wifi 密碼正確埠褪，連接不成功）1. 下載失敗一般需要給出明確的下載失敗提示浓利，可以通過彈窗挤庇、Toast、列表等提示贷掖。如下圖所示嫡秕，然后給出用戶下一步的操作提示，例如重試苹威、重新下載昆咽、刪除等操作。
2. 服務(wù)器出錯
服務(wù)器出錯的頁面常見的500屠升、501潮改、502、503腹暖、504汇在、505等5開頭的頁面。其中這些錯誤的解釋如下：
500 內(nèi)部服務(wù)錯誤：顧名思義500錯誤一般是服務(wù)器遇到意外情況脏答，而無法完成請求糕殉；
501 服務(wù)器不具備完成請求的功能；
502 Bad Gateway錯誤殖告；
503 服務(wù)器目前無法使用（由于超載或停機(jī)維護(hù)）阿蝶；
504 Bad Gateway timeout 網(wǎng)關(guān)超時；
505 服務(wù)器不支持請求中所用的 HTTP 協(xié)議版本黄绩。
服務(wù)器異常時羡洁，在網(wǎng)頁端的處理方式為提示+返回，在移動端的處理方式為提示+重試爽丹，下圖是一些普通的處理方式筑煮。
近幾年，很多網(wǎng)站和應(yīng)用將這種異常頁面設(shè)計的相對美觀和有故事性一些粤蝎，提升了整體的趣味性真仲，減少用戶的焦慮。例如網(wǎng)絡(luò)被外星人劫走了之類的初澎，相信大家也看過很多秸应。這里就不舉例子了。
3. 網(wǎng)絡(luò)異常
斷網(wǎng)碑宴、網(wǎng)速過慢软啼、網(wǎng)絡(luò)連接失敗（wifi 密碼正確墓懂，連接不成功）
其實都是屬于網(wǎng)絡(luò)異常的情況焰宣，加載失敗有時是網(wǎng)絡(luò)速度慢造成的，有時可能是IIS（Internet Information Services 互聯(lián)網(wǎng)信息服務(wù)）空間不足捕仔。下圖是一些網(wǎng)絡(luò)異常情況下的處理方式匕积。
如果網(wǎng)絡(luò)異常之前應(yīng)用沒有緩存之前的頁面的內(nèi)容盈罐，則整體提示用戶網(wǎng)絡(luò)異常，也可以提供一個操作指導(dǎo)用戶操作闪唆；
如果網(wǎng)絡(luò)異常之前頁面已經(jīng)緩存則顯示之前的頁面盅粪，Toast 輕提示用戶網(wǎng)絡(luò)異常。
4. 空狀態(tài)
搜索結(jié)果為空悄蕾、無瀏覽記錄票顾、無收藏、無購買記錄帆调、無訂單記錄奠骄、無下載記錄等。
其實空狀態(tài)很好理解番刊，就是頁面沒有內(nèi)容時含鳞，空頁面一般會提示用戶當(dāng)前頁面的空狀態(tài)，同時也可以做適當(dāng)?shù)囊龑?dǎo)芹务。例如在影視類 App 中蝉绷，如果觀看記錄為空，則可以為用戶推薦影片枣抱，如熱播影片熔吗、猜您喜歡，其他人都在看等熱門推薦供用戶選擇佳晶。不過如果無法確定你推薦的用戶是否喜歡桅狠，不建議做推薦。
5. 表單類異常
密碼錯誤轿秧、輸入字符太少垂攘，數(shù)量超額，賬號密碼等不符合規(guī)則淤刃、賬號過期、必選項未填寫（提示并定位）吱型、必填項的輸入字符為空等逸贾。
6. 時效性
二維碼/驗證碼的過期/失效處理，例如具有實效性的鏈接津滞，二維碼等铝侵。
實效性比較多的體現(xiàn)在二維碼、付款碼触徐、驗證碼等有時間限定的情況下才有效的情況咪鲜，通常失效之后需要重新刷新，手機(jī)的篩選操作通常是點(diǎn)擊或者是下拉刷新撞鹉；PC 端的通常好似點(diǎn)擊疟丙，TV 端的是按「OK」鍵刷新颖侄。如下圖所示為 QQ 的掃碼登錄頁面和 UC瀏覽器的手機(jī)登錄頁面。
7. 限定值
上傳文件超過限定大小享郊、操作過于頻繁（刷新頻繁览祖，點(diǎn)贊、抖一抖炊琉，戳一戳等展蒂，需給出友好提示）
對于文件過大無法上傳、下載這種建議都是采取彈窗的方式告訴用戶當(dāng)前狀況苔咪，明確問題并且加上操作提示锰悼。如新媒體管家中的導(dǎo)入的 word 的文件不能超過10M的提示如下左圖所示。對于操作過于頻繁团赏，比較常見于 QQ 中的抖動窗口箕般，其實在一些電視頁面的手機(jī)截圖工具中，刷新太頻繁也會彈出 Toast 提示馆里。
8. 不可用
賬號不存在隘世、賬號過期、選項不可選鸠踪、按鈕置灰等丙者。
賬號不存在用于登錄時，輸入的賬號不在已注冊的賬號中营密，則會提示此賬號不存在械媒，是否立即注冊等，如下圖所示评汰。
9. 賬號過期
APP 或網(wǎng)站中纷捞，登錄賬號后，如果太久不使用被去，則會有過期的期限主儡，設(shè)計師需要根據(jù) APP 的具體情況設(shè)置登錄過期的時間期限，此時需要提醒用戶重新登錄惨缆。
主要有 Toast 和彈窗兩種方式提示糜值，這需要根據(jù)賬號過期對用戶的影響大小來決定用哪一種方式。如下方左圖所示坯墨，登錄賬號過期對用戶使用此應(yīng)用的影響不大寂汇，則可以采用 Toast 輕提示的方式處理；如下方右圖捣染，如果不登錄賬號則無法使用此應(yīng)用的功能骄瓣，則需要采用彈窗強(qiáng)提示的方式，提示用戶去登錄耍攘。
10. 選項不可選
主要包含當(dāng)前的選項中有不可選的選項榕栏，還包括在不達(dá)到某種條件情況下畔勤，無法使用此功能的按鈕等。
11. 其他
外接設(shè)備連接失斁矢唷（如遙控器硼被、音響、手機(jī)等）渗磅、斷電/電量過低嚷硫、安裝失敗。
外接設(shè)備連接失敗需要提示始鱼，如果知道連接失敗原因仔掸，建議給出原因。
斷電情況通常用于 PC 端和 TV 端医清，斷電后需要為用戶恢復(fù)文件起暮。很多設(shè)計軟件都有這個功能，一旦軟件無響應(yīng)或者其他異常情況導(dǎo)致文件出問題会烙，一般都會提供恢復(fù)文件负懦。
安裝失敗后需要提供提示安裝失敗原因，如存儲空間不足柏腻、文件已損壞的提示纸厉。
12. 用戶切換任務(wù)引起的異常較多
如按 home 鍵突然退出/切換應(yīng)用、返回鍵退出五嫂、下載過程退出颗品。
此類異常建議用戶再次打開時，回到上次用戶離開前的狀態(tài)沃缘。如果數(shù)據(jù)被清理躯枢，則回到上次保存的數(shù)據(jù)頁面中。
四槐臀、總結(jié)
文章主要總結(jié)了設(shè)計中常用的異常情況锄蹂，并且給出了相應(yīng)的解決方案，最長用的規(guī)則就是給出異常提示+下一步操作提示水慨，既明確了出錯原因败匹，又指引用戶下一步操作，用戶是相對容易接受的讥巡。異常是設(shè)計中的一部分，無論是交互設(shè)計師還是視覺設(shè)計師都應(yīng)該給出異常的表現(xiàn)形式或處理方式舔哪。
本文來自有https://www.uisdc.com/abnormal-situation-and-processing-method欢顷；
