我與「轉錯帳」的距離 (下) — 為Richart 添加防錯設計

在科技主導的網路時代,對理解人性的需求將大幅提高,設計師應當為「人性」做設計

在上集中,我分享了Richart為何讓我轉錯帳的前因後果,並從「設計的心理學」與NN/g文章摘要出防錯設計的前備知識與設計原則。

本來我已開始構思新的轉帳流程,但途中卻忽然想到: 「要用戶重新學習新的轉帳方式是否本末倒置? 怎不從用戶熟悉的模式著手? 」所以我改從「Richart既有的操作流程進行優化」,並記錄其它設計建議與觀察。

轉帳流程 Redesign

👉 問題情境:我想要轉帳給朋友卻被不良的設計誤導,轉到陌生帳戶去。

👉 優化目標:如何改善這段流程? 相同情況下能透過什麼防錯設計告知我選到錯誤的帳戶了?

之前我們曾提到防錯設計四原則,分析後我僅以第四點來強化轉帳流程。

(1)侷限設計( ) — 局限設計原則較適用於實體產品。
(2)還原設計( ) 轉帳為不可逆行為,故無法還原。
(3)合理性檢查( ) — Richart的合理性檢查列為另一個Case討論。
(4)提供確認訊息與預覽結果( ✔️) — 轉帳流程Redesign會著重在此原則。

1. 修正用詞

為了避免混淆,我將最外層的「常用帳戶」改為「帳戶」,點入後才顯示帳戶下的三個分類,分別是: 最近帳戶、常用帳戶、約定帳戶。

2. 在行為前後提供「提示」與「反饋」

▍提示 1

為了避免手指點選時遮住文字,我選擇在「立即轉帳」上方顯示提醒文案,並將字體放大,採用紅字威脅...歐不,是「強調」匯出款項無法被退回! 希望能在用戶行動前暗示轉錯帳的嚴重性。

▍反饋 1

無論用戶以何種方式轉帳,在選擇轉帳帳號後,系統都應反饋轉入帳戶的全部資訊 - 包含轉出帳號用戶的名稱、銀行代碼、銀行帳戶等。

因為我有幫朋友帳戶取名的習慣,若轉給認識的朋友理應帶出相關資訊;若顯示為陌生名稱(如:新朋友),透過與用戶預期的落差,提供第一次讓用戶回頭檢查的機會。

▍反饋 2 + 提示 2

承上,當用戶選擇立即轉帳後,UI將顯示該次轉帳的完整資訊,並提示匯出款項無法退回,給用戶最後一次確(取)認(消)的機會。若還是轉錯帳,Richart只能癱手:「怪我囉? 」 🙄 🙄 🙄

用「瑞士乳酪模型」比較前後的防錯設計

瑞士乳酪模型概念: 每片乳酪代表事故發生的一個條件,上面的洞表示在這個條件上出了狀況。設計師應多用幾種設計方式減少狀況發生,讓任何一個狀況(洞) 會被下一層防錯設計擋住,以避開事故的生成。

