如何給后臺產(chǎn)品做設(shè)計？

首先解釋一下后臺，它是指服務(wù)的管理操作部分，主要是對內(nèi)容、數(shù)據(jù)的增刪改查。后臺產(chǎn)品也主要是To B 的平臺型產(chǎn)品，例如企業(yè)內(nèi)部的管理、運維產(chǎn)品。本文就自己一年多在后臺運維產(chǎn)品設(shè)計中遇到的挑戰(zhàn)和思考進行整理，一方面可以和大家分享經(jīng)驗，一方面可以好好的總結(jié)下自己。

在后臺產(chǎn)品的設(shè)計中，設(shè)計師充當了業(yè)務(wù)轉(zhuǎn)化為界面的「翻譯」，尤其是在團隊中沒有產(chǎn)品經(jīng)理時，設(shè)計師則需要對業(yè)務(wù)有更深的理解且具備更多的專業(yè)能力，協(xié)調(diào)需求方與開發(fā)，進行設(shè)計賦能。文章通過以下兩部分進行介紹。

一、后臺產(chǎn)品特征分析與設(shè)計挑戰(zhàn)

在工作中做后臺產(chǎn)品和做C 端產(chǎn)品還是有不小差別，以下僅以本人在設(shè)計工作中遇到的挑戰(zhàn)進行舉例，對比分析。

1. 業(yè)務(wù)理解難度大，專業(yè)詞匯多

接觸后臺產(chǎn)品的首要任務(wù)是對業(yè)務(wù)的理解，這點對于產(chǎn)品尤為重要，且對設(shè)計師來說較有難度。比如企業(yè)提供的云平臺后臺運維系統(tǒng)，如圖1，它涉及到云計算多種服務(wù)類型、數(shù)據(jù)結(jié)構(gòu)、業(yè)務(wù)邏輯及權(quán)限把控等，覆蓋領(lǐng)域非常廣泛，專業(yè)知識要求較強。這樣一個龐大的后臺、業(yè)務(wù)理解量對于一個新手（未接觸過后臺產(chǎn)品設(shè)計）來說，上手難度較大，并且這類后臺運維產(chǎn)品，都是公司內(nèi)部使用，很難找到可借鑒參考的案例，以往的經(jīng)驗也無法直接復(fù)用。再者，后臺產(chǎn)品中經(jīng)常使用各種技術(shù)專業(yè)詞匯，這都需要我們通過學(xué)習(xí)交流，了解其含義以及所在業(yè)務(wù)中的作用。

△圖1 云計算IAAS 基礎(chǔ)設(shè)施服務(wù)的業(yè)務(wù)組成

2. 用戶群體專業(yè)性強

我們面對一批具有專業(yè)性的高級用戶，此時設(shè)計師如果以「同理心」或「假裝用戶」的方法去推導(dǎo)會略顯蒼白。通過下圖，對兩類產(chǎn)品的用戶特征進行對比分析。C 端產(chǎn)品，用戶量較多，至少是幾萬用戶，用戶分布比較雜，文化水平和電腦操作水平各異，他們習(xí)慣于帶有引導(dǎo)的單線程操作，盡量簡化頁面信息。而對于后臺產(chǎn)品，用戶基數(shù)較少，以公司內(nèi)部的運維人員為主，人員特征相對集中，具備很好的電腦操作水平，用戶特征也較明顯，他們注重高效率操作，編輯時經(jīng)常采用輸入搜索、編輯代碼的交互方式，目標明確，快速精準直達；排查問題時需要多視角，多維度判斷問題。

△圖2 C 端與后臺產(chǎn)品用戶分析

針對不同的用戶特征，我們在設(shè)計界面時也有所側(cè)重。對C 端產(chǎn)品，用戶水平差異較大，設(shè)計界面應(yīng)盡量兼顧中間層用戶的理解度，使操作符合其認知，但對于后臺運維人員，過多的封裝可能會影響操作效率，哪怕鼠標懸停顯示、點擊查看詳情等。當然，過度封裝界面也可能會增加用戶理解的成本。

△ 圖3 用戶理解度與界面封裝的關(guān)系

