本文從騰訊移動(dòng)金融開發(fā)平臺(tái)的實(shí)戰(zhàn)案例出發(fā)，幫你掌握金融領(lǐng)域的產(chǎn)品設(shè)計(jì)方法。

一、項(xiàng)目背景

互聯(lián)網(wǎng)行業(yè)的發(fā)展重點(diǎn)已經(jīng)從消費(fèi)互聯(lián)網(wǎng)逐步轉(zhuǎn)向產(chǎn)業(yè)互聯(lián)網(wǎng)。對(duì)金融機(jī)構(gòu)來說，數(shù)字化轉(zhuǎn)型也成為企業(yè)面向未來發(fā)展、改善客戶服務(wù)、提升商業(yè)利益的必要手段。面對(duì)數(shù)字化時(shí)代所需要的高效響應(yīng)、敏捷調(diào)整等業(yè)務(wù)需求，騰訊金融云從"業(yè)務(wù)與技術(shù)融合"的角度出發(fā)為金融行業(yè)打造了移動(dòng)金融開發(fā)平臺(tái)這一產(chǎn)品。

騰訊移動(dòng)金融開發(fā)平臺(tái)（TMF）是一款整合了騰訊在移動(dòng)產(chǎn)品中開發(fā)、測(cè)試、發(fā)布和運(yùn)營的技術(shù)能力，為銀行、互聯(lián)網(wǎng)金融、保險(xiǎn)以及證券客戶提供一站式、 覆蓋全生命周期的移動(dòng)端金融技術(shù)平臺(tái)，產(chǎn)品目前已交付多個(gè)客戶使用。

移動(dòng)金融開發(fā)平臺(tái)業(yè)務(wù)介紹

二、定位問題找到設(shè)計(jì)目標(biāo)

在之前版本中，平臺(tái)的主要產(chǎn)品目標(biāo)是進(jìn)行業(yè)務(wù)驗(yàn)證和客戶拓展，是一種小步快跑的狀態(tài)。而現(xiàn)在產(chǎn)品的業(yè)務(wù)模式已經(jīng)得到了閉環(huán)，商業(yè)上也積累了一定的客戶群體。因此我們新的產(chǎn)品目標(biāo)是"提升體驗(yàn)，從工具進(jìn)一步轉(zhuǎn)為開發(fā)者中心"，在這個(gè)目標(biāo)背后蘊(yùn)含著什么樣的業(yè)務(wù)需求，是我們接下來需要梳理清楚的。在收集了業(yè)務(wù)側(cè)、客戶側(cè)、用戶側(cè)的反饋之后，我們把問題進(jìn)行了結(jié)構(gòu)化的梳理和總結(jié)，最終收斂出業(yè)務(wù)的核心問題，并可以有針對(duì)性地制定設(shè)計(jì)策略和設(shè)計(jì)目標(biāo)了。

業(yè)務(wù)遇到的問題

如何解決問題、達(dá)成目標(biāo)

三、針對(duì)目標(biāo)制定設(shè)計(jì)策略

目標(biāo)一：獨(dú)立的品牌表達(dá)助力業(yè)務(wù)

產(chǎn)品在之前并沒有獨(dú)立的品牌，導(dǎo)致業(yè)務(wù)方在進(jìn)行市場(chǎng)推廣營銷方面缺少了品牌助力，不利于產(chǎn)品從工具向平臺(tái)的轉(zhuǎn)型，所以我們首先需要對(duì)產(chǎn)品進(jìn)行品牌的建立。

業(yè)務(wù)目標(biāo)一

1. 品牌設(shè)計(jì)策略

在與業(yè)務(wù)方深度溝通后，我們根據(jù)業(yè)務(wù)的核心價(jià)值點(diǎn)和品牌關(guān)鍵詞梳理出 TMF 品牌的設(shè)計(jì)策略。同時(shí)我們也希望能夠利用騰訊進(jìn)行品牌背書，所以在策略上我們也加入了騰訊基因的表達(dá)。

設(shè)計(jì)策略

2. 品牌基因

