編輯導(dǎo)語(yǔ)：混合云控制臺(tái)的用戶體驗(yàn)具有數(shù)據(jù)量大、維度多、多樣視角等特性。本文作者介紹了混合云控制臺(tái)在“易用性”方面的工作，從易操作、清晰、易學(xué)易理解、開放四個(gè)方面進(jìn)行優(yōu)化，一起來(lái)看看吧。

在上一篇文章《我在混合云做控制臺(tái)：一致性體驗(yàn)升級(jí)》中，我們介紹了混合云控制臺(tái)的業(yè)務(wù)背景，以及設(shè)計(jì)師在平臺(tái)體驗(yàn)“一致性”方面所做的提升。今天繼續(xù)介紹我們?cè)?strong>“易用性”方面的工作。

混合云控制臺(tái)的用戶體驗(yàn)具有“數(shù)據(jù)量大、維度多”“業(yè)務(wù)邏輯有一定理解門檻”“多樣視角”等特性?；诖?，我們從以下四個(gè)方面進(jìn)行易用性的設(shè)計(jì)優(yōu)化：

一、易操作：增強(qiáng)預(yù)判性

1. 關(guān)鍵信息前置，收攏關(guān)聯(lián)內(nèi)容

在企業(yè)級(jí)產(chǎn)品中，頁(yè)面層級(jí)相對(duì)較深，完成一個(gè)任務(wù)需要經(jīng)歷多次跳轉(zhuǎn)，如果從業(yè)務(wù)上判斷流程無(wú)法縮短；那么還有一個(gè)思路——增加預(yù)判性設(shè)計(jì)：根據(jù)場(chǎng)景，讓功能和信息主動(dòng)找到用戶，從而自然產(chǎn)生交互。將能輔助判斷的信息前置，幫助用戶提前過(guò)濾掉不需要深入的路徑。

例如，在“列表頁(yè)>詳情頁(yè)”這種路徑中，我們?cè)诹斜眄?yè)增加暴露了一些有關(guān)詳情頁(yè)的關(guān)鍵字段值（如果值為0的話，用置灰的方式加以區(qū)別），那么用戶就可以提前排除其中不需要查看的部分。

2. 時(shí)刻對(duì)總量有感知

在數(shù)據(jù)量較大的頁(yè)面上，設(shè)計(jì)師希望通過(guò)提前展示總量的方式，讓用戶對(duì)自己管理的內(nèi)容心中有數(shù)，而不需要去逐一瀏覽具體內(nèi)容。

設(shè)計(jì)師一方面在通用列表頁(yè)的頁(yè)頭增加了“概覽數(shù)據(jù)”區(qū)塊，用直觀的統(tǒng)計(jì)數(shù)據(jù)匯總了列表信息；另一方面，在tab上增加統(tǒng)計(jì)數(shù)字，無(wú)需點(diǎn)擊就可以感知管理狀態(tài)，提高決策的準(zhǔn)確性。

3. 基于多權(quán)限視角，優(yōu)化文案指向性

在混合云控制臺(tái)上，企業(yè)各級(jí)組織、各職能角色所具有的權(quán)限范圍各不相同，可能出現(xiàn)“有查看和操作權(quán)限”“有查看權(quán)限、無(wú)操作權(quán)限”“無(wú)權(quán)限”等多種情況。

因此從設(shè)計(jì)上需要建立“多角色、多權(quán)限、多視角”的思路，梳理一個(gè)場(chǎng)景在不同的權(quán)限范圍下，會(huì)出現(xiàn)哪些狀況，并給出對(duì)應(yīng)的引導(dǎo)流程。

例如在配額管理中，“無(wú)法修改配額”這種報(bào)錯(cuò)，通過(guò)多權(quán)限視角分析，其實(shí)對(duì)應(yīng)了多種原因，于是優(yōu)化了文案的指向性，便于用戶快速定位錯(cuò)誤原因。

二、清晰：強(qiáng)化信息分層

1. 優(yōu)化圖表，整理信息層次

