編輯導讀:在填問卷或者使用產品的時候,為了避免一些無法預計的系統錯誤和損失,系統在用戶提交空值或不符合系統規則的數據時,會禁止用戶某些操作,達到預防“慘案”發生的效果。本文作者圍繞禁用功能,談談它的設計,希望對你有幫助。
不知道大家在使用產品的時候,有沒有碰到過,明明是可以點擊的按鈕,但怎么點擊都沒有反應,然后就一直停在那個頁面什么都做不了,如下圖:
頁面的內容都已填寫完整,但點擊“下一步(預覽)”時就是沒反應;
之后向上翻看了一下,發現還有兩個必填項沒有填寫;其實點擊“下一步(預覽)”時輸入框有提示,但因為沒有翻到有提示語的頁面,用戶以為沒有反應,會感到困惑。
那這種情況產品要如何處理呢?我覺得有以下兩種方案:
方案一:必填項未填寫完整時,“下一步(預覽)”按鈕禁用/隱藏;
只有在必填項都填寫完整時,才會將按鈕變成可點擊的狀態;這種方案的好處是可以避免用戶誤觸沒有效果的按鈕;
但需要注意的是,有可能用戶一直無法將按鈕變成可點擊的狀態,讓用戶感到迷茫,所以在用戶點擊禁用按鈕時,要給出提示語,引導用戶繼續操作;
方案二:“下一步(預覽)”按鈕一直保持可點擊的狀態,當有必填項未填時,點擊按鈕在當前頁給出提示,或定位到有問題的頁面;
只有在必填項都填寫完整時,點擊按鈕才會進入下一步;這種方案的好處是用戶做出動作后都能及時收到反饋,系統業務流程清晰;
兩種方案都能幫助用戶達成目的,但是第二種方案對用戶來說,體驗更好,流程更清晰;在需要引導用戶完成既定流程時,直接展示可操作按鈕比禁用的方案更好。
一、禁用功能
禁用,為了避免一些無法預計的系統錯誤和損失,系統在用戶提交空值或不符合系統規則的數據時,會禁止用戶某些操作,達到預防“慘案”發生的效果;通常以禁用,隱藏的形式呈現;
以表單填寫為例,為了避免用戶轉錯賬戶,導致雙方損失財產,系統在用戶沒有按規則填寫銀行卡持有人和銀行卡號時,會禁止操作下一步,即使填寫了也需要校驗成功后才會進行轉賬,達到提前阻止問題發生;
來看幾個常見的實際案例吧,想必大家都有發過短信,但有沒有注意過發送按鈕的狀態變化呢?什么時候不能發送,什么時候能發送,為什么要這樣處理?
IOS系統短信功能:
在沒有輸入任何內容和只輸入了短信的時候,發送按鈕是禁用的,說明目前還不能發送短信;當只輸入收件人時,發送按鈕變成了可點擊的狀態,但實際點擊是沒有反應的;
安卓系統短信功能:
與ios系統不同的是,在只輸入收件人時,發送按鈕仍是禁用狀態;反之,只輸入短信內容時,發送按鈕是可點擊狀態,點擊后會提示“請添加收件人”;
不同的系統收發短信的流程都是一樣,由A編輯短信,通過通訊基站B,讓C收到短信;
假設,有收件人手機號碼,但是短信內容為空,那么A會發送短信,C會接收到一條內容為空的短信;
假設,沒有收件人手機號碼,那么A會發送短信,B會接收到短信,但C不會接收到短信;
A->B->C 以及 a->b 這兩個過程都會耗費網絡資源和服務器資源,當他是單個個體存在時,耗費的資源幾乎可以忽略不計,但以億為單位去推測累計一年所耗費的資源時,就無法忽視了;
根據工信部最新發布的數據顯示,截至4月末,三家基礎電信企業的移動電話用戶總數達15.9億戶,2020年1-12月短信業務量總計17796億條,平均每秒鐘同時發送5萬條,如果大家都發送沒有手機號碼的短信,將浪費大量的網絡資源和服務器資源,如果有人惡意發送大量沒有手機號碼的短信,甚至導致服務器宕機,所有人都無法正常使用短信功能;
為了避免網絡資源和服務器資源浪費,甚至服務器的宕機,系統在用戶沒有填寫收件人手機號碼時,會禁止發送短信,即使不同的系統使用不同的解決方案,都是達到預防“慘案”發生的效果。
二、禁用功能的注意事項
1)禁用狀態需與正常狀態明顯區分
禁用狀態,是為了讓用戶知道這里是不可點擊的,將操作按鈕的存在感處理得很低,達到減少用戶點擊的效果,一般以置灰的形式呈現;
正常狀態,為了引導用戶完成系統內操作,系統會吸引用戶去點擊,達到指引的效果一般用醒目的顏色,跳動或其他能吸引用戶實現的形式呈現;
當禁用狀態和正常狀態區分時,用戶能清楚的知道什么時候是可以點擊的,什么時候不可以點擊;
如果系統里的所有操作按鈕都只有一種狀態時,用戶在點擊每一個按鈕時,都像是在拆盲盒,短時間可能是驚喜,但時間長了只會覺得茫然無措,甚至有些疲憊,永遠都不知道點擊了按鈕會有什么結果,什么時候應該點,什么時候不應該點。這時系統如果增加了沒有結果時的狀態,用戶多次點擊無果后,漸漸就會知道點擊這種狀態的按鈕是沒有用,也就會減少點擊次數;
上圖是一個WPS編輯文檔的功能界面,對于用戶來說,編輯文檔是連續的動作,使用的功能也是差不多的,如果因為當前該功能無法使用就隱藏的話,會讓用戶感到不穩定,尤其是剛剛還能看到那個功能,突然一下就找不到的情況,這時建議系統不更改功能展示的位置,只區分功能的可用狀態;
如上圖,為了減少用戶的困擾,禁用狀態與正常狀態應保持在相同的位置,同時做明顯的顏色區分,讓用戶一眼就能辨認能不能使用該功能。
2)點擊禁用功能時給出反饋
禁用功能的反饋,目的是避免用戶使用禁用功能時,有系統無響應的感知;
由于功能已經被禁用了,當用戶執行操作時,就無法執行正常的跳轉,或者一些變化,此時,用戶并不能直觀判斷出功能被禁用,因此會默認定義為程序出問題了,系統出故障了;
所以,禁用功能的反饋,是為了避免用戶歸責于產品BUG,對產品產生負面情緒,同時也是為了給到操作指引,避免用戶不知道該如何處理。
編輯表單后提交信息,有時部分內容忘了填寫就提交,系統會給出提交失敗的原因,或引導用戶進入下一步;如上圖,在用戶沒有填寫銀行卡號卻點擊了下一步時,系統給出能完成表單提交的提示,同時提示語簡潔,準確,能讓用戶快速了解如何做才能完成表單的提交。
三、總結
再來復習一下,禁用,是為了避免一些無法預計的系統錯誤和損失,禁止用戶某些操作,達到預防“慘案”發生的效果;
那么在決定使用禁用功能之前,一定要想清楚這個禁用功能是為了避免什么錯誤和損失,當前的禁用方案能否達到效果;
同時,要考慮禁用功能的反饋,避免用戶使用禁用功能時,有系統無響應的感知,覺得系統出故障了;
在考慮解決方案時,不僅要考慮能否達到預期效果,還要考慮用戶體驗。
本文由 @噠噠臨 原創發布于人人都是產品經理,未經作者許可,禁止轉載。
題圖來自Unsplash,基于CC0協議。