Swiss cheese model of accident (Source: https://www.mtu.edu/chemical/facilities/safety/process/images/che-process-safety-swiss-cheese-orig.jpg)

因此原本的Richart會像下圖。一開始「常用帳戶」的錯誤文案便已誤導用戶,選錯帳戶的後續流程也因「沒顯示出完整資訊」,而讓用戶繼續轉帳。

改良後的版本,除了將「常用帳戶」改為「帳戶」外,在不中斷轉帳流程的前提下使用兩次提示文字兩次顯示完整轉帳資訊,提供至少3次讓用戶回頭查證或取消的機會。

當然,以上是最最最極端的狀況,即用戶心不在焉操作下我們所能盡力做到的層層防護。一般來說,若最初就選擇對的帳戶分類,就可以避免出錯,或是在預覽看見「新朋友」時,應該也要發現選錯帳戶而取消交易。

不過這種「一般來說」或是「應該」的預期也最危險。

設計師永遠不知道用戶會有哪些「不一般」的操作。為一切順利的情況做設計是容易的,真正棘手的部分是如何為出了問題的情況設計 。

延伸討論

因蠻多臉友給予回饋,才讓我這Outsider了解數位金融產品在設計上常須配合許多法規與限制,若未全面理解銀行架構,部分問題仍無法被解決。以下摘錄後續發現的問題、銀行的設計限制與其它設計建議。

▍合理性設計不足

除了帳戶轉帳外,Richart 還提供用Mail、手機號碼轉帳,方便朋友間快速交易。但下圖可以看到信箱格式不對、輸入金額超出帳戶餘額、以及銀行代碼999並未即時驗證格式是否正確,都得等到用戶點完「立即轉帳」後才會反應,得回前頁重來一次。

▍銀行與使用者出發點的不同

曾做過銀行APP的讀者表示「其實錯不在防呆機制,而是銀行是用業務和系統的角度設計。」

「常用帳號」、「最近轉帳」、「約定帳號」都是帳號在銀行系統架構下的分類,並非使用者的分類(認知上以家人、朋友、陌生人為分類)。而且很有可能同一個帳號被重複分在這三類裡,讓事情更複雜。因此轉帳首要任務是一開始就選對帳號,若出發點就錯了,後面要防呆很難,畢竟系統不會知道用戶要轉給誰。

而就預覽頁顯示戶名這點,在用戶有幫朋友帳戶取名的前提下的確會顯示。但若是跨銀行的帳戶,台新就不會知道中信帳號的戶名是什麼,本行才有可能知道,且通常系統都是轉完帳才去發查帳號戶名。

👉 但我認為,無論是一開始選錯帳號,或是有跨銀行無法顯示戶名的情況下,系統最好能在關鍵一按前展示資訊全貌,避免不可逆的轉帳行為。

▍以帳號後五碼確認轉帳

我也收錄另一位讀者的創意設計 : 在大金額轉帳時,可以像 Marvel/Invision 刪除專案時要求輸入專案名稱一樣,要求輸入轉入帳戶人的姓名,或者帳戶後 5 碼之類的,確保妳真的知道正在轉帳給誰。

👉 我想到的是,順應人懶惰求方便的天性,若是轉給陌生人的情境,還要再回去找帳戶後五碼(中斷任務)或是為對方取名(只轉一次的陌生人)好像有點麻煩。

若是轉給朋友的情境,帳號後五碼也不算方便 🤣 🤣。畢竟我們真的很少去記其他人的帳戶(都是數字)。

▍其他數位金融APP轉帳GUI

由於我沒有國泰世華與玉山帳戶,這邊也倚賴臉友傳給我的圖片來比較。桃紅色為國泰世華KOKO APP,藍綠色為玉山銀行APP。這兩款都有人說好用。

與 Richart相比,國泰世華KOKO與玉山銀行一開始轉帳路跡就分明且單純。Richart則是選項經過優化的分岔路,但標示有誤 🤣 🤣 🤣。

結語

因轉錯帳的反覆糾結在歷經一個多月後終於結束,只有「累」字可以形容。就產品來說,Richart 跳脫銀行傳統的設計方式,還發展萌IP,將刻版的金融產品翻轉為更活潑簡化且親民的形象,我也很愛用。

然,簡化是件好事,然讓人混淆就會造成問題。尤其在不可逆的操作行為上,更需要多重防錯協助把關。從這次經歷我整理出兩點Takeaway:

▍人性,才是人本設計的核心

發現轉錯帳後我曾怪罪自己沒看清楚,才讓情況如此複雜。但設計心理學提到:「犯錯是人性,在發生失誤時,使用者第一時間往往是怪罪自己,但其實很多時候是『產品做得不夠好』」。因此除了產品功能外,設計師還必須能知悉人性弱點,為人性做設計。

人性的弱點是什麼? 可能是懶、圖方便、粗心、易分心等等。《人文學科的逆襲》作者George Anders談到在科技主導的網路時代,對「理解人性」的需求將大幅提高。這也是為何廣大鄉民那麼喜愛Line, Messenger的訊息回收功能,Gmail, Outlook的取消傳送功能,這都是因為他們後來洞悉了人就是粗心的天性,並為之做設計。

若有興趣,還可參考這兩篇:好的產品設計能滿足人類「七宗罪」如何理解产品设计和运营中的“人性思维”?

▍用戶體驗不止於產品,還有整個服務

因催款過程太複雜,我自製了一份User emotion journey,可以看出心情的糾結與無奈。

實線為與Richart有關的處理流程;虛線為我自己想辦法聯繫B的處理流程。

如上集所述,B跟我是團購課程的網友,除了信箱與台新帳號外我沒有其他資訊了。在寫信給B無回應後,我曾主動求助3次。

🔹第一次打給台新男性客服被認為是詐騙集團 🤦‍♀️。且因為個資法,銀行不會透漏任何對方的資訊。
🔹第二次我轉向線上課程平台尋求協助(還妄想他們能透過數據得知對方是否有閱讀我留給她的訊息),但同樣因為個資法他們無否透漏資訊,甚至建議報警。
🔹第三次我再打給另一位女性台新客服,由她居中多次聯繫對方,錢才順利追回。且值得一提的是: 該位客服有仔細詢問是在哪個步驟轉錯,並為雙方做了良好的溝通。

若不是最後的女性台新客服善盡職責居中協調,原本已經不好的體驗可能因為服務不周又直直落下 💔,進而影響用戶繼續使用產品的意願。因此我認為更進階的優秀設計,產品與服務還必須構成全面且有意義的連結,才能在設計不良的過程中,重新彌補、再提升用戶的正面體驗。

最後,若你不幸也遭遇轉錯帳的問題,第一時間還是先打給客服並詳述狀況,請他們居中協助溝通,如果對方裝傻不還就只能走法律途徑囉!

😊願大家都不會遇到轉錯帳的狀況! 😊

--

--

Seal-被半導體業耽誤的產品設計師
AAPD — As A Product Designer

理性>感性,所以練習感性;圖像>文字,所以嘗試寫作。我是位在半導體產業工作,且深怕被AI人工智慧取代的產品設計師 !! (☞•́⍛•̀)☞ 因此對科技趨勢極有興趣,只為了找尋能不被滅亡的答案 :P。👩‍🎓@ FUJ Applied Arts ✌🏼BB來電:https://pse.is/3lttnd