B端產品在異常狀態下的設計思考

2021-02-24 伯安郡

本篇文章 3486字 | 估計閱讀 10分鐘

近期個人跟進的一個產品被用戶提了意見:每次進入頁面的時候,頁面空白,什麼信息都沒有,跟故障了沒有數據一樣。

詳細了解情況後,發現確實是出現了異常。這是一款查詢類工具產品,進入頁面已有基礎的默認查詢條件及相應數據展示,本身需要用戶具有相應的權限才能進行查詢,前述用戶反饋的問題,就是因為帳號沒有相應頁面功能的數據權限導致的。

遺漏了用戶在異常狀態下的設計,會導致用戶在每一次的操作後,產品界面一直沒有任何反饋,業務流程中斷,停滯不前,然後用戶心中會產生疑問:怎麼回事?但又無人解答。

一次次地復現後,則會產生相同的結論:這個東西沒法兒用,我的需求,你無法滿足。在一次次的失望,放棄這款產品,不再使用。而這僅僅是因為我們沒有對異常狀態做好一個合理反饋/引導。

正常情況下,產品經理應該定義清楚,在諸如網絡異常、用戶無權限等異常狀態下,產品應該如何提示用戶,幫助用戶恢復正軌。

如上述例子中,可以在界面提示用戶帳號權限不足,請聯繫管理員,或給到技術支持電話,通過人工介入的形式,使無助的用戶能快速獲得幫助。

當然這個意見,也暴露出之前團隊只專注於主操作流程、主頁面的不同狀態,卻忽略產品中容易出現的各種異常狀態的問題,這是一個不容忽視的問題。

對於以提升效率為目的的B端產品而言,缺乏對異常狀態的反饋設計,會導致用戶遭遇某種異常情況時,不清楚發生了什麼事,長時間停留在原地,無法快速定位到問題,最終導致業務處理的效率低下。如果一直保持現狀,長此以往,就算上線了很多功能,對用戶而言這些功能也是無效的的。

異常是正常的相對概念,漢典中,解釋正常是符合一般的情況、規律或習慣。

對於產品而言,正常狀態是指在產品使用過程中,交互反饋結果符合業務流程/交互邏輯/用戶預期的狀態;反之,不符合業務流程/交互邏輯/用戶預期時,是異常狀態。

例如,我們在百度搜索「正常」兩個字,頁面返回的第一個結果是有關「正常」的百度百科,此時是正常狀態;如果頁面一直是空白,或者頁面返回的第一個結果是有關「異常」的百度百科,此時是異常狀態。

異常狀態,是由於在程序運行過程中發生外部問題導致的,在用戶操作-反饋的過程中,可能會被多種外部因素幹擾而產生異常。

例如:網絡環境因素中最常見的網絡連接失敗,網絡連接失敗會直接導致導致無法上傳和下載數據,它們會出其不意地發生,並影響任何一個環節。

因為外部因素的產生是不可控的,因此異常狀態的發生也是不可控的。

有些異常我們可以通過技術手段避免,但產品使用時的外部環境因素是我們無法控制的,所以我們始終無法避免異常狀態的發生,那麼就應該提前考慮可能發生的異常因素及結果狀態。

結合場景針對性地設計反饋,在前端可感知地告訴給用戶,引導用戶理解自己所在頁面的狀態及可以怎麼做,而不是讓用戶怎麼操作都沒有反饋,不知道發生了什麼問題,業務流程中斷,進一步導致用戶焦慮,最後拋棄產品。

依舊以上文中因權限不足導致的頁面空數據為例,對於這類依賴權限系統配置的因素我們無法控制,所以應該提前考慮在用戶權限不足的情況下,讓用戶意識到當前頁面空數據是因為權限不足導致的,可以去聯繫管理員授權,或者返回上一層頁面,讓用戶儘快離開當前功能;

而不是像原有產品設計一樣什麼都不反饋,讓用戶以為是系統故障導致的頁面空白,最後憤怒地找到我投訴產品無法使用。

