設(shè)計(jì)一個(gè)產(chǎn)品不能停留在界面、布局、功能層面，而應(yīng)該要秉著“設(shè)計(jì)一個(gè)能夠給予用戶安全感的產(chǎn)品”的理念，去設(shè)計(jì)產(chǎn)品。筆者在本文中，從“用戶安全感”入手，講述如何設(shè)計(jì)一個(gè)讓用戶安心的，好的支付產(chǎn)品。

這是一篇關(guā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改版）

后來陸續(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)品、錢包產(chǎn)品，用戶使用它們，可能并不是因?yàn)樗每?，漂亮，而可能是因?yàn)樗档眯刨?，它可靠?/p>

那么，在設(shè)計(jì)層面，問題就應(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è)盆友們的見解。

更快的識別時(shí)間，更嚴(yán)密的密碼監(jiān)控，這些固然很安全，但技術(shù)是設(shè)計(jì)師不能控制的領(lǐng)域。不過，我們至少還能做的是：讓這個(gè)產(chǎn)品看上去很安全。

安全感心理學(xué)

記得第一次去廈門的時(shí)候，坐了去鼓浪嶼的船，發(fā)現(xiàn)這個(gè)船竟然沒有座位的，拿著行李箱在船艙還會左右晃動。

這時(shí)候我看到了這個(gè)：

（圖2 鼓浪嶼船上的安全手把）

于是我很自然就過去抓住，松了一口氣。

我想這可能就是這個(gè)把手帶給我的安全感吧？

因?yàn)橄胩接懓踩羞@個(gè)主題，我查閱了不同領(lǐng)域的一些資料，包括：建筑領(lǐng)域，心理學(xué)領(lǐng)域和醫(yī)學(xué)領(lǐng)域。

總結(jié)出以下兩點(diǎn)：

1. 安全不等于安全感。
2. 營造安全的因素包括：心理安全，物理安全和社會安全。

安全感在金融產(chǎn)品中的體現(xiàn)：心理安全，物理安全，環(huán)境安全。

從這三個(gè)角度出發(fā)，我對于之前搜索的產(chǎn)品進(jìn)行了一些整理，具體的細(xì)節(jié)會在下面的小節(jié)中講述：

（圖3 競品與場景表）

1. 物理安全

障礙、圍欄，這些物理的物體對我們包裹、保護(hù)，形成了一種物理上的實(shí)在的安全。

認(rèn)證：

銀行卡加密認(rèn)證，實(shí)名認(rèn)證，安全認(rèn)證，就像食物一樣，是經(jīng)過認(rèn)證的，是一種官方質(zhì)檢的認(rèn)可。在店里加上質(zhì)檢過的牌匾，就能讓顧客可以放心食用。

比如：圖4小米錢包里帶有“加密后僅用于銀行驗(yàn)證”的提示，前面還加了一個(gè)盾牌加以強(qiáng)化，傳遞了這種認(rèn)證的感覺。

另外還有支付密碼、驗(yàn)證碼、指紋密碼等，在用戶使用的某個(gè)流程節(jié)點(diǎn)展示，也傳遞了包裹、保護(hù)之感。

（圖4認(rèn)證的產(chǎn)品）

識別：

這個(gè)產(chǎn)品長了一雙眼睛，可以識別周邊物體。雖然這也是技術(shù)上的進(jìn)化，但傳遞給用戶的，是一種智能、隱蔽的感覺。

比如：用戶錄入銀行卡信息，身份證信息。在識別的過程中，用戶不需要手動輸入信息，直接將證件靠近，通過ocr識別出文字，便完成了證件的輸入。

圖5分別是：銀行卡和身份證的識別錄入。

我個(gè)人認(rèn)為“識別”減少了證件在外界的暴露時(shí)間，使得用戶得以在一個(gè)私人保護(hù)的空間快速操作，這對于需要輸入大量數(shù)據(jù)的情況效果更加顯著。

舉一個(gè)最近做的身份證錄入流程作為例子：這個(gè)流程不只需要輸入身份證號，還要連帶有效期、地址、性別等全部信息進(jìn)行輸入。

這時(shí)候，識別輸入就顯得更為必要。

（圖5識別的產(chǎn)品）

限制：

就像一堵墻，限制給予用戶保護(hù)的感覺。

雖然我們希望呈現(xiàn)給用戶最流暢的流程，但適當(dāng)?shù)南拗埔部梢宰層脩粽J(rèn)識到：這個(gè)系統(tǒng)是受保護(hù)的。

比如：圖6最左側(cè)，當(dāng)用戶多次操作無果的時(shí)候，告訴用戶將要進(jìn)行人工審核，限制用戶的使用，而不是讓用戶無節(jié)制地嘗試。

另外，如圖6的第二張圖：協(xié)議與條款也是一種限制，是法律層面的限制，雖然并不一定所有用戶都會去閱讀長長的條款，但用戶在同意的過程中會感覺權(quán)威之感。

