做功能設計時，我們都要求會考慮到產品的各種情況，其實就是交互狀態的各種臨界和極限。這篇文章，作者梳理了九種狀態，細分了38個狀態細節，可以收藏起來備用。

了解用戶在各種場景下可能面對的交互狀態，是UX設計師日常工作中的一項重要任務。

對這些狀態進行全面、清晰的預判，對設計師尤其是新人設計師有兩個方面的優勢。

一個是有助于確保方案交付的完整，使產品更具可用性、易用性。登錄前后或者不同網絡環境下的體驗訴求肯定是不同的，設計師需要關注到這些狀態的存在，才能做出全面的設計布局，幫助用戶從容應對多變的體驗狀況。

再一個，當產品開發完畢，進入走查環節，對各種交互狀態的掌握，能夠快速查漏補缺，發現潛在問題并進行修復，避免產品帶著問題上線。盡管這些狀態可能并非產品的核心功能，但這些瑣碎的設計細節，對整體體驗感知起到非常重要的兜底作用。及時、友好的狀態設計，可以有效的降低用戶負面情緒，逐漸建立起對產品的信任和信心。

以下，為大家全面梳理了9個大類下的共38個狀態細節，并對每個交互狀態的設計思考點進行了簡單闡述，同時結合實際案例加深理解：

一、角色

1. 未登錄/已登錄

• 未登錄：如何進行登錄引導，判斷哪些頁面不可見、功能不可用
• 已登錄：如何退出，入口放在哪，是否需要提示?
• 引導形式：氣泡、內容模塊、整頁、彈窗、Snackbar
• 登錄形式：彈窗、半浮層、整頁

2. 新用戶/老用戶

• 新用戶如何降低學習成本、快速上手？新手引導的形式，是否分步？如何退出？
• 是否需要收集用戶信息，為內容推薦提供初始來源。用戶標簽收集信息有哪些？分幾步？如何順利完成，降低跳過率？
• 功能是否可以自定義？如何回到默認狀態？
• 老用戶如何體驗更高效？是否需要提供快捷、個性化操作，快速進入任務狀態？

3. 游客賬號

• 游客身份下是否保存相關記錄？保存的時效性？
• 什么時候引導用戶注冊/登錄正常的帳號？如何引導？
• 登錄后游客身份的資料信息如何處理？

4. 第三方賬號

• 支持哪些平臺的帳號？
• 與本地帳號整合時如何提示？帳號合并后資料信息如何處理？如何提示？
• 如何與平臺賬號解綁？

5. 普通用戶/高級會員

• 普通用戶與會員的差異是什么？流程、功能還是服務？
• 會員身份如何體現？（標識、顏色、文案等）
• 會員服務如何與普通服務區分？
• 如何引導轉化？策略是什么？入口放在哪？

6. 內網/外網賬號

• 需要向用戶說明當前所處內外網環境
• 訪問權限是依據用戶賬號還是訪問地址？
• 外部用戶可否訪問？訪問內容范圍是什么？如何提示？
• 是否支持申請？申請流程如何設計？

7. 管理員賬號

• 是否支持身份切換？入口放在哪？
• 身份標簽如何展示？

二、網絡

1. 網絡中斷

• 由于信號端、應用端等非用戶原因，或主動關閉信號、切換至飛行模式等用戶原因導致的網絡中斷
• 根據內容狀態、內容類型選擇合適的、反饋清晰的通知方式

2. 大流量消耗

• 看視頻、玩游戲等大流量消耗場景，正式開始前進行提示
• 確認是否支持在平臺內對流量提醒進行設置

3. 信號不佳/不穩定

• 信號不穩定不代表網絡中斷，只是較弱或連接不穩定，時連時斷，對該狀態進行提示
• 尤其是在線會議、觀看視頻等持續消耗流量的場景，用戶需要對情況及時了解并做出反應

4. 流量形式切換

• 從wifi流量切換至移動數據時，進行toast提示
• 切換至WiFi時是否提示，可自行判斷

三、內容

1. 沒有內容

• 給出解釋
• 避免中斷用戶體驗，可進行操作引導

2. 敏感/違規內容

• 確定敏感、違規內容的范圍，并按照相關規則、平臺屬性進行分類、定義
• 從產品各關聯方進行考慮，如內容提供者、內容消費者、平臺方
• 用戶輸入敏感詞或違規內容時，是否需要提示？如何提示？
• 用戶發布、分享的內容涉嫌違規時，如何進行提示？如有違規懲罰機制可一并告知
• 是否需要對內容違規部分進行精準提示？
• 用戶瀏覽敏感內容、違規內容時如何進行提示？是否支持繼續瀏覽？

3. 站外內容

• 跳轉鏈接為站外內容，進行免責告知

四、設備

1. 橫豎屏

• 適合橫屏瀏覽的內容，進行友情提示，或為用戶提供一鍵橫屏操作
• 告知用戶如何退出

2. 分辨率

• 是否有相應的適配規則
• 大概幾種方式：保持頁面不變，簡單拉伸適配；居中顯示，兩邊留白；保持頁面框架，調整模塊內的樣式；重組頁面布局
• 確定邊界值、縮放內容，固定區域等信息

3. 清晰度

• 對分辨率切換狀態進行告知
• 如果分辨率領先競品，或是會員權益的一部分，可以對最高畫質進行水印常駐提示

4. 不同版本

• 產品是否存在新舊版本、不同的模式（青少年模式、無障礙版/關懷版、聽筒模式等）？
• 如果存在，差異點是什么？
• 對于較低版本的應用，如何進行升級引導？頁面中是否需要提供升級的快捷入口？
• 升級后是否支持退回舊版本？有必要對升級情況進行提示
• 是否支持用戶切換版本？如支持則提供切換的入口。另外切換時是否需要某種權限？避免誤操作
• 不同系統間的版本差異