在業(yè)務(wù)邏輯復(fù)雜的頁(yè)面中，設(shè)計(jì)師對(duì)原設(shè)計(jì)進(jìn)行分析，重新梳理數(shù)據(jù)關(guān)系，提出更符合數(shù)據(jù)性質(zhì)的圖表展示方式；并嘗試通過(guò)對(duì)圖表的進(jìn)一步解讀來(lái)幫助用戶理解數(shù)據(jù)的構(gòu)成關(guān)系，形成合理的信息層次。

2. 避免平鋪，增強(qiáng)通用的信息排序能力

面對(duì)大量信息，我們可以進(jìn)行合理的分層，引導(dǎo)用戶通過(guò)觸發(fā)動(dòng)作來(lái)展示詳細(xì)信息；或者提供排序和自定義能力，將最關(guān)注的信息放到重要的位置。

在新版本中，設(shè)計(jì)師與前端同學(xué)一起對(duì)表格的通用能力進(jìn)行了升級(jí)，默認(rèn)提供自定義列表字段、對(duì)字段進(jìn)行排序的能力，并通過(guò)前端開發(fā)解決方案 Teamix Pro 中的 ProTable 來(lái)規(guī)范化落地。

一個(gè)云資源列表常常有十幾列數(shù)據(jù)，用戶可以根據(jù)工作范圍，將自己關(guān)注和常用的數(shù)據(jù)提到前面，將不常用的數(shù)據(jù)隱藏起來(lái)。未來(lái)甚至可以按照用戶角色提供默認(rèn)折疊低頻數(shù)據(jù)列的能力。

三、易學(xué)易理解：提升瀏覽效率

1. 用含義明確的名稱替代機(jī)器碼

云資源管控場(chǎng)景優(yōu)先關(guān)注效率，這決定了我們?cè)谠O(shè)計(jì)上更注重通用性和標(biāo)準(zhǔn)化；但是站在體驗(yàn)設(shè)計(jì)師的角度，我們也在探索如何在不影響操作效率的前提下優(yōu)化易用性。

一個(gè)云資源具有名稱、ID 等若干屬性，以前在管控場(chǎng)景中，都以資源 ID作為唯一識(shí)別；資源 ID 具有全平臺(tái)唯一、不會(huì)缺省的優(yōu)點(diǎn)，但自動(dòng)生成的機(jī)器碼 ID 在易讀性和辨識(shí)性上弱于人為命名的資源名稱。

因此，我們將詳情頁(yè)標(biāo)題等位置由資源ID改為了資源名稱，提高辨識(shí)效率；而在列表字段等位置，考慮到用戶有復(fù)制 ID 進(jìn)行搜索的需求，以及資源名稱可能缺省，依然使用資源 ID 作為主要識(shí)別字段。

2. 通過(guò)規(guī)律分區(qū)使數(shù)據(jù)易讀

大量平鋪的信息需要通過(guò)有規(guī)律的分區(qū)來(lái)實(shí)現(xiàn)結(jié)構(gòu)化，使數(shù)據(jù)能夠自我表達(dá)?；旌显瓶刂婆_(tái)上的表格頁(yè)面包含各種類型的字段，為了使數(shù)據(jù)更加高效易讀，我們通過(guò)前端開發(fā)解決方案 Teamix Pro 中的 ProTable，對(duì)不同數(shù)據(jù)類型的默認(rèn)對(duì)齊和省略方式提供了內(nèi)置規(guī)則，設(shè)計(jì)師和前端開發(fā)者均無(wú)需再重復(fù)花費(fèi)精力逐一調(diào)整。

四、開放：擴(kuò)展自定義能力

1. 品牌風(fēng)格自定義能力增強(qiáng)

混合云的部分客戶具有二次售賣的使用場(chǎng)景，此時(shí)需要去阿里云化，強(qiáng)化客戶品牌的暴露。因此本期從設(shè)計(jì)上提升了平臺(tái)視覺風(fēng)格的自定義能力。

例如，優(yōu)化了登錄頁(yè)背景圖及文案的定制能力，盡可能兼容用戶上傳的各種樣式和風(fēng)格的背景圖，幫助用戶更好地透出自身品牌調(diào)性，打造獨(dú)特性的品牌認(rèn)知。

作者：和越；公眾號(hào)：Alibaba Cloud TxD

原文鏈接：https://mp.weixin.qq.com/s/NrvTl4I-BVprpKcdFiwklg

本文由 @Alibaba Cloud TxD 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

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