設計的最終目的是讓產品更可用、更易用,針對異常狀態的設計也是如此。

發生異常時,為了避免用戶不明所以,讓用戶更快地知道當前產品處於異常狀態,和產生異常的原因,降低用戶的焦慮感,在異常反饋的設計過程中,可以結合場景參考一些通用的用戶體驗設計原則。

以下是我常用的可以和異常狀態設計關聯的設計原則:

(1) 狀態可見原則

狀態可見,指的是通過界面反饋設計讓用戶清晰地知道當前系統的狀態,特別是讓用戶第一時間清楚地知道當前產品處於異常狀態。

正常來說,用戶對異常是沒有概念的,如果不明確地告訴用戶系統處於異常狀態,他們會以為是正常情況並持續等待結果,一直沒有結果可能會焦慮、暴躁,持續重複多次後操作發現還是不知道發生了什麼,就可能離開產品了。

因此在前端界面將系統狀態展示出來,不僅能讓用戶快速地了解自己處於何種狀態、對過去發生、當前目標有所了解,還能讓用戶快速判斷下一步該怎麼做,避免浪費用戶時間,而不是停留在原地等待,也能有效減少用戶的負面情緒。

例如下面這個案例,同樣是因為網絡緩慢導致的加載異常,在不具備狀態可見的左圖,用戶會持續等待進度條的加載,不知道加載了這麼久還沒加載出來的原因,不敢離開頁面因為不知道還要等多久;

但對於狀態可見的右圖,用戶明確知道頁面加載失敗了,雖然界面沒有給到加載失敗的原因,但用戶已經知道現在處於異常狀態,就不會浪費時間等待,會嘗試刷新或者直接離開頁面,也能有效避免用戶負面情緒的積聚。

(2)可退出原則

可退出,指的是在產品處於異常狀態時,給到用戶明確的出口可快速離開當前頁面。

對於諸如伺服器異常等原因導致的異常狀態,用戶是無法通過個人的重複操作恢復到業務正常狀態的,讓用戶在無法解決的異常頁面重複嘗試只會讓用戶積聚負面情緒,無法快速找到離開的出口甚至沒有離開頁面的出口,更是會讓用戶的情緒瞬間爆發。

因此,對於用戶自行無法解決的異常情況,與其讓用戶什麼都無法操作,或者做無謂的嘗試,還不如直接給到退出出口離開產品,這樣對用戶的情感傷害會更小一些。

例如下面的兩個例子,都是因為伺服器異常導致的異常狀態,致使產品無法使用,僅僅通過toast提示用戶異常原因,告知了就結束了,讓用戶停留在原地等待,無法進行其他操作,也沒有其他操作按鈕;

相比之下,明確以對話框的形式告知用戶伺服器異常,用戶在了解情況後點擊確認按鈕,即退出產品,這樣的形式信息展示明了,操作快捷,避免了用戶不知道怎麼離開當前異常的囧境,和負面情緒的積聚。

(3) 指引性原則

指引性原則,指的是針對一些操作可能會導致異常的情況,在用戶操作前,設計指引信息防止這類問題發生,或在用戶可能犯錯時提供提示信息,避免異常的發生。

產品設計過程中,有些正常操作可能會導致異常狀態,如用戶上傳文件時選擇的文件超出了系統限定的大小。

對於這種情況,作為產品設計者,我們不應該眼睜睜地看著用戶走到錯誤的那一步。

因為這樣會讓用戶不明所以,明明都是按照系統要求的步驟流程操作的,為什麼操作結果有時候成功有時候失敗,直到成功/失敗多次後,用戶才可能摸索出其中潛在的系統規則——文件大小不能超過xx,讓用戶在試錯中摸索系統規則,對於以提高業務效率的B端產品而言,是尤其不可取的。

所以,我們應該在設計過程中,注意到可能導致異常狀態的操作,並結合業務情況,設計反饋引導,甚至是對用戶的操作進行限制,以避免用戶試錯。

