支付產(chǎn)品設(shè)計(jì),為何不從“用戶安全感”入手?
設(shè)計(jì)一個(gè)產(chǎn)品不能停留在界面、布局、功能層面,而應(yīng)該要秉著“設(shè)計(jì)一個(gè)能夠給予用戶安全感的產(chǎn)品”的理念,去設(shè)計(jì)產(chǎn)品。筆者在本文中,從“用戶安全感”入手,講述如何設(shè)計(jì)一個(gè)讓用戶安心的,好的支付產(chǎn)品。
這是一篇關(guān)于錢(qián)包設(shè)計(jì)細(xì)節(jié)的稿子。
近期接觸金融產(chǎn)品相關(guān)的設(shè)計(jì),與其他項(xiàng)目不同的的是:在經(jīng)歷了布局的調(diào)整嘗試,功能業(yè)務(wù)的梳理之后,總是還有欠缺。
前段時(shí)間還看了各金融產(chǎn)品的一些設(shè)計(jì)師的設(shè)計(jì)思路,比如:samsung pay經(jīng)歷了1.0,2.0,3.0改版的前后經(jīng)歷。
(圖1 Samsung Pay改版)
后來(lái)陸續(xù)做了一些用戶調(diào)研和腦暴,才發(fā)現(xiàn):如果設(shè)計(jì)一個(gè)產(chǎn)品,如果只是停留在界面,布局,功能層面,很難深入了解產(chǎn)品以及這個(gè)產(chǎn)品所處的行業(yè)。
比如:金融領(lǐng)域的產(chǎn)品、理財(cái)產(chǎn)品、錢(qián)包產(chǎn)品,用戶使用它們,可能并不是因?yàn)樗每?,漂亮,而可能是因?yàn)樗档眯刨?,它可靠?/p>
那么,在設(shè)計(jì)層面,問(wèn)題就應(yīng)該從“如何設(shè)計(jì)一個(gè)好用的產(chǎn)品”轉(zhuǎn)化為“如何設(shè)計(jì)一個(gè)讓用戶安心的產(chǎn)品”。
當(dāng)然,金融產(chǎn)品的水可能很深,此文也僅僅是從一個(gè)細(xì)分領(lǐng)域出發(fā),嘗試去搜集有關(guān)于“安全感”的金融產(chǎn)品設(shè)計(jì),也希望借此了解更多同行業(yè)盆友們的見(jiàn)解。
更快的識(shí)別時(shí)間,更嚴(yán)密的密碼監(jiān)控,這些固然很安全,但技術(shù)是設(shè)計(jì)師不能控制的領(lǐng)域。不過(guò),我們至少還能做的是:讓這個(gè)產(chǎn)品看上去很安全。
安全感心理學(xué)
記得第一次去廈門(mén)的時(shí)候,坐了去鼓浪嶼的船,發(fā)現(xiàn)這個(gè)船竟然沒(méi)有座位的,拿著行李箱在船艙還會(huì)左右晃動(dòng)。
這時(shí)候我看到了這個(gè):
(圖2 鼓浪嶼船上的安全手把)
于是我很自然就過(guò)去抓住,松了一口氣。
我想這可能就是這個(gè)把手帶給我的安全感吧?
因?yàn)橄胩接懓踩羞@個(gè)主題,我查閱了不同領(lǐng)域的一些資料,包括:建筑領(lǐng)域,心理學(xué)領(lǐng)域和醫(yī)學(xué)領(lǐng)域。
總結(jié)出以下兩點(diǎn):
- 安全不等于安全感。
- 營(yíng)造安全的因素包括:心理安全,物理安全和社會(huì)安全。
安全感在金融產(chǎn)品中的體現(xiàn):心理安全,物理安全,環(huán)境安全。
從這三個(gè)角度出發(fā),我對(duì)于之前搜索的產(chǎn)品進(jìn)行了一些整理,具體的細(xì)節(jié)會(huì)在下面的小節(jié)中講述:
(圖3 競(jìng)品與場(chǎng)景表)
1. 物理安全
障礙、圍欄,這些物理的物體對(duì)我們包裹、保護(hù),形成了一種物理上的實(shí)在的安全。
認(rèn)證:
銀行卡加密認(rèn)證,實(shí)名認(rèn)證,安全認(rèn)證,就像食物一樣,是經(jīng)過(guò)認(rèn)證的,是一種官方質(zhì)檢的認(rèn)可。在店里加上質(zhì)檢過(guò)的牌匾,就能讓顧客可以放心食用。
比如:圖4小米錢(qián)包里帶有“加密后僅用于銀行驗(yàn)證”的提示,前面還加了一個(gè)盾牌加以強(qiáng)化,傳遞了這種認(rèn)證的感覺(jué)。
另外還有支付密碼、驗(yàn)證碼、指紋密碼等,在用戶使用的某個(gè)流程節(jié)點(diǎn)展示,也傳遞了包裹、保護(hù)之感。
(圖4認(rèn)證的產(chǎn)品)
識(shí)別:
這個(gè)產(chǎn)品長(zhǎng)了一雙眼睛,可以識(shí)別周邊物體。雖然這也是技術(shù)上的進(jìn)化,但傳遞給用戶的,是一種智能、隱蔽的感覺(jué)。
比如:用戶錄入銀行卡信息,身份證信息。在識(shí)別的過(guò)程中,用戶不需要手動(dòng)輸入信息,直接將證件靠近,通過(guò)ocr識(shí)別出文字,便完成了證件的輸入。
圖5分別是:銀行卡和身份證的識(shí)別錄入。
我個(gè)人認(rèn)為“識(shí)別”減少了證件在外界的暴露時(shí)間,使得用戶得以在一個(gè)私人保護(hù)的空間快速操作,這對(duì)于需要輸入大量數(shù)據(jù)的情況效果更加顯著。
舉一個(gè)最近做的身份證錄入流程作為例子:這個(gè)流程不只需要輸入身份證號(hào),還要連帶有效期、地址、性別等全部信息進(jìn)行輸入。
這時(shí)候,識(shí)別輸入就顯得更為必要。
(圖5識(shí)別的產(chǎn)品)
限制:
就像一堵墻,限制給予用戶保護(hù)的感覺(jué)。
雖然我們希望呈現(xiàn)給用戶最流暢的流程,但適當(dāng)?shù)南拗埔部梢宰層脩粽J(rèn)識(shí)到:這個(gè)系統(tǒng)是受保護(hù)的。
比如:圖6最左側(cè),當(dāng)用戶多次操作無(wú)果的時(shí)候,告訴用戶將要進(jìn)行人工審核,限制用戶的使用,而不是讓用戶無(wú)節(jié)制地嘗試。
另外,如圖6的第二張圖:協(xié)議與條款也是一種限制,是法律層面的限制,雖然并不一定所有用戶都會(huì)去閱讀長(zhǎng)長(zhǎng)的條款,但用戶在同意的過(guò)程中會(huì)感覺(jué)權(quán)威之感。
另外,如圖6最右側(cè)的圖:還有一種限制是來(lái)自外界的限制——比如綁定銀行卡的時(shí)候,如果我正在進(jìn)行錄屏,錄屏中的銀行卡信息會(huì)自動(dòng)模糊。
(圖6限制的產(chǎn)品)
2. 心理安全
心理安全,我個(gè)人認(rèn)為是這三個(gè)因素中,涉及到設(shè)計(jì)的內(nèi)容最多的,是用戶發(fā)自內(nèi)心感覺(jué)到的安全。
效率:
高效的操作使用流程讓用戶可以感受到產(chǎn)品的靈敏,從而增加對(duì)產(chǎn)品信賴的感覺(jué)。
從中我也細(xì)分了一些小點(diǎn):
a. 輸入的連貫性。
如圖7的左圖和右圖:是輸入連貫的對(duì)比。同樣是提現(xiàn)的界面,右側(cè)的產(chǎn)品在進(jìn)入界面時(shí)馬上彈出了鍵盤(pán),保證了用戶輸入的連貫。而左側(cè)的界面可能是要顯示全量的內(nèi)容,所以,沒(méi)有將鍵盤(pán)馬上彈出顯示,用戶則需要多一步操作。
從另一個(gè)角度看,信息填寫(xiě)的分組和節(jié)奏也是很重要。
(圖7)
b. 易用的輸入鍵盤(pán)。
金融產(chǎn)品有很多共通的流程,例如:綁定銀行卡,轉(zhuǎn)賬,充值,提現(xiàn)等。
這些流程我之前有列個(gè)表,總結(jié)看到大部分的操作都涉及到輸入數(shù)字的操作。因此,一個(gè)排列合理的鍵盤(pán)會(huì)影響到用戶的輸入效率。
(圖8.輸入數(shù)字表)
c.清晰可讀的數(shù)字。
在需要強(qiáng)化的時(shí)候,很多產(chǎn)品會(huì)將數(shù)字放大顯示,比如:充值,提現(xiàn)。
這樣用戶能清晰看到金額,這也是提高使用效率的細(xì)節(jié)。
(圖9數(shù)字)
d.自動(dòng)。
以充話費(fèi)為例:
充話費(fèi)是每個(gè)月都要充的,充值也只是一個(gè)簡(jiǎn)單常規(guī)的頁(yè)面。
希望設(shè)計(jì)更加流暢的充值體驗(yàn)固然是好的,但也許深入到業(yè)務(wù),我們會(huì)發(fā)現(xiàn):再好的充值體驗(yàn),也只能讓用戶每個(gè)月充一次錢(qián)。如果加上自動(dòng)充值的功能,效果就有所不同,可以節(jié)省用戶時(shí)間,也可以保證資金的持續(xù)流入。
(圖10自動(dòng)充值)
e.規(guī)范的單位顯示。
在查看競(jìng)品的過(guò)程中,我發(fā)現(xiàn)了不同的數(shù)字單位組合形式。既然有不同,也說(shuō)明設(shè)計(jì)一不小心,可能就會(huì)造成不一致。
規(guī)范好單位數(shù)字的表達(dá),統(tǒng)一整個(gè)產(chǎn)品,雖然是細(xì)節(jié),但可以帶來(lái)統(tǒng)一感。
(圖11單位)
f.顏色區(qū)分。
比如:圖12轉(zhuǎn)賬明細(xì)的界面,用了兩種顏色區(qū)分,使得用戶可以快速辨別收入的與支出。
(圖12)
預(yù)測(cè):
用戶在使用一些跟“錢(qián)“相關(guān)產(chǎn)品的時(shí)候,比如:買(mǎi)股票,買(mǎi)基金時(shí),總不免想要知道結(jié)果會(huì)如何。
適當(dāng)?shù)念A(yù)測(cè),可以幫助用戶判斷,是用戶操作的定心丸。
比如圖13提現(xiàn)的流程:
在按鈕明顯的位置告知了用戶預(yù)計(jì)到賬的時(shí)間。
(圖13)
雖然表達(dá)形式不同,如圖14:
告知用戶時(shí)間間隔,預(yù)測(cè)到賬時(shí)間,提供給用戶時(shí)間的選擇,這些都讓用戶對(duì)自己的操作結(jié)果有了一定的預(yù)期。
(圖14)
圖15是一個(gè)功能的起始頁(yè),里面列舉了步驟開(kāi)始需要準(zhǔn)備的東西,也對(duì)用戶即將發(fā)生的事情作了提醒。
(圖15)
理財(cái)?shù)犬a(chǎn)品用戶在使用的時(shí)候是很慎重的,適當(dāng)預(yù)測(cè)收益,可以讓用戶適當(dāng)展望一下,也可以提高用戶對(duì)產(chǎn)品的掌控感。
(圖16)
權(quán)威與信賴:
在街上看到穿著警服的警察,制服上大大的“警察”二字讓人感到安心——這是來(lái)自權(quán)威的震懾。
官方的推薦,開(kāi)放的反饋渠道,優(yōu)勢(shì)的告知,適當(dāng)展示這些元素,讓用戶感受到產(chǎn)品背后堅(jiān)強(qiáng)的后盾。
(圖17)
反饋:
隨時(shí)隨地,用戶能了解當(dāng)前所有的狀況。
除了常見(jiàn)的的成功提示和結(jié)果反饋(圖18),我覺(jué)得一個(gè)比較容易忽略的點(diǎn)是交易單的設(shè)計(jì)。
我發(fā)現(xiàn):不是所有的的交易單都有顯示余額,而“我還剩下多少錢(qián)了”是用戶比較關(guān)心的。因此,這個(gè)信息最好也顯示在交易單上。
(圖18)
(圖19)
不可逆:
不可逆轉(zhuǎn)的事情,是很?chē)?yán)肅的,需要謹(jǐn)慎對(duì)待的。
如:實(shí)名認(rèn)證的操作,進(jìn)行了之后無(wú)法修改,那么也體現(xiàn)了產(chǎn)品嚴(yán)肅認(rèn)真的感覺(jué)。
如圖20中為:實(shí)名認(rèn)證的過(guò)程,其中提示如果通過(guò)將不能修改,這會(huì)讓用戶更加謹(jǐn)慎去填寫(xiě)。
(圖20)
隱藏:
哈利波特有隱身斗篷,高大的建筑底層設(shè)置藏洞,遇到危險(xiǎn)很多人的第一反應(yīng)是遮住眼睛。
隱藏可以說(shuō)是保護(hù)自己的直覺(jué)行為,產(chǎn)品中的設(shè)計(jì)也是如此。
總資產(chǎn)是私密的,點(diǎn)擊眼睛圖標(biāo)可以隱藏?cái)?shù)字,性別,出生年月是隱私信息,隱藏起來(lái)。付款碼,重要信息信息定期刷新,時(shí)間久了就先遮住。
補(bǔ)充一個(gè)從開(kāi)發(fā)側(cè)學(xué)來(lái)的小知識(shí),這種信息的隱藏也有一個(gè)術(shù)語(yǔ)叫“脫敏”。
(圖21)
愉悅感:
偶爾的彩蛋可以增加心理上的愉悅。
比如:
- Google錢(qián)包轉(zhuǎn)賬的最后,用戶可以自定義背景(圖22)發(fā)送給朋友。
- Kakao Pay(圖23)中用戶可以根據(jù)需要自定義卡面的顏色。
看似可有可無(wú)的小功能,其實(shí)也能夠培養(yǎng)用戶與產(chǎn)品間情感的聯(lián)系,增加對(duì)其依賴的感受。
(圖22)
(圖23)
3. 環(huán)境安全
環(huán)境安全:是處于大環(huán)境中的一種安全感。
太平盛世是安全,風(fēng)平浪靜是安全,回到家中的房間也是一種安全。
環(huán)境安全是外在的,我的理解是包含了:人與人關(guān)系的穩(wěn)定,社會(huì)關(guān)系的穩(wěn)定等。
社交:
社交的元素在轉(zhuǎn)賬的場(chǎng)景中經(jīng)常出現(xiàn)。
轉(zhuǎn)賬對(duì)于用戶來(lái)說(shuō)是慎重的——“我想要確認(rèn)轉(zhuǎn)給誰(shuí)”,“我想知道這個(gè)人是否可信”,“我想確保他能收到錢(qián)”,如果這些問(wèn)題沒(méi)有答案,恐怕一次轉(zhuǎn)賬就要在惶惶不安中度過(guò)。
如何在一次轉(zhuǎn)賬中解答這些問(wèn)題?
實(shí)名認(rèn)證的標(biāo)識(shí),對(duì)方身份的提醒,轉(zhuǎn)賬后給對(duì)方捎句話,這些可以讓用戶的轉(zhuǎn)賬更安心。
(圖24)
氛圍:
氛圍,是一種籠罩的感覺(jué)。
告訴用戶某個(gè)銀行卡經(jīng)過(guò)驗(yàn)證,是以“點(diǎn)”的方式告知用戶安全,但是氛圍則更多是以“面”的方式傳遞。
比如:充值過(guò)程中,鍵盤(pán)上出現(xiàn)“已檢測(cè)為安全環(huán)境”,貫穿流程,讓用戶感覺(jué)到周邊安全的氛圍。環(huán)境異常也是可以給用戶警醒的。
(圖25)
品牌背書(shū):
讓用戶知道,使用的產(chǎn)品背后是有保障的,品牌是其中的一個(gè)體現(xiàn)。
- 支付寶在添加信用卡的時(shí)候,展示“支付寶安全保障中”。
- 微信轉(zhuǎn)賬的時(shí)候,對(duì)話框底部出現(xiàn)微信轉(zhuǎn)賬的小字。
- 京東支付,展示品牌色以及l(fā)ogo。
- 小米錢(qián)包支付的等待過(guò)程雖短暫,也見(jiàn)縫插針地出現(xiàn)了錢(qián)包的logo。
如果用戶在產(chǎn)品之外使用,比如:添加商店的優(yōu)惠券到錢(qián)包中,則更需要獲取用戶的信賴。google錢(qián)包定制了添加的按鈕,通過(guò)品牌提醒用戶。
(圖26)
小結(jié)
以上便是一些支付產(chǎn)品設(shè)計(jì)的細(xì)節(jié)點(diǎn)總結(jié),希望大家可以一起交流共享。
參考資料
https://www.chanpiopark.com/samsung-pay-data-driven-ux-1/
https://www.mentalhelp.net/blogs/the-importance-of-feeling-safe/
https://www.google.com/amp/s/www.dezeen.com/2015/12/18/aaron-betsky-opinion-sense-of-safety-in-architecture-public-buildings-spaces/amp/
https://www.kakaopay.com
https://pay.google.com/payments/home
#專欄作家#
交互小怪獸,微信公眾號(hào):交互小怪獸,人人都是產(chǎn)品經(jīng)理專欄作家。深度探討有趣冷門(mén)偏執(zhí)的交互設(shè)計(jì)。
本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。
題圖來(lái)自Unsplash,基于CC0協(xié)議
色彩構(gòu)建
想請(qǐng)問(wèn)一下作者,圖8的輸入數(shù)字表里為什么充值需要支付密碼+短信驗(yàn)證碼,而提現(xiàn)只需要支付密碼呢?提現(xiàn)的安全系數(shù)不是更高嗎,為什么反而安全校驗(yàn)比充值還要少一步呢?
這個(gè)問(wèn)得很細(xì)哈,我目前還只看了部分產(chǎn)品,要多看看其他產(chǎn)品才能準(zhǔn)確總結(jié),看到底是應(yīng)該一樣,還是真的有所區(qū)分
很有可能是底層的支付通道的限制,對(duì)用戶來(lái)說(shuō) 扣款比較謹(jǐn)慎,收款就不是
感謝分享。
謝謝閱讀:)
作者寫(xiě)的很好贊一個(gè)!
看題目之前 我還以為是一個(gè)剖析支付安全的文章呢。心想完了,要是一款支付產(chǎn)品的風(fēng)向整天把安全安全掛嘴邊,更會(huì)讓用戶多疑的。尤其是產(chǎn)品出名后,某些自媒體的言論很駭人。
謝謝umm!主要從交互的角度寫(xiě)了這篇,希望對(duì)設(shè)計(jì)這類(lèi)產(chǎn)品有所啟發(fā)
可以說(shuō)很全了 ,厲害厲害
謝謝江浦!
很好,學(xué)到了 ??
:)一起學(xué)習(xí)
覺(jué)得作者總結(jié)的細(xì)節(jié)很到位,自己之前也做過(guò)支付類(lèi)的產(chǎn)品,但是不斷的在Copy別人家的東西,也沒(méi)仔細(xì)想想其中的細(xì)節(jié)之處,學(xué)到了~筆芯 ??
謝謝謝謝,支付金融產(chǎn)品跟隱私安全有更加緊密的聯(lián)系,感覺(jué)還有很多東西可以挖掘,可以一起總結(jié)細(xì)節(jié)多多學(xué)習(xí):)