5. 硬件調用

• 場景：藍牙、定位、相機、話筒、存儲
• 是否需要獲取權限？獲取那些權限？
• 提示如何觸發？（被動、主動）
• 調用狀態是否需要實時顯示？

6. 硬件聯動

• 告訴用戶接下來的操作需要與硬件進行聯動、連接，并提供入口
• 連接過程中需要進行的操作？分步or單頁or彈窗
• 連接狀態如何？如何取消聯動？

五、加載

1. 加載類型

全屏加載

• 一次性加載完所有數據后再顯示內容

占位符加載

• 先加載框架，再加載框架內的內容
• 提前讓用戶知道整個界面的架構
• 降低用戶的等待感

上拉加載

• 手勢上拉，信息自動加載
• 加載形式：文字？icon？文字&icon
• 加載完成后是否需要提示？是否需要提示具體加載的結果？
• 每次加載多少？加載到最后時如何提示？

下拉加載

• 下拉后，整個頁面重新加載刷新
• 加載形式：文字？icon？文字&icon？進度條？
• 刷新后是否需要提示？是否需要提示具體加載的結果？

局部加載

• 無需整頁加載，僅局部進行加載

智能加載

• 判斷當前網絡環境，如網絡較差，耗流量內容通過占位符展示，等網絡變好后重新加載
• 判斷當前網絡環境，如為蜂窩網絡，顯示占位符，如為wifi，直接加載內容，幫助用戶節省流量

2. 加載節點

加載前

• 確定加載策略，如上劃至某個位置觸發加載、上劃至底部觸發加載、點擊按鈕觸發加載等
• 確定提示文案

加載中

• 提示形式：純文字、文字+icon、純icon

加載后

• 加載結束后是否需要提示？
• 如進行提示，是否需要對具體加載數進行說明？
• 提示位置

六、中斷

1. 沒有電

• 電量恢復后，是否支持恢復關機前相關頁面？
• 是否需要對頁面非正常關閉進行說明？
• 對未完成任務進行告知，提供快捷操作

2. 低電量

• 如當前功能對電量有一定要求，為保證體驗效果，提醒用戶及時充電
• 如有低電量模式服務，需要確定模式轉化策略，什么情況變為低電量模式，什么時候取消？
• 低電量模式下，如何展示模式狀態
• 是否支持設置服務自動關閉，避免手機電量過度消耗

3. 加載失敗

• 加載失敗的原因是什么？提示文案是什么？
• 盡可能提供重試的操作

4. 服務器異常

• 確定提示形式，彈窗or頁面
• 如為頁面提示，則提供刷新操作或回到首頁/上一步等

5. 安裝/下載/發布/連接等失敗

• 確定提示文案
• 確定提示形式
• 不要中斷用戶體驗，提供相應的跳轉操作

七、特殊

1. 深色模式

• 梳理現有內容類型，確定顯示策略，如降低信息與背景的對比度，對圖片/圖標進行遮罩
• 模式間如何切換？是否支持用戶設置？跟隨系統or手動選擇

2. 沉浸模式

• 需要用戶長時間聚焦瀏覽的信息，為了保障信息呈現的效率、效果，考慮是否提供沉浸模式選項
• 確定進入沉浸模式的策略，手動選擇or系統自動
• 是否需要提示用戶如何退出？
• 進入/退出如何平滑過渡？

3. 存在廣告屏蔽插件

• 判斷當前產品是否以廣告作為主要收入來源，如果是，則要針對AdBlock等廣告屏蔽插件設計相應的提示策略

八、操作

1. 輸入

• 是否存在提示文案或默認值
• 如何處理不同輸入狀態，輸入前、輸入中、輸入后、輸入正確、輸入錯誤、未填寫
• 是否需要進行輸入提示
• 確定鍵盤調起策略，自動觸發輸入后彈出or手動觸發輸入后彈出
• 如何處理鍵盤對內容的遮擋
• 輸入內容是否需要保存？保存策略？

2. 點擊

• 如何處理不同點擊狀態，默認、hover、點擊、禁用、加載中
• 基于不同的作用，確定不同的按鈕樣式

3. 反復點擊/惡意操作

• 為確保產品安全，確定防刷機制
• 判斷哪些操作需要？如驗證碼、下單等反復提交
• 什么情況下進行限制？如控制點擊次數、提交次數、點擊日期等
• 如何進行提示？頁面提示、toast提示等

4. 誤操作

• 如果用戶誤操作會導致一定后果，則需要考慮如何避免誤操作
• 提升操作成本，該方式需要慎重考慮，但仍然適用于某些“危險”場景
• 進行二次確認
• 用戶實時錄入的內容進行自動保存，避免丟失
• 支持撤銷操作

九、限制

1. 極值

• 最大、最小、最多、最少等極值范圍如何提示？
• 極限情況下的內容如何展示？
• 達到極值時是否需要進行提示？

2. 邊界

• 判斷產品與用戶的互動過程是否存在邊界限制？
• 邊界如何提示或引導？
• 超過顯示邊界時如何處理？

3. 時間

• 時間要素是否存在限制，如何提示？
• 是否需要設置默認時間，最新or從零開始or中間值
• 是否需要預判用戶所選時間的合理性，并進行提示

4. 地域

• 服務范圍是否存在地域限制，如何告知？
• 當前位置是否在服務范圍內，如果不在，如何提示？

以上就是九大類交互狀態以及延伸出的38個狀態細節，希望這份清單能為大家提供一些有價值的設計參考。其中每個狀態下的設計思考點想到哪里就寫到哪里，肯定是有遺漏的。這有待于大家深入設計場景，真實的去感受，通過不斷的設計實踐，形成完善的思考邏輯和應對策略。