接下來我們進(jìn)行了設(shè)計(jì)方向的探索，主要的目的是找到核心的品牌基因，通過品牌基因進(jìn)行品牌圖形的推導(dǎo)。經(jīng)過多輪的迭代考量，以及和業(yè)務(wù)方溝通交流后，我們最終確定了"數(shù)字金融建筑師"這一核心品牌基因，它形象的表現(xiàn)了產(chǎn)品所解決的核心業(yè)務(wù)問題。

關(guān)鍵詞探索

品牌基因

3. 品牌圖形

明確了核心基因之后，接下來是對(duì)核心圖形的發(fā)散和收斂。在經(jīng)過了多輪的迭代更新之后，我們最終確定了如下的品牌圖形，將"金融行業(yè)移動(dòng)應(yīng)用搭建平臺(tái)"為主要著手點(diǎn)，用立體的積木形式來隱喻平臺(tái)搭建移動(dòng)應(yīng)用這一核心的業(yè)務(wù)屬性。

標(biāo)志圖形展示

標(biāo)志圖形設(shè)計(jì)理念

品牌色彩

logo 設(shè)計(jì)只是進(jìn)行整個(gè)品牌體系構(gòu)建的第一步，接下來還需要在品牌圖形上進(jìn)行延展，創(chuàng)造完整品牌體系。但是根據(jù)當(dāng)前的項(xiàng)目周期我們必須先著手處理優(yōu)先級(jí)更高的目標(biāo)二，未來再繼續(xù)完成這部分的工作。

未來規(guī)劃

目標(biāo)二：產(chǎn)品體驗(yàn)優(yōu)化提升滿意度

之前我們收到了較多關(guān)于產(chǎn)品體驗(yàn)的反饋，產(chǎn)品體驗(yàn)不夠好不僅會(huì)影響用戶使用效率，也會(huì)對(duì)產(chǎn)品口碑影響力造成傷害。那么第二步我們要做的就是進(jìn)行產(chǎn)品整體體驗(yàn)的優(yōu)化提升。

業(yè)務(wù)目標(biāo)二

在達(dá)成這個(gè)目標(biāo)之前，我們首先以交互和視覺兩個(gè)維度來分析 TMF 當(dāng)前到底存在什么樣的體驗(yàn)問題。

TMF 的體驗(yàn)問題定義

1. 解決交互體驗(yàn)問題：產(chǎn)品體驗(yàn)不順暢

① 痛點(diǎn)歸納

產(chǎn)品體驗(yàn)不順暢是一個(gè)籠統(tǒng)的表述，我們需要進(jìn)一步找出問題的癥結(jié)。工單是我們了解用戶實(shí)際使用體驗(yàn)的重要依據(jù)，所以我們決定以工單為切入點(diǎn)來找出體驗(yàn)問題的癥結(jié)。

深挖體驗(yàn)問題

② 設(shè)計(jì)策略及方案

根據(jù)對(duì)現(xiàn)有工單的分析，我們將體驗(yàn)問題歸結(jié)為兩類，一類是操作不熟悉，一類是功能找不到，并根據(jù)問題產(chǎn)生的原因分別做出相應(yīng)的設(shè)計(jì)策略?？偨Y(jié)起來就是站在用戶視角，通過實(shí)際使用流程的串聯(lián)來重塑產(chǎn)品的信息架構(gòu)，同時(shí)加強(qiáng)功能引導(dǎo)，使其更符合用戶實(shí)際使用場(chǎng)景，并按不同的角色組織功能排布和按任務(wù)流來組織模塊的跳轉(zhuǎn)。

重塑信息架構(gòu)

重塑信息架構(gòu)

強(qiáng)化引導(dǎo)功能并建立幫助中心提供隨時(shí)隨地的指引和幫助。

增強(qiáng)功能引導(dǎo)

增加幫助引導(dǎo)

2. 解決視覺體驗(yàn)問題：風(fēng)格過于技術(shù)向，沒有親和力

① 痛點(diǎn)歸納

"風(fēng)格過于技術(shù)向，沒有親和力"，這是客戶反饋的原話。當(dāng)我們看到這個(gè)反饋時(shí)，第一反應(yīng)是比較迷茫的，為什么一個(gè) ToB 的后臺(tái)產(chǎn)品需要有親和力？帶著這個(gè)問題，我們?cè)俅螌⒛抗廪D(zhuǎn)回到用戶，研究用戶真實(shí)的使用場(chǎng)景。研究后發(fā)現(xiàn)這句話反映出的問題其實(shí)是"作為一個(gè)每天日常工作使用的工具，嚴(yán)肅的視覺氛圍會(huì)容易產(chǎn)生疲勞和枯燥感"、"頁面圖形化引導(dǎo)太少，用戶學(xué)習(xí)成本很高"。

