關(guān)于表單中的二次確認(rèn)設(shè)計(jì)思考

1 評(píng)論 5665 瀏覽 32 收藏 11 分鐘

表單常存在于流程之中,用戶通過填寫表單提交先關(guān)信息,從而完成相關(guān)的任務(wù),如注冊(cè)、申請(qǐng)等。本次主要分享在表單提交時(shí),表單提交時(shí)的二次確認(rèn)場(chǎng)景。

為什么會(huì)有二次確認(rèn)?

表單往往匯聚了各種輸入項(xiàng),信息量較大,若用戶完成輸入后直接提交,往往存在一定風(fēng)險(xiǎn),即一旦出現(xiàn)誤填時(shí),一般情況下,只能撤回或重新填寫并提交,與此同時(shí)也可能造成后臺(tái)的審核壓力。

為了應(yīng)對(duì)這種情況,在填寫表單時(shí),一般會(huì)引入前置校驗(yàn)(前端or后端),盡量減少錯(cuò)誤,但這一類的校驗(yàn)適用于校驗(yàn)條件能夠結(jié)構(gòu)化的,即可以通過代碼預(yù)先設(shè)置好有一定規(guī)律組織的條件,比如非空、大小寫、上下限值等,而無法去判斷一些不能條件化(非結(jié)構(gòu)化)的情況,如圖片內(nèi)容、文字表達(dá)等。這些內(nèi)容往往需要后臺(tái)審核才能發(fā)現(xiàn)問題,從而增加后臺(tái)審核的壓力,也導(dǎo)致用戶可能填寫無效,需重新提交的可能。

因此在這種情況下,會(huì)考慮在用戶提交時(shí)增加二次確認(rèn)的步驟,從用戶維度去主動(dòng)減少誤操作、誤填的情況,從而降低后續(xù)返工和溝通。

二次確認(rèn)的利弊

對(duì)于流程性的頁面來講,保證流程的暢通和讓用戶持續(xù)處于心流狀態(tài)是產(chǎn)品和設(shè)計(jì)所追求的理想狀態(tài)。但在實(shí)際的設(shè)計(jì)中,不能只圖短期的或某個(gè)環(huán)節(jié)的一時(shí)方便,更需要站在整個(gè)體驗(yàn)流程之上,閉環(huán)思考。二次確認(rèn)就是一個(gè)矛與盾的結(jié)合體。

從體驗(yàn)角度講,表單填寫的效率和流暢性是首要關(guān)心的點(diǎn),因?yàn)楸韱伪旧韺儆谳斎胄缘哪K,用戶需要付出相應(yīng)時(shí)間和行為成本,特別是當(dāng)用戶處于一個(gè)希望盡快提交的場(chǎng)景時(shí),如秒殺等,若此時(shí)需要用戶二次確認(rèn)進(jìn)行打斷,體驗(yàn)以及給用戶帶來的糟糕情緒可想而知。

另一方面,從產(chǎn)品的角度來看,二次確認(rèn)也是影響轉(zhuǎn)化的潛在因素之一,為提升轉(zhuǎn)化率,理想狀態(tài)是一步走到底,中間不存在任何打斷。

但正如開始所講,實(shí)際的設(shè)計(jì)不能只用理想狀態(tài)去考慮,而應(yīng)從實(shí)際場(chǎng)景出發(fā),站在整個(gè)體驗(yàn)流程去思考,這里的體驗(yàn)流程不單單指階段性的用戶前端頁面,也包括表單提交之后的后臺(tái)扭轉(zhuǎn)以及最后提交結(jié)果的呈現(xiàn)(實(shí)時(shí)/異步),如成功、失敗還是需要打回重填等。

同時(shí),還需要考慮表單的業(yè)務(wù)屬性,例如某些審核性的表單,所填內(nèi)容會(huì)影響審核結(jié)果,此時(shí)從業(yè)務(wù)審核層面會(huì)考慮讓用戶主動(dòng)去確認(rèn)輸入的內(nèi)容并對(duì)其負(fù)責(zé),以減少審核不良率或后續(xù)不必要的溝通。

何時(shí)會(huì)用到二次確認(rèn)?

雖然提交表單存在一定的風(fēng)險(xiǎn),但并不是所有表單提交時(shí)都需要去二次確認(rèn),因?yàn)檫@關(guān)乎到效率或者產(chǎn)品轉(zhuǎn)化率,從體驗(yàn)層面和產(chǎn)品層面來講,應(yīng)用二次確認(rèn)往往慎之又慎,通常以下情況可以不考慮二次確認(rèn):

  • 表單內(nèi)容只用于對(duì)外展示,并可在本地再次修改或撤回,如社交應(yīng)用中的個(gè)人信息、發(fā)表觀點(diǎn)看法等;
  • 影響到轉(zhuǎn)化率時(shí),例如各種訂單的提交(輸入密碼除外)等,常見于c端電商交易、打車場(chǎng)景等;
  • 能夠完全通過完善的校驗(yàn)去規(guī)避錯(cuò)誤的表單,而這與輸入的內(nèi)容有關(guān),即輸入內(nèi)容可結(jié)構(gòu)化校驗(yàn),如字?jǐn)?shù)、圖片大小、金額大小等;
  • 后臺(tái)對(duì)提交內(nèi)容無要求,只要填寫即可,如各種問卷類表單等。

以上情況,往往不會(huì)在提交表單時(shí)進(jìn)行二次確認(rèn)。其對(duì)應(yīng)的核心邏輯是用戶能即可作出修改或轉(zhuǎn)化率優(yōu)先。