另外，如圖6最右側(cè)的圖：還有一種限制是來自外界的限制——比如綁定銀行卡的時(shí)候，如果我正在進(jìn)行錄屏，錄屏中的銀行卡信息會自動模糊。

（圖6限制的產(chǎn)品）

2. 心理安全

心理安全，我個(gè)人認(rèn)為是這三個(gè)因素中，涉及到設(shè)計(jì)的內(nèi)容最多的，是用戶發(fā)自內(nèi)心感覺到的安全。

效率:

高效的操作使用流程讓用戶可以感受到產(chǎn)品的靈敏，從而增加對產(chǎn)品信賴的感覺。

從中我也細(xì)分了一些小點(diǎn):

a. 輸入的連貫性。

如圖7的左圖和右圖：是輸入連貫的對比。同樣是提現(xiàn)的界面，右側(cè)的產(chǎn)品在進(jìn)入界面時(shí)馬上彈出了鍵盤，保證了用戶輸入的連貫。而左側(cè)的界面可能是要顯示全量的內(nèi)容，所以，沒有將鍵盤馬上彈出顯示，用戶則需要多一步操作。

從另一個(gè)角度看，信息填寫的分組和節(jié)奏也是很重要。

（圖7）

b. 易用的輸入鍵盤。

金融產(chǎn)品有很多共通的流程，例如：綁定銀行卡，轉(zhuǎn)賬，充值，提現(xiàn)等。

這些流程我之前有列個(gè)表，總結(jié)看到大部分的操作都涉及到輸入數(shù)字的操作。因此，一個(gè)排列合理的鍵盤會影響到用戶的輸入效率。

（圖8.輸入數(shù)字表）

c.清晰可讀的數(shù)字。

在需要強(qiáng)化的時(shí)候，很多產(chǎn)品會將數(shù)字放大顯示，比如：充值，提現(xiàn)。

這樣用戶能清晰看到金額，這也是提高使用效率的細(xì)節(jié)。

（圖9數(shù)字）

d.自動。

以充話費(fèi)為例：

充話費(fèi)是每個(gè)月都要充的，充值也只是一個(gè)簡單常規(guī)的頁面。

希望設(shè)計(jì)更加流暢的充值體驗(yàn)固然是好的，但也許深入到業(yè)務(wù)，我們會發(fā)現(xiàn)：再好的充值體驗(yàn)，也只能讓用戶每個(gè)月充一次錢。如果加上自動充值的功能，效果就有所不同，可以節(jié)省用戶時(shí)間，也可以保證資金的持續(xù)流入。

（圖10自動充值）

e.規(guī)范的單位顯示。

在查看競品的過程中，我發(fā)現(xiàn)了不同的數(shù)字單位組合形式。既然有不同，也說明設(shè)計(jì)一不小心，可能就會造成不一致。

規(guī)范好單位數(shù)字的表達(dá)，統(tǒng)一整個(gè)產(chǎn)品，雖然是細(xì)節(jié)，但可以帶來統(tǒng)一感。

(圖11單位)

f.顏色區(qū)分。

比如：圖12轉(zhuǎn)賬明細(xì)的界面，用了兩種顏色區(qū)分，使得用戶可以快速辨別收入的與支出。

（圖12）

預(yù)測：

用戶在使用一些跟“錢“相關(guān)產(chǎn)品的時(shí)候，比如：買股票，買基金時(shí)，總不免想要知道結(jié)果會如何。

適當(dāng)?shù)念A(yù)測，可以幫助用戶判斷，是用戶操作的定心丸。

比如圖13提現(xiàn)的流程：

在按鈕明顯的位置告知了用戶預(yù)計(jì)到賬的時(shí)間。

（圖13）

雖然表達(dá)形式不同，如圖14：

告知用戶時(shí)間間隔，預(yù)測到賬時(shí)間，提供給用戶時(shí)間的選擇，這些都讓用戶對自己的操作結(jié)果有了一定的預(yù)期。

（圖14）

圖15是一個(gè)功能的起始頁，里面列舉了步驟開始需要準(zhǔn)備的東西，也對用戶即將發(fā)生的事情作了提醒。

（圖15）

理財(cái)?shù)犬a(chǎn)品用戶在使用的時(shí)候是很慎重的，適當(dāng)預(yù)測收益，可以讓用戶適當(dāng)展望一下，也可以提高用戶對產(chǎn)品的掌控感。

（圖16）

權(quán)威與信賴：

在街上看到穿著警服的警察，制服上大大的“警察”二字讓人感到安心——這是來自權(quán)威的震懾。

官方的推薦，開放的反饋渠道，優(yōu)勢的告知，適當(dāng)展示這些元素，讓用戶感受到產(chǎn)品背后堅(jiān)強(qiáng)的后盾。