舉兩個界面設(shè)計的例子，以更直觀的視角了解用戶特征對界面設(shè)計的影響。C端產(chǎn)品，如圖4，設(shè)計師在設(shè)計界面時會考慮適量的交互動效，吸引用戶；簡單直觀的導(dǎo)航和架構(gòu)，引導(dǎo)用戶；圖文結(jié)合的信息布局，注意信息疏密、留白，利于用戶閱讀效率和瀏覽心情；文案用語通俗易懂且注重情感化。

△圖4 C端產(chǎn)品界面  圖片來源：https://www.templatemonster.com/cn/demo/63945.html

而后臺產(chǎn)品，如圖5所示，在設(shè)計時會有以下側(cè)重：

△  圖5  后臺產(chǎn)品界面   圖片來源：https://dribbble.com/JanLosert

?   大多是滿屏信息，充分利用頁面空間。

?   頁面信息會包含技術(shù)人員習(xí)慣的英文專業(yè)術(shù)語，用圖標或中文很難清晰表達語義，識別率較低。

?   以圖表、列表、表單等形式進行數(shù)據(jù)展示，少有交互動效。

?   必要詳情信息外露，展示多維度的全局信息，便于用戶判斷異常的優(yōu)先級。

?   為常用操作留有入口且加大反饋熱區(qū)，便于用戶操作。

?   在組件選擇上要考慮可擴展性、信息連貫性，避免浪費空間，分散用戶注意力。

3. 產(chǎn)品設(shè)計思路存在差異

首先從需求來說，后臺產(chǎn)品，一般需求是技術(shù)或業(yè)務(wù)直接推進到需求。較少像C 端那樣通過用戶畫像、同理心等方法分析用戶的行為，發(fā)掘用戶需求。相比之下后臺產(chǎn)品的需求是明確的，但是，需求的明確并不代表需求的簡單。因為后臺產(chǎn)品的業(yè)務(wù)邏輯的復(fù)雜，同時流程性會更強。大量的字段堆積及繁瑣的操作都需要設(shè)計師去思考，將整個流程梳理清楚。在當前操作下哪個字段需要保留或者去除；業(yè)務(wù)流程如何跳轉(zhuǎn)才能清晰引導(dǎo)用戶；各種閾值如何有效顯示；一個頁面中操作會不會有關(guān)聯(lián)或沖突，這些都需要建立在對業(yè)務(wù)的足夠了解之上。

其次是設(shè)計產(chǎn)出，后臺產(chǎn)品有時出于技術(shù)角度，會先搭起主體架構(gòu)提供頁面，展現(xiàn)業(yè)務(wù)，之后可通過技術(shù)改進與用戶反饋進行迭代。C 端產(chǎn)品設(shè)計時一般都會由產(chǎn)品經(jīng)理與設(shè)計師一起討論好較全面、較完善的操作流程；相關(guān)功能和操作都配備齊全；注重用戶使用體驗與界面美觀。

△圖6 C 端產(chǎn)品與后臺產(chǎn)品設(shè)計對比

因此，在產(chǎn)品設(shè)計時就會有不同的思路側(cè)重。后臺產(chǎn)品「效率壓倒一切」，注重界面的實用性和操作效率，對交互細節(jié)要求不會很高，提供必備功能即可，用戶穩(wěn)定。C 端產(chǎn)品則是「體驗為王」，關(guān)注的是流量PV、UV 等數(shù)據(jù)，換句話說也就是產(chǎn)品更關(guān)注用戶的粘度，需要以美觀的視覺感受和流暢的交互體驗來滿足用戶。

4. 技術(shù)迭代快

物聯(lián)網(wǎng)、云計算等領(lǐng)域的快速發(fā)展，會催促技術(shù)的更新與迭代，后臺運維產(chǎn)品作為一個由技術(shù)團隊主導(dǎo)的產(chǎn)品類別，自然會受到影響，尤其是開拓中的新產(chǎn)品，會在技術(shù)的發(fā)展中不斷迭代，利用新的技術(shù)提升運維效率。

5. 需求層次存在差異