而在某些情況下,提交表單時(shí)則需要考慮二次確認(rèn),這類表單往往需要用戶承擔(dān)提交后的結(jié)果,或規(guī)避業(yè)務(wù)風(fēng)險(xiǎn)(審核和后續(xù)溝通成本)。這里結(jié)合常見的場(chǎng)景,給出可以考慮采用二次確認(rèn)的情況(非必須,視實(shí)際項(xiàng)目而定):

  • 提交內(nèi)容需后臺(tái)審核,并非單一的校驗(yàn)可解決,且內(nèi)容相對(duì)較多,如某些資格申請(qǐng)類表單往往存在預(yù)覽環(huán)節(jié);
  • 某些需要降低后臺(tái)審核不良率的情況,或以人工審核為主,此時(shí)需要減少審核不通過,打回重填或補(bǔ)填的情況。

二次確認(rèn)的設(shè)計(jì)形式

目前常見的二次確認(rèn)設(shè)計(jì)形式按照輕重程度分為兩種:一種是以預(yù)覽模式呈現(xiàn)的重度交互形式;一種是以對(duì)話框模式呈現(xiàn)的相對(duì)輕度的交互形式。

預(yù)覽模式:

預(yù)覽模式一般是在用戶填寫完表單提交前,讓用戶對(duì)所填內(nèi)容能夠有一次整體完整的瀏覽機(jī)會(huì)。該交互形態(tài)在一些招聘網(wǎng)站或者機(jī)構(gòu)的個(gè)人履歷表單填寫流程中往往較為常見,由于涉及到填寫內(nèi)容多,且表單內(nèi)容關(guān)系到用戶切實(shí)利益,用戶對(duì)其準(zhǔn)確性要求高,因此會(huì)讓用戶能夠盡量完美的呈現(xiàn)自己,查漏補(bǔ)缺。同時(shí),預(yù)覽模式所涉及的表單內(nèi)容也更多。

對(duì)話框模式:

相較于預(yù)覽模式,對(duì)話框形式的二次確認(rèn)要輕量很多,當(dāng)仍然是以模態(tài)出現(xiàn),也會(huì)對(duì)流程造成打斷。采用對(duì)話框形態(tài)的表單場(chǎng)景,相較于預(yù)覽,內(nèi)容會(huì)相對(duì)少很多,但所涉及的內(nèi)容仍然對(duì)用戶至關(guān)重要,且難以撤銷或修改;另一方面,也避免用戶誤操作。

需要注意的是,從用戶主動(dòng)性上講,預(yù)覽模式一定程度上反應(yīng)了用戶的主動(dòng)傾向,即這種模式某種程度上迎合了用戶的審慎態(tài)度,而對(duì)話框則偏向被動(dòng),即用戶并非潛在期望這種打斷。雖然表面上能夠防止誤操作,但模態(tài)的形式讓用戶產(chǎn)生割裂感,對(duì)話框無法與頁面內(nèi)容直接聯(lián)系起來,從而造成了體驗(yàn)中斷。

進(jìn)一步,我們對(duì)對(duì)話框的交互邏輯進(jìn)行分析,用戶在對(duì)話框上的行為路徑如下:

通過該行為路徑,我們可以很容易的發(fā)現(xiàn),當(dāng)用戶在放棄第一次直接提交,在檢查完畢進(jìn)行第二次提交時(shí),仍然需要作出判斷,并付出相應(yīng)的行為。

結(jié)合實(shí)際項(xiàng)目發(fā)現(xiàn),7成以上用戶在第一次點(diǎn)擊提交時(shí),就直接確認(rèn)提交走掉了;而剩下決定檢查一下的用戶,在第二次點(diǎn)擊提交時(shí),九成以上的用戶不再檢查,直接提交。

從以上的分析可以看出,對(duì)話框只是一味地進(jìn)行機(jī)械的邏輯判斷,認(rèn)為用戶每次點(diǎn)擊提交時(shí)檢查和提交之間的概率是等同的,而忽略了隨著檢查的進(jìn)行,用戶直接提交的概率在不斷增加,即概率是變化的,而這種設(shè)計(jì)邏輯的背后缺乏對(duì)人的思維和心理的考量。

基于這種情況,可以對(duì)該行為路徑進(jìn)行優(yōu)化,即在滿足需要檢查一下的場(chǎng)景下,提升表單提交的整體效率與體驗(yàn):

頁面交互如下:

通過優(yōu)化,用戶點(diǎn)擊提交后,配合動(dòng)效,按鈕向中間收縮,并在按鈕上方提示用戶是否需要檢查,以降低二次確認(rèn)對(duì)話框帶來的打斷,以及避免了二次提交帶來的對(duì)話框反復(fù)提示的問題。而這一設(shè)計(jì)的優(yōu)勢(shì)在于增加了用戶主動(dòng)權(quán),將反復(fù)被動(dòng)的打斷,轉(zhuǎn)化成用戶主動(dòng)的選擇,其本質(zhì)在于能夠從人的角度出發(fā),將用戶的行為特征考慮在內(nèi)。

寫在最后

本次分享主要討論表單提交時(shí)二次確認(rèn)的相關(guān)問題,從效率與體驗(yàn)角度對(duì)二次確認(rèn)交互形式進(jìn)行探索和嘗試。但在實(shí)際的項(xiàng)目中,產(chǎn)品經(jīng)理、設(shè)計(jì)師仍然需要結(jié)合所處的具體場(chǎng)景和業(yè)務(wù)特點(diǎn)對(duì)其進(jìn)行設(shè)計(jì)。

 

本文由 @像素先生 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載

題圖來自Unsplash,基于CC0協(xié)議

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 學(xué)到了,感謝大佬

    來自北京 回復(fù)