B 類產(chǎn)品通常涉及一系列抽象/具象事物的流轉(zhuǎn)、變化，如一個任務(wù)的執(zhí)行、一家商家的入駐等等，這些過程均涉及規(guī)范的流程，流程的不同階段涉及不同的狀態(tài)，不同的狀態(tài)又對應(yīng)不同的角色和具體操作（如下圖）。因此流程狀態(tài)的設(shè)計必不可少，且必須清晰易懂、簡潔直接。
除了流程狀態(tài)之外，還有一種 B 類產(chǎn)品中常見的狀態(tài)，就是生命周期狀態(tài)，例如營銷推廣的推廣組狀態(tài)可分為「推廣中」、「已下線」等等。在很多產(chǎn)品中，生命周期與關(guān)鍵流程有緊密的聯(lián)系，兩種類型的狀態(tài)會有一定交叉。本文主要討論的是流程狀態(tài)。
流程狀態(tài)的設(shè)計原則與人機(jī)交互的最根本原則一致，即「以用戶為中心」，確保目標(biāo)用戶在相應(yīng)的使用場景下能夠快速理解并正確執(zhí)行相關(guān)操作。
1. 按行業(yè)規(guī)則命名
專業(yè)工具或平臺的設(shè)計中，對于狀態(tài)的命名如果有行業(yè)約定俗成的術(shù)語，則遵照行業(yè)規(guī)則命名，即便在體驗設(shè)計師自己眼中可能不夠簡潔美好。
例如：以工程師為主要用戶群體的項目管理工具 Aone 中，bug 的狀態(tài)有 10 種（如下圖），且遵循了英文技術(shù)術(shù)語。對于設(shè)計師來說狀態(tài)種類復(fù)雜、語言不統(tǒng)一，但從用戶的角度來說這樣是必須的、規(guī)范的，因此設(shè)計師要尊重用戶的習(xí)慣和需求。
2. 圍繞核心操作命名
流程的名稱通常是描述對應(yīng)操作的過程或結(jié)果，如「待付款」、「退款中」是操作的過程，「完成付款」、「退款失敗」是操作的結(jié)果。
單個核心操作
最簡單、最常見的流程是：角色 A 發(fā)起流程 – 角色 B 進(jìn)行操作 – 流程結(jié)束給出結(jié)果
這種兩個角色三步走的流程，狀態(tài)命名通常分為如下兩種（框中是狀態(tài)命名）：
↑上圖里面的動詞可替換成其他動作；結(jié)果狀態(tài)也可用「已通過」、「未通過」等，根據(jù)實際情況而定。
圍繞一個核心的操作，也可能涉及多個角色。
例如：最常見的審批流程，過程中涉及多個角色的層層審批。如果不同角色審批時，用戶可執(zhí)行的操作不同，或?qū)徟脑敿?xì)過程對用戶非常關(guān)鍵，這時審批單的狀態(tài)命名上需要注明具體角色；如果通常不需要關(guān)注具體到哪個人審批了，則統(tǒng)一稱為「審批中」即可，用戶可以到詳情頁面查看具體進(jìn)度。
多個核心操作
涉及多個角色、一串核心操作的復(fù)雜流程。
在流程完成之前的中間過程中，告知用戶下一步待執(zhí)行的操作，比上一步剛剛完成哪個更重要；
在角色多、極易混淆的情況下建議在狀態(tài)名上增加角色名。
例如：數(shù)字倉單的倉單質(zhì)押流程中涉及三個角色（存貨人、倉儲方、資金方）多個步驟，過程中關(guān)鍵是引導(dǎo)用戶繼續(xù)后續(xù)操作、高效完成申請，所以狀態(tài)上展示當(dāng)前要進(jìn)行的操作。同時流程中包含連續(xù)多個角色的接力審核確認(rèn)，容易混淆，因此狀態(tài)標(biāo)簽中顯示當(dāng)前需要哪個角色進(jìn)行操作；而放款、收款的角色很明顯是資金方和申請方來操作，所以對應(yīng)的狀態(tài)沒有顯示角色名稱。如圖：
同一階段時，不建議區(qū)分不同用戶角色看到的狀態(tài)名，可以給他們不同的反饋或提醒。
狀態(tài)組間存在一對多的映射關(guān)系時，要注意區(qū)分邏輯關(guān)系，不建議將上下層狀態(tài)打平到一起。
接上面數(shù)字倉單的案例：系統(tǒng)中，貨物的所有者可以用倉單進(jìn)行質(zhì)押，這樣倉單就會有「未質(zhì)押」、「質(zhì)押申請中」和「質(zhì)押中」?fàn)顟B(tài)（不允許重復(fù)質(zhì)押）。而質(zhì)押申請是個復(fù)雜的流程，「質(zhì)押申請中」這一倉單狀態(tài)，對應(yīng)「質(zhì)押申請單」的一系列流程狀態(tài)。同理，在倉單解除質(zhì)押、注銷等其它情況下，又會有「解質(zhì)流程中」、「注銷中」等狀態(tài)，對應(yīng)的「解除質(zhì)押流程」、「注銷流程」有會一系列對應(yīng)的狀態(tài)。如圖：
這種情況下要梳理好業(yè)務(wù)流程，如果將上下層狀態(tài)打平到一起，短期內(nèi)可能看起來比較簡潔，但隨著產(chǎn)品復(fù)雜度的提升（B 類產(chǎn)品通常會越來越復(fù)雜），邏輯關(guān)系會越來越混亂。
1. 狀態(tài)的顏色
表示狀態(tài)的顏色不建議超過 5 種：紅色、橙色、綠色、藍(lán)色、灰色。
設(shè)計師需要結(jié)合色彩的功能特性、品牌色板、產(chǎn)品邏輯、用戶需求來選擇適合的顏色。常用配色舉例：
狀態(tài)的顏色不止會用在標(biāo)簽上，對應(yīng)的可視化圖表、圖標(biāo)等視覺元素要用色一致。例如進(jìn)度條：
2. 狀態(tài)標(biāo)簽的樣式
不同狀態(tài)對應(yīng)不同用戶的不同操作，因此狀態(tài)信息通常與普通文本在視覺上有所區(qū)分。常用的樣式包括彩色標(biāo)簽、彩色圓點等等。例如：
注意列表、表單中狀態(tài)標(biāo)簽的樣式統(tǒng)一。
原則：流程狀態(tài)的設(shè)計原則與人機(jī)交互的最根本原則一致：以用戶為中心。
命名：
- 在流程完成之前的中間過程中，告知用戶下一步待執(zhí)行的操作，比上一步剛剛完成哪個更重要；
- 在角色多、極易混淆的情況下建議在狀態(tài)名上增加角色名；
- 同一階段時，不建議區(qū)分不同用戶角色看到的狀態(tài)名，可以給他們不同的反饋或提醒。
- 專業(yè)工具或平臺中，如果有行業(yè)約定俗成的術(shù)語來命名狀態(tài)，則遵照行業(yè)規(guī)則。
關(guān)系：狀態(tài)組間存在一對多的映射關(guān)系時，不要將上下層狀態(tài)打平到一起。
顏色：表示狀態(tài)的顏色不建議超過「紅色、橙色、綠色、藍(lán)色、灰色」這 5 種。
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任，
本站有權(quán)保留或刪除有爭議評論。
參與本評論即表明您已經(jīng)閱讀并接受
上述條款。