編輯導(dǎo)語(yǔ)：B端產(chǎn)品與C端產(chǎn)品的服務(wù)對(duì)象、使用場(chǎng)景有所不同，故其在產(chǎn)品設(shè)計(jì)上也有所差異。而在B端設(shè)計(jì)中，常見(jiàn)的問(wèn)題有哪些呢？本篇文章里，作者結(jié)合數(shù)據(jù)中臺(tái)可視化設(shè)計(jì)案例，對(duì)B端產(chǎn)品的設(shè)計(jì)工作做了解讀，一起來(lái)看一下。

做過(guò)B端設(shè)計(jì)的小伙伴都知道：B端設(shè)計(jì)是具有一定門檻的，一個(gè)企業(yè)內(nèi)部的中臺(tái)系統(tǒng)信息體量非常龐大，其中的邏輯關(guān)系錯(cuò)綜復(fù)雜，這就會(huì)導(dǎo)致前后臺(tái)關(guān)系雖然緊密但卻缺乏實(shí)際的連貫感知。

在不同場(chǎng)景下對(duì)業(yè)務(wù)信息“看不清”、“看不懂”、“看不見(jiàn)”的現(xiàn)象時(shí)有發(fā)生，所以需要有嚴(yán)謹(jǐn)?shù)睦硇运季S，本文將以數(shù)據(jù)中臺(tái)業(yè)務(wù)為背景，分享可視化的一些設(shè)計(jì)方法和技巧。

一、數(shù)據(jù)中臺(tái)的現(xiàn)狀

數(shù)據(jù)中臺(tái)是將數(shù)據(jù)資源與數(shù)據(jù)生產(chǎn)系統(tǒng)相融合，為業(yè)務(wù)前臺(tái)創(chuàng)新多變的業(yè)務(wù)場(chǎng)景提供數(shù)據(jù)能力的支撐，從而達(dá)到快速支持業(yè)務(wù)發(fā)展的目的。

中臺(tái)產(chǎn)品的服務(wù)能力有很多，比如數(shù)據(jù)中臺(tái)，是基于現(xiàn)有云窗、DP、BI為背景的龐大信息架構(gòu)，涵蓋了數(shù)據(jù)地圖、數(shù)據(jù)開(kāi)發(fā)、數(shù)據(jù)資產(chǎn)、指標(biāo)管理、平臺(tái)管理等多模塊的業(yè)務(wù)范疇，面向集團(tuán)全員提供諸如：數(shù)據(jù)表、指標(biāo)、報(bào)表、任務(wù)等內(nèi)容的數(shù)據(jù)查詢服務(wù)。這些均都由數(shù)據(jù)中臺(tái)創(chuàng)建。

然而中臺(tái)的各業(yè)務(wù)之間都存有一些共性，通過(guò)對(duì)頁(yè)面特征的分析，總結(jié)出了三種典型的問(wèn)題：信息列表不清晰、品牌認(rèn)知度薄弱、場(chǎng)景連貫性差。

通過(guò)對(duì)這些場(chǎng)景問(wèn)題的探索，發(fā)現(xiàn)提升可視化程度是有效解決這三類場(chǎng)景所對(duì)應(yīng)問(wèn)題的突破口，故可視化設(shè)計(jì)策略成為本次的研究重點(diǎn)和攻克方向。

二、數(shù)據(jù)可視化的案例1. 中臺(tái)設(shè)計(jì)“看不清”

信息列表不清晰是中臺(tái)最常見(jiàn)的問(wèn)題之一，傳統(tǒng)的列表無(wú)非是字段的堆疊，大量相似信息的重復(fù)出現(xiàn)，降低了有效信息的捕獲和整合效率，加重了認(rèn)知負(fù)荷。

這種現(xiàn)象稱為“看不清”，為了解決這個(gè)問(wèn)題，我們將列表按照其功能分成兩大類：執(zhí)行類和看板類。

執(zhí)行類列表目的是將所有字段展示完全，方便統(tǒng)一管理和操作；看板類則只要展示關(guān)鍵信息，起到快速查看和監(jiān)控的作用。

以體驗(yàn)駕駛艙項(xiàng)目為例，它是58UXD攜手ADS打造的一款基于體驗(yàn)維度的一站式體驗(yàn)數(shù)據(jù)監(jiān)測(cè)平臺(tái)，具備數(shù)據(jù)監(jiān)測(cè)、數(shù)據(jù)看板、指標(biāo)預(yù)警等核心能力。其中數(shù)據(jù)看板類的信息層級(jí)可以拆分為三部分：關(guān)鍵信息篩選、視覺(jué)載體設(shè)計(jì)、視覺(jué)映射關(guān)系。