例如,下面的場景是用戶上傳文件時的界面,此處結合業務情況,對上傳文件有兩個要求:excel文件和5MB以內。從指引性原則出發,界面左下方告知用戶系統規則,在用戶選擇文件的過程中,是無法選擇非excel文件的,同時對於文件大小超過5MB的文件,也會以彈窗形式告知操作失敗,這樣能夠有效地避免用戶在正常業務流程進行無謂的試錯,保證業務效率。

(4)容錯原則

容錯原則,指的是當產品已經處於異常狀態時,給到用戶可以自行操作、糾正錯誤的操作功能,讓用戶能自主嘗試恢復回正常的業務軌道上。

在導致異常的因素中,有很多是短暫持續卻經常發生的,例如因網絡波動導致的加載異常,因為這類異常情況,是可以在短期內自動恢復的,重新操作後恢復正常狀態的概率較高,所以我們應該讓用戶自己嘗試解決,而不是建議離開,這樣可以將異常狀態對業務帶來的影響降到最低。在設計用戶的可操作功能時,也應該注意不要讓用戶進行過多的操作,重複異常發生之前的操作既可。

例如下面圖中是下載失敗的異常狀態,此時我們可以明確地告訴用戶上一次操作失敗了,並給到一個重新下載的按鈕,讓用戶不用重新選擇需要下載的文件既可再次嘗試下載操作,這樣就可以讓用戶繼續原有業務了。

以上是個人在實踐過程總結的適用於異常狀態設計的原則,希望這些原則可以在明知道會產生異常狀態但不知道如何設計時幫助到你,給你思路。

以上對異常狀態的設計原則進行了總結,相對正常狀態,異常狀態較為少見,容易忽略,但異常也是設計中的一部分。

無論是互動設計師還是視覺設計師都應該結合業務場景,給出異常的表現形式或處理方式,保證產品異常時不至於中斷任務的執行,對異常提供適當的引導,達到產品性能、業務流暢、防錯效果的平衡。

當然也有公司特殊的業務導致存在很特殊的異常狀態,歡迎大家一起溝通交流學習進步。