深入探索用戶背后的訴求

② 設(shè)計(jì)目標(biāo)

理清問題的本質(zhì)之后，我們開始制定相應(yīng)的設(shè)計(jì)目標(biāo)，除了解決"親和力"的問題之外，我們同時(shí)也希望能夠融合品牌傳達(dá)，這是我們?cè)O(shè)計(jì)方案的兩大目標(biāo)。

兩大設(shè)計(jì)目標(biāo)

③ 設(shè)計(jì)策略及方案

我們從色彩、質(zhì)感、情感、品牌四個(gè)維度來分析和展現(xiàn)如何達(dá)成設(shè)計(jì)目標(biāo)的。

色彩

以新品牌色為基礎(chǔ)基因，以淺色系藍(lán)灰色為背景氛圍，降低畫面色彩重量給人以平靜、平和心理感受。

平臺(tái)的色彩系統(tǒng)

色彩的情感氛圍

質(zhì)感

在質(zhì)感的設(shè)計(jì)上，我們將數(shù)字金融 C 端的設(shè)計(jì)語言引入到 B 端設(shè)計(jì)中來，通過較為柔和、親膚感材質(zhì)和使用微投影、微圓角來提升頁面內(nèi)視覺元素的親和度，降低純技術(shù)感帶來的疲勞和枯燥，而這一點(diǎn)已經(jīng)在數(shù)字金融的 C 端設(shè)計(jì)上得到了驗(yàn)證。

元素質(zhì)感探索

界面質(zhì)感表現(xiàn)

情感化

在情感化設(shè)計(jì)的維度，我們以情感化的三個(gè)層次來考量。在本能層次，通過色彩、質(zhì)感視覺氛圍的營造來解決"好看"的問題；在行為層次，我們結(jié)合體驗(yàn)層面的痛點(diǎn)，在頁面增加圖形化的引導(dǎo)與反饋，解決"好用"的問題。

情感化三層次上的設(shè)計(jì)策略

根據(jù)情感化的強(qiáng)度不同，共分了三個(gè)層面進(jìn)行視覺元素的設(shè)計(jì)。

圖形化設(shè)計(jì)策略

在使用流程的核心節(jié)點(diǎn)上，我們嘗試增加圖形化的表達(dá)與引導(dǎo)，幫助用戶快速理解頁面信息。同時(shí)增強(qiáng)反饋，在不同的情況下給予用戶合理的情感表達(dá)。

圖形化的功能引導(dǎo)

增加新手引導(dǎo)

四、品牌

在品牌層面我們的主要的考量點(diǎn)在于如何將提煉出來的品牌基因，通過圖形化的方式融入到頁面之中，最終的設(shè)計(jì)策略是將"積木"這一核心元素作為構(gòu)建視覺的基礎(chǔ)，潛移默化的體現(xiàn)出建筑師這一概念。同時(shí)在產(chǎn)品的核心節(jié)點(diǎn)，將品牌 logo 和業(yè)務(wù)元素通過一致的表現(xiàn)形式呈現(xiàn)，不斷加強(qiáng)用戶對(duì)于品牌的記憶。

引導(dǎo)與反饋的視覺表達(dá)

平臺(tái)的品牌基因

品牌記憶點(diǎn)

五、總結(jié)

在后臺(tái)體驗(yàn)優(yōu)化類項(xiàng)目中，我們首先要對(duì)當(dāng)前的問題進(jìn)行調(diào)研和梳理，找出問題的根因，之后根據(jù)問題的根本原因來明確設(shè)計(jì)目標(biāo)，制定相應(yīng)的設(shè)計(jì)策略。視覺設(shè)計(jì)的策略重點(diǎn)在于如何通過視覺手段來解決當(dāng)前的體驗(yàn)問題，這樣才能產(chǎn)出有價(jià)值的設(shè)計(jì)。

作者：騰訊云設(shè)計(jì)中心