首先關(guān)鍵信息篩選，這時(shí)我們要把信息進(jìn)行優(yōu)先級(jí)的排序。

其次選擇視覺(jué)載體進(jìn)行，首先根據(jù)看板的功能提煉出關(guān)鍵詞，如：查看、時(shí)間、狀態(tài)。圍繞關(guān)鍵詞尋找符合寓意的載體參考，比如日歷、日程表等。

最后建立營(yíng)銷日歷的載體架構(gòu)，類比日歷的功能和結(jié)構(gòu)，設(shè)計(jì)營(yíng)銷看板的結(jié)構(gòu)和布局，并填充活動(dòng)信息、時(shí)間、狀態(tài)等內(nèi)容，建立架構(gòu)映射關(guān)系。

2. 中臺(tái)設(shè)計(jì)“看不懂”

數(shù)據(jù)中臺(tái)業(yè)務(wù)配置項(xiàng)繁多，且邏輯復(fù)雜。這無(wú)疑加重了用戶的認(rèn)知負(fù)荷，導(dǎo)致操作低效。

這類現(xiàn)象稱為“看不懂”。針對(duì)該問(wèn)題，我們意識(shí)到可以利用圖形符號(hào)代替業(yè)務(wù)屬性，打造數(shù)據(jù)中臺(tái)的品牌感，讓抽象的概念和復(fù)雜的邏輯關(guān)系清晰可見(jiàn)，以此來(lái)降低理解門檻。

以近期工作中的數(shù)據(jù)方舟項(xiàng)目的首頁(yè)改版為例：方舟作為各業(yè)務(wù)線決策中心的統(tǒng)一分發(fā)入口，提供了集團(tuán)頂層數(shù)據(jù)知識(shí)及應(yīng)用；并且橫向接入數(shù)據(jù)工具、集團(tuán)智庫(kù)、數(shù)據(jù)應(yīng)用功能，縱向挖掘數(shù)據(jù)價(jià)值、搭建看板平臺(tái)。為了能夠更好的強(qiáng)化品牌認(rèn)知，打造更加智能的體驗(yàn)，我們進(jìn)行了這次的品牌升級(jí)。

舊版（before）首頁(yè)存在問(wèn)題：設(shè)計(jì)風(fēng)格比較沉悶，產(chǎn)品邏輯以及內(nèi)容不明確，品牌感弱。

改版后（after）：整體采用輕科技的設(shè)計(jì)語(yǔ)言，本著多元化、輕量化、簡(jiǎn)潔性的設(shè)計(jì)原則，重新定義了品牌符號(hào)，并將品牌符號(hào)以主視覺(jué)的形式展現(xiàn)，強(qiáng)化了用戶對(duì)數(shù)據(jù)中臺(tái)產(chǎn)品的品牌認(rèn)知。

同時(shí)在產(chǎn)品層面重新梳理了框架內(nèi)容以及交互邏輯，使得產(chǎn)品體驗(yàn)更就流暢（項(xiàng)目上線后得到公司的一致好評(píng)）。

三、中臺(tái)設(shè)計(jì)“看不見(jiàn)”

在中臺(tái)業(yè)務(wù)域中，有許多與C端緊密相關(guān)的場(chǎng)景，但我們似乎并未抓住這種適合互動(dòng)的機(jī)會(huì)，前中后臺(tái)之間缺乏溝通與聯(lián)動(dòng)。

整個(gè)系統(tǒng)就像一座冰山，前臺(tái)只是冰山一角，冰面之下隱藏著龐大的中臺(tái)系統(tǒng)，這就形成了前后之間雖然關(guān)系緊密但彼此看不見(jiàn)的情況。

四、結(jié)語(yǔ)

以上通過(guò)研究實(shí)踐，總結(jié)了一套適合當(dāng)前數(shù)據(jù)中臺(tái)可視化設(shè)計(jì)的方法。

首先分析業(yè)務(wù)場(chǎng)景，根據(jù)其特點(diǎn)確定場(chǎng)景類型，思考是否存在該類場(chǎng)景下的典型問(wèn)題，根據(jù)問(wèn)題定位設(shè)計(jì)策略，執(zhí)行匹配的映射法則。

做設(shè)計(jì)時(shí)，可以多維度提煉能夠描述該類場(chǎng)景的關(guān)鍵詞，然后尋找合適的載體參考物，進(jìn)行相應(yīng)的視覺(jué)載體設(shè)計(jì)。希望這次的內(nèi)容分享可以為大家?guī)?lái)幫助。

作者：環(huán)鐵藝術(shù)家；微信公眾號(hào)：58UXD

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

題圖來(lái)自Unsplash，基于CC0協(xié)議。