相關焦點

  • C端&B端產品的差異及設計思考
    文章針對B端產品和C端產品的差異展開分享,並分享了在做這兩類產品時的一些設計思考。雖然to B的產品越來越多,但市場上仍然是to C產品更普遍、更大行其道。畢竟C端產品面向的人群更廣泛,受眾面更大。而當下的設計師也多是從C端流動轉向去做B端產品的,所以今天,我想和大家聊一聊B端產品和C端產品的差異,以及在做這兩類產品時的一些設計思考。
  • 如何合理的設計B端產品經理的考核目標?
    在確定產品經理的考核目標之前,首先需要對B端產品進行分類,不同類別的B端產品性質完全不同,沒辦法一刀切的談論;另外,企業內部自研系統的B端產品經理,和SaaS產品經理,工作目標和方法也區別很大,需要分別探討。
  • B端產品的指標設計思路
    編輯導語:很多時候我們都是靠指標進行判斷,在B端產品中也是如此,指標可以幫助我們進行分析和推理,特別是對平臺和業務進行分析時可以用到;本文作者分享了關於B端產品的指標設計思路,我們一起來看一下。關於指標,我們都知道其作用在於將定性的事物轉換為可測量的數量,將解題的思路從語文變為數學。
  • B端產品心法(1):如何設計B端產品,且讓用戶願意用?
    雖然有兩次差點能在這個領域裡切出一個不亞於阿里的生態產業體系,也搞出過建築行業的像支付寶這樣的關鍵樞紐APP產品及能支撐其的後臺,ERP。所以,我的B端學生朋友們總是催我寫一篇關於如何做好B端產品設計的文章,希望能分享我在這行的思考。先,我認為優秀的B端產品人的視角應始於宏觀,行於微觀,而在產品設計中沒有什麼終結,只有業務的階段需求下的「適可而止」。
  • B端設計指南-06表格(下)
    標籤化:在將主次信息區分後,對次要信息進行標籤形式的處理,雖看上去是一個設計形式的轉變,但通常很多輔助信息都是內化為產品的特定狀態,可減少欄位頭部的內容寬度,同時便於產品形成一套自身產品的標籤體系。通常是一份Excel表格,裡面記錄了系統中所有欄位的常規寬度,前端可以根據寬度情況進行百分比的縮放,當然你也可以標註在設計稿中,方便前端進行開發,避免在文檔之間反覆橫跳。設計稿本身只需要展示一些簡單的邏輯,同時儘可能的考慮清楚不同角色、不同狀態下,你的設計稿所要呈現出的邏輯,方便在設計評審的與大家進行探討,同時可以出一個簡單的調研、分析的文檔,方便大家提前閱讀,更能清晰的明確業務、功能上的需求點。
  • 如何定義B端產品的MVP(下)
    要知道軟體的一個基本原則就是建立一套標準流程或者自動化的規則,如果線下處理極其靈活,很難將規則標準化,那麼這樣的功能是不太適合做成標準產品功能的,留一點標準的通用口子給到客戶,讓客戶線下處理,將數據輸入線上就可以了。
  • 聊聊C端轉型B端產品那些事
    全局考量,B端複雜的業務需要我們有大局觀,主要有以下幾個方面需要我們全面考慮:多角色考量、分支及異常流程考量、產品優勢與商業模式的思考、以及為未來做好準備;多角色需要我們清晰的了解組織架構,不同角色和權限的考慮,同時還要思考和其他團隊的合作,分清楚決策方和使用方等;
  • B端產品中,Web端表單如何設計
    編輯導語:B端產品往往由於業務體量龐大,導致信息複雜,同時對業務的精確性的要求很高;服務於B端的業務,不能夠出信息錯誤,填錯一個信息,就會引發巨大的問題。本文結合筆者自己的工作經驗,總結了大型B端業務中表單的設計方法,供小夥伴參考。
  • 談談B端業務系統的首頁設計|數據信息|b端產品|業務系統
    編輯導語:作為B端業務系統的產品經理,經常收到各類聚焦於具體功能點的業務需求,卻鮮有針對首頁的優化需求;但是當我們滿足了各類業務需求後,用戶仍會吐槽系統難用,老闆也認為對業務提效沒作用;本文是作者關於B端系統的設計分析,我們一起來看一下。
  • B端產品設計3大流程圖:業務流程圖、功能流程圖、頁面流程圖
    本文介紹了B端產品設計的三個流程圖:業務流程圖、功能流程圖、頁面流程圖,與大家分享!如何用產品支撐B端業務落地是一項非常有挑戰性的工作,要求產品經理既要有對宏觀的把控能力,又要有對細節的專注力。B端產品設計分為業務問題診斷、產品整體方案設計、產品細節方案設計幾個階段,在不同階段,我們需要藉助不同類型的流程圖來幫助我們理清思路。一、業務問題診斷:業務流程圖1.
  • B端產品設計3大流程業務流程圖、功能流程圖、頁面流程圖
    本文介紹了B端產品設計的三個流程圖:業務流程圖、功能流程圖、頁面流程圖,與大家分享!B端產品往往涉及複雜的業務關係和場景,線下業務一般會涉及到採購、銷售、物流、財務、人力、倉管等多個不同的部門和角色。如何用產品支撐B端業務落地是一項非常有挑戰性的工作,要求產品經理既要有對宏觀的把控能力,又要有對細節的專注力。B端產品設計分為業務問題診斷、產品整體方案設計、產品細節方案設計幾個階段,在不同階段,我們需要藉助不同類型的流程圖來幫助我們釐清思路。一、業務問題診斷:業務流程圖1.
  • B端產品面試技巧:業務調度設計的邏輯測驗及分析
    編輯導讀:為了提高我們的思維能力,需要有意識地觀察生活,並做一些產品思考。本文作者將以一道產品的筆試題為例,談談業務調度設計的邏輯測驗及分析,希望對你有幫助。個人一直覺得產品面試是一件非常有挑戰的事情,今天選擇從一個角度分享B端產品的面試技巧。
  • B端產品面試技巧:業務調度設計的邏輯測驗及分析
    編輯導讀:為了提高我們的思維能力,需要有意識地觀察生活,並做一些產品思考。本文作者將以一道產品的筆試題為例,談談業務調度設計的邏輯測驗及分析,希望對你有幫助。一棟樓內有N部互相關聯的電梯,當任一樓層內的用戶,按下呼叫鍵(上/下)後,系統對接載乘客需求的響應邏輯該如何設計,目標是讓電梯實現高效且合乎我們日常使用體驗。這個問題,通常情況下,請作為筆試題,並給候選人至少30分鐘以上思考時間。
  • 全面深度解析B端產品 | 教你如何從0到1設計B端產品的通用方法(下篇)
    編輯導語:上一篇文章《全面深度解析B端產品 | 教你如何從0到1設計B端產品的通用方法(上篇)》,分別從用戶、需求、業務、運營、產品、設計、思維和數據八大維度,較為全面地分析了B端和C端產品的差異,全面深度地解析了B端產品及其發展機會點;本篇文章將結合個人實際案例,繼續講解如何從0到1設計B端產品的通用設計方法
  • B端設計指南04——彈窗 究竟應該如何設計
    用戶經過十多年的網際網路產品的「培養」,使廣告彈窗變得五花八門,人們應對彈窗,也有了自己的一套方法,相信每一個人都有被彈窗噁心的時候。而彈窗作為人人唾棄的設計形式,卻在B端產品中擁有獨特的一面,看完文章希望你能理解B端產品的彈窗。
  • B端產品職場:如何擺脫「瞎忙」狀態,實現高效工作?
    作為B端產品經理,你是不是被各種業務需求壓得喘不過氣,常年996但是績效考核卻總是B?如何擺脫這種「瞎忙」狀態?本篇文章從CRM產品小C的職場故事出發,梳理了B端產品每天要「忙」的工作並分享了自己的思考與建議,希望對你有用。
  • 「產品分析」B端和C端產品設計有哪些差異?
    當然,想從C端設計快速切換到B端設計,或是從B端設計快速切換到C端設計並非易事。因為C端和B端產品設計存在較大的反差。其商業屬性、產品定位、目標用戶、設計表達、業務流程等都會有很大的不同。那麼今天這篇文章,我們就一起來聊聊B端和C端產品設計的差異性。
  • 深入B端SaaS產品設計核心理念
    某些大廠主推的協同產品,可能需要考慮下自己是否陷入「知識詛咒」,你對產品的定位是中小企業,但你看下自己產品是適用中小企業,還是你自身所在的大廠!角色畫像對B端產品設計非常重要,但C端的用戶畫像並不適用B端,B端角色畫像在個體層面更看中技能水平、崗位穩定性等,在角色層面看重該角色存在價值、上下遊角色、信息的接收處理和輸出等。
  • 從0到1,如何設計一套B端產品的「待辦」流程
    在上一篇文章中——《互動設計 | 先分解後聚合,「權限申請及審批」的產品閉環》,筆者講解了如何利用「先分解、後聚合」 的設計策略,完成「權限申請及審批」的產品閉環。同樣,在該項目中,「待辦」流程也可以採用相同的策略來開展設計,下文將詳細說明如何設計一套B端產品的「待辦」流程。
  • B端產品設計中,用戶體驗可能不是重點
    這就是B端產品,Business,即商業,幫助客戶實現戰略需求,從線下已有的運行業務進行信息化、系統化、高效的處理。B端產品基本模塊由用戶管理、權限管理、OA管理、CRM管理、營銷管理、訂單管理面、報表統計等組成,幾乎覆蓋B端客戶能應用的管理場景和運營場景。