（圖17）

反饋：

隨時(shí)隨地，用戶能了解當(dāng)前所有的狀況。

除了常見的的成功提示和結(jié)果反饋（圖18），我覺得一個(gè)比較容易忽略的點(diǎn)是交易單的設(shè)計(jì)。

我發(fā)現(xiàn)：不是所有的的交易單都有顯示余額，而“我還剩下多少錢了”是用戶比較關(guān)心的。因此，這個(gè)信息最好也顯示在交易單上。

（圖18）

（圖19）

不可逆：

不可逆轉(zhuǎn)的事情，是很嚴(yán)肅的，需要謹(jǐn)慎對待的。

如：實(shí)名認(rèn)證的操作，進(jìn)行了之后無法修改，那么也體現(xiàn)了產(chǎn)品嚴(yán)肅認(rèn)真的感覺。

如圖20中為：實(shí)名認(rèn)證的過程，其中提示如果通過將不能修改，這會讓用戶更加謹(jǐn)慎去填寫。

（圖20）

隱藏：

哈利波特有隱身斗篷，高大的建筑底層設(shè)置藏洞，遇到危險(xiǎn)很多人的第一反應(yīng)是遮住眼睛。

隱藏可以說是保護(hù)自己的直覺行為，產(chǎn)品中的設(shè)計(jì)也是如此。

總資產(chǎn)是私密的，點(diǎn)擊眼睛圖標(biāo)可以隱藏?cái)?shù)字，性別，出生年月是隱私信息，隱藏起來。付款碼，重要信息信息定期刷新，時(shí)間久了就先遮住。

補(bǔ)充一個(gè)從開發(fā)側(cè)學(xué)來的小知識，這種信息的隱藏也有一個(gè)術(shù)語叫“脫敏”。

（圖21）

愉悅感：

偶爾的彩蛋可以增加心理上的愉悅。

比如：

• Google錢包轉(zhuǎn)賬的最后，用戶可以自定義背景（圖22）發(fā)送給朋友。
• Kakao Pay（圖23）中用戶可以根據(jù)需要自定義卡面的顏色。

看似可有可無的小功能，其實(shí)也能夠培養(yǎng)用戶與產(chǎn)品間情感的聯(lián)系，增加對其依賴的感受。

（圖22）

（圖23）

3. 環(huán)境安全

環(huán)境安全：是處于大環(huán)境中的一種安全感。

太平盛世是安全，風(fēng)平浪靜是安全，回到家中的房間也是一種安全。

環(huán)境安全是外在的，我的理解是包含了：人與人關(guān)系的穩(wěn)定，社會關(guān)系的穩(wěn)定等。

社交：

社交的元素在轉(zhuǎn)賬的場景中經(jīng)常出現(xiàn)。

轉(zhuǎn)賬對于用戶來說是慎重的——“我想要確認(rèn)轉(zhuǎn)給誰”，“我想知道這個(gè)人是否可信”，“我想確保他能收到錢”，如果這些問題沒有答案，恐怕一次轉(zhuǎn)賬就要在惶惶不安中度過。

如何在一次轉(zhuǎn)賬中解答這些問題？

實(shí)名認(rèn)證的標(biāo)識，對方身份的提醒，轉(zhuǎn)賬后給對方捎句話，這些可以讓用戶的轉(zhuǎn)賬更安心。

（圖24）

氛圍：

氛圍，是一種籠罩的感覺。

告訴用戶某個(gè)銀行卡經(jīng)過驗(yàn)證，是以“點(diǎn)”的方式告知用戶安全，但是氛圍則更多是以“面”的方式傳遞。

比如：充值過程中，鍵盤上出現(xiàn)“已檢測為安全環(huán)境”，貫穿流程，讓用戶感覺到周邊安全的氛圍。環(huán)境異常也是可以給用戶警醒的。

（圖25）

品牌背書：

讓用戶知道，使用的產(chǎn)品背后是有保障的，品牌是其中的一個(gè)體現(xiàn)。

• 支付寶在添加信用卡的時(shí)候，展示“支付寶安全保障中”。
• 微信轉(zhuǎn)賬的時(shí)候，對話框底部出現(xiàn)微信轉(zhuǎn)賬的小字。
• 京東支付，展示品牌色以及l(fā)ogo。
• 小米錢包支付的等待過程雖短暫，也見縫插針地出現(xiàn)了錢包的logo。

如果用戶在產(chǎn)品之外使用，比如：添加商店的優(yōu)惠券到錢包中，則更需要獲取用戶的信賴。google錢包定制了添加的按鈕，通過品牌提醒用戶。

（圖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

#專欄作家#

交互小怪獸，微信公眾號：交互小怪獸，人人都是產(chǎn)品經(jīng)理專欄作家。深度探討有趣冷門偏執(zhí)的交互設(shè)計(jì)。

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

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