這里的差異主要是由于用戶管理目標的數(shù)量級、權(quán)限、習(xí)慣的不同所導(dǎo)致的。舉個例子，用戶管理50多個集群，一個一個進行多服務(wù)升級會很麻煩，這類用戶更習(xí)慣于通過代碼的方式直接批量修改，而對于運維數(shù)量級較少的用戶，則可以通過選擇服務(wù)及要升級的版本完成操作。

后臺產(chǎn)品的設(shè)計需要兼顧高級與初級用戶的使用習(xí)慣，既滿足操作高效，也要確保新用戶知道如何操作。既要提供必要的頁面流程引導(dǎo)，也要滿足相關(guān)操作的快速跳轉(zhuǎn)切換。這點會與C 端產(chǎn)品有所不同，C 端產(chǎn)品大多是由設(shè)計師確認好一條清晰的線性操作流程，用戶根據(jù)引導(dǎo)逐步找到對應(yīng)目標。

 

二、后臺產(chǎn)品設(shè)計思考

作為后臺交互設(shè)計師，有時不僅要充當PD，與業(yè)務(wù)方對接，負責(zé)需求的分析與功能結(jié)構(gòu)梳理，也要配合開發(fā)，進行測試驗收并收集上線反饋，甚至要負責(zé)相關(guān)視覺設(shè)計、使用推廣等工作。在具體的工作中，需要我們具備更加全面的視角，以下幾點思考與大家共勉。

1. 轉(zhuǎn)變自身態(tài)度

?   與團隊共建、協(xié)作，為產(chǎn)品負責(zé)。當團隊中職能界定模糊時，我們作為產(chǎn)品的用戶代表，需要為最終的體驗負責(zé)，協(xié)調(diào)上下游工作，確保產(chǎn)品為用戶提供所需的服務(wù)。

?   為用戶而設(shè)計，尊重用戶使用習(xí)慣。不同的產(chǎn)品所對應(yīng)的目標用戶也不相同，這需要我們立足于本產(chǎn)品，了解用戶的使用習(xí)慣、發(fā)掘痛點、洞見方向。

?   尊重平臺特性，了解技術(shù)限制。

?   設(shè)計賦能。向前分析需求，向后配合開發(fā)。

2. 深入了解自己的業(yè)務(wù)

這一點在后臺產(chǎn)品中尤為突出，了解才有發(fā)言權(quán)，才能提出合理建議，并正確推動前后端協(xié)調(diào)，否則脫離了業(yè)務(wù)，設(shè)計工作將無實質(zhì)意義，即無法解決用戶需求，也無法帶來優(yōu)質(zhì)體驗。

△圖7 后臺產(chǎn)品用戶體驗與業(yè)務(wù)的關(guān)系

3. 設(shè)計方法

?   協(xié)助梳理業(yè)務(wù)。把業(yè)務(wù)轉(zhuǎn)化為容易理解的內(nèi)容，整理出產(chǎn)品不同的角色、任務(wù)以及可能的頁面，提煉功能與內(nèi)容。

?   敢嘗試。提供備選A\B 方案，讓用戶基于一個可供討論和對比的界面進行反復(fù)修正，在此基礎(chǔ)上進行細節(jié)補充，提高產(chǎn)品設(shè)計效率。

?   小而快。把需求細分，快速進行產(chǎn)品開發(fā)與后續(xù)迭代。

4. 產(chǎn)品體驗標準側(cè)重

?   操作效率。后臺管理運維的數(shù)量級較大，會涉及到對多目標的重復(fù)性操作，如何簡化操作流程，合并重復(fù)模塊，減少選項，有效的設(shè)計信息是較為重要的一點。

?   準確性。面對大量信息和多維度的判斷，提供準確的信息展示與反饋同樣可以提高操作效率。例如精準文案，減少界面視覺元素的干擾，增加預(yù)防出錯的機制等，提高準確性，讓用戶聚焦于當前任務(wù)。

降低學(xué)習(xí)成本。后臺產(chǎn)品本身就具有一定的學(xué)習(xí)成本，這與它的專業(yè)性不可分割，那么在設(shè)計時，減少信息層級，利用運維用戶習(xí)慣的、純粹的元素與操作方式，能夠降低額外的學(xué)習(xí)成本。