編輯導語：B端工作台是B短産品一大必備的界面，但常常是設計一次之後就無人問津。有的工作台是能夠提升用戶的工作效率，但有的工作台卻是“雞肋”。本文旨在對B端工作台進行拆解，讓更多設計者了解到其中的設計方法以及體驗升級的設計策略，一起來看看吧。

引導語：本文針對B端産品的工作台進行拆解，幫助新手B端設計師了解工作台的設計方法以及體驗升級的設計策略，包含如何使用競品分析和度量方法，最後附贈案例拆解，助力融會貫通。

一、了解B端工作台

工作台是B端産品的一大必備功能，高度聚合的作用讓它常常作為“門面”身份出現（用戶登錄後第一個看到的頁面），但很可惜它并不是業務核心頁面，常常是設計一次後就無人問津。雖然有的工作台能夠幫助用戶提高工作效率，但是也有存在很“雞肋”的情況，使用性逐漸可有可無。那麼如何設計好B端産品的工作台呢？

下面我們從工作台的常見類型和功能幫助大家拆解工作台的體驗設計機會點。

1. 定義與特點

工作台是一個能幫助用戶快速掌握工作進展、進入工作狀态的導航頁面。

B端工作台具有細分功能導航的作用，幫助用戶減少尋找功能的時間。當B端産品具有多個使用角色時，會根據業務屬性進行工作台劃分，以此來滿足不同角色的使用訴求。

2. 常見功能

想要達成快速掌控工作進展、開啟處理工作事項，工作台一般具有以下五項常見功能：

（1）統計業務數據

用戶根據業務數據查看工作進度。不同的用戶身份在使用目标上有所不同，比如管理者角色，會根據業務數據調整戰略決策、安排下屬的工作内容；執行者會根據自己的完成進度來安排近期的工作内容，識别工作優先級。

（2）聚合高頻常用功能

常用功能又稱快捷功能，是指使用者工作中最常用的幾個功能選項。比如彙易聯是一個單據報銷平台，我們可以在工作台上快速的找到“提單據”這項功能。

（3）查看待辦事項

待辦事項跟業務數據都有查看工作進度的作用，兩者的不同點在于業務數據是以業務指标為基準明确工作進度，待辦事項是以數量這個維度來分析和查看。比如保險業務員的季度保險額，這個金額數值是業務指标；審核員需要審核保單的數量是待辦事項。

（4）明晰細分業務

B端産品的業務屬性會在工作台有所體現。比如：彙易聯，它的産品定位在于幫助企業全流程管控各類費用支出，屬于票據管理領域中費用管理這項細分業務，對應的常見功能有：我的賬本和快速提單，它們出現在工作台上，除了幫助用戶快速開展工作，減少細鑽外，還能夠幫助用戶識别産品的業務屬性。

識别業務性的隐性優點：增強産品記憶點，當用戶記住這個産品的核心業務功能。對于B端産品來說，在細分領域占據一席之地，實際就是掌握了精準客戶。

（5）高效獲取業務信息

為了方便使用者快速查看，有部分内容需要展示在工作台。比如：彙易聯的單據動态功能，就是在幫助用戶快速查看自己提交的單據最新動态，無需點開其他頁面，在工作台就能快速讀取。

3. 使用效能

（1）提高管理者的工作效率（為管理者提供戰略決策的輔助）

工作台聚合管理者每日、每月、每季度需要查看的業務指标，管理者在了解最新的業務完成情況後，對比公司業務指标可以調整戰略決策。比如第一季度目标是完成支付金額10w ，前三周隻完成2分之一，業務數據面闆輔助管理者完成工作。

這裡可能有同學會問了：那為什麼不用數據看闆去看呢？數據看闆看起來更清晰。

我的回答是：工作台僅展示最新的核心業務數據，點擊“更多”可以跳轉到數據看闆頁查看更多詳細信息。

（2）減少協作者的溝通時間

管理者下發的任務會直接展示在協作者工作台的待辦事項，每天上班打開工作台，第一時間了解今天的工作任務，方便協作者快速開展工作。

（3）增強部門工作協同效能

比如彙易聯單據狀态，可以看到流程目前流轉到具體哪位操作人。OA平台中，用戶當前審批狀态外置在工作台，也是可以方便用戶第一時間查看。

4. 常見的工作台類型

因B端産品複雜且多樣，以下僅對常見工作台類型舉例分析：

（1）工具類産品

特點：工具類的工作台因為功能全面，具有普适性。因為不僅功能多而全，還可以根據不同的使用訴求自定義工作台，由此提升用戶的工作效率和滿足用戶的個性化使用習慣。

舉例：常見的有飛書、語雀、釘釘的工作台。

（2）業務功能類

特點：強業務屬性，一般為“量身定制”型的存在。

第一種情況：B端産品業務壁壘性高、細分領域精細化的特點，很難做到一個工作台适配多種使用角色的使用訴求。這時就需要根據每個用戶的使用習慣、常用功能、典型數據去設計不同的工作台。舉例：比如彙易聯分為：銷售部員工版本、銷售部管理者版本、人事财務管理者版本三種工作台。天貓工作台也會分店長、老闆、美工、客服能多種使用角色的工作台版本。

第二種情況：平台内包含多類業務，業務之間沒有必然聯系，可以拆分業務功能賣給不同的客戶，這個時候，就需要根據業務屬性設計多個工作台。比如保險核心業務中續保業務和理賠業務就可以拆分賣出，配套兩個工作台，理賠中心工作台、續保中心工作台。

（3）業務數據類

特點：與業務功能不同的地方在于業務數據作為重要組成部分占據工作台頂部卡片模塊，而業務功能類的工作台并不是都含有業務數據的。業務數據類的工作台以查看業務數據為核心功能。

比如：微盟、淘寶、天貓工作台，對用戶最重要的部分就是業務數據，查看店鋪的銷售額、業績指标等等。

因B端産品複雜且多樣，以上舉例僅作常用工作台的分析，并不确保能夠涵蓋所有工作台的類型，歡迎大家留言補充，幫助自己和他人拓展眼界。

4. 工作台基本構成

工作台的基本構成與之前講過的常用功能有區别也有重複，基本構成不代表全部都需要展示在工作台上，搭配組合皆是為了滿足使用需要。

• 業務數據工作進度：一般以數據可視化的形式出現，用于告知用戶工作進度
• 待辦事項：告知用戶當前、當周的任務排期

快捷功能常用功能：快速開展工作或快速跳轉至常用頁面，無需在導航上一步步下鑽，節省時間，提高效率。

消息通知：一般包含系統消息、業務進展、功能信息三類。系統信息包含功能疊代和産品更新；業務最新進展包含最新業務數據更新；功能信息：包含業務流轉進度和上下級提交審核和被審核的進展。可根據重要程度選擇是否展示在工作台。

個人信息：當身份識别為核心功能時時出現，比如使用不同角色的賬号登陸天貓店鋪工作台，對應的功能是不同的，有時同一個賬戶兼職兩種身份，為了識别身份需要展示個人信息；但是在強業務屬性工作台（理賠與續簽）時無需出現，因為在賬号登錄時就已經識别了賬号權限，展示具體業務的内容。所以還需具體情況具體分析。

新手引導幫助中心：當用戶首次登錄時，新手引導負責向用戶介紹業務模塊及對應功能，用戶可以【一鍵跳過】，但當用戶需要的時候，必須有一個【入口】方便快速找到。當用戶從新手轉化為常用用戶時，新手引導也就切換成為了幫助中心。

5. 工作台功能模塊自定義

因為工作台的業務屬性、使用角色、使用訴求都有所不同，構成模塊可以根據需要進行展示和隐藏。目前有很多成熟的産品已經支持工作台内容模塊自定義，分享三個擁有自定義工作台功能且可以免費試用的産品，方便大家參考：

（1）Pingcode：拆分工作台功能模塊的體驗良好，可供參考

（2）ClickUp：國際化版本工作台自定義模塊可參考

（3）彙易聯：設置可見模塊，拖拽即可自定義布局

二、工作台體驗升級的目标拆解

B端工作台的設計難點，在于體驗設計師對于産品業務的了解程度。不僅要滿足産品需求出UI圖、出交互邏輯，還需要在産品商業價值、客戶價值、用戶價值上做到平衡。

1. 商業價值、客戶價值、用戶價值的區别

産品商業價值：産品功能滿足市場需求，持續為企業帶來利益，也就是賺錢，而且要賺長久的錢。

B端産品的購買者是客戶，也就是公司的老闆，但是實際使用的用戶是企業的員工。

客戶價值：我們的産品能夠幫助企業降本增效，也就是幫客戶省錢，比如節省人力成本、資源成本等等，對客戶來說就是有價值的。

用戶價值：那麼能夠提高用戶使用的體驗，幫助他們在工作中用的流暢，節省工作時間、提升工作效率，能夠讓他們早下班，這對用戶來說就是有價值的。

如果沒有做到真正的了解用戶，是沒辦法提升對應的價值點的。

2. 獲取客戶價值、用戶價值的渠道

如何了解産品用戶的價值需求呢？這裡跟大家分享兩個方法，一個是用戶調研，一個是競品分析。

用戶調研有兩種結果類型，定性分析和定量分析，搭配使用獲取更多、更全面、更有效的用戶數據。

競品分析是去了解同類競品的功能點、體驗設計優秀的部分，從更全面的角度分析用戶到底需要的是什麼，因為有的時候用戶是做不到準确表達自己的需求的。比如在建造交通工具的例子上，起初用戶描述的需求：想要一匹會飛的馬。但是我們要洞悉出用戶的真實需求是：想要更快速度的交通工具。

看看競品都在什麼功能上“使勁”，B端産品不做模仿，要在标準功能的基礎上做差異化，差異化價值才是我們的“賣點”。

3. 用戶角度：洞察問題

産品在0-1的發展階段時，工作台往往沒有真實的使用用戶，隻能根據産品邏輯和業務思維去建立。但當産品發展到一定階段，積累了用戶群，我們就需要聚焦典型用戶的使用習慣，打造出符合用戶需要的工作台。因為客戶和用戶是兩類人群，所以我們還要有辨别真僞需求、排列優先級的能力。

用戶調研能夠幫助我們深入各角色的使用場景，分析其業務重心和痛點，了解各個角色對于産品的期望。

用戶調研：

産品用戶可以分為三類：新手用戶、中級用戶、專家級用戶。

1. 新手用戶：沒有人願意永遠做新手，新手的目标是快速成為中級用戶；
2. 中級用戶：數量最多且比較穩定的，“即用即走”是他們使用産品的訴求；
3. 專家級用戶：對産品最為了解的一部分人，對功能有極緻要求，以追求産品更好的體驗為己任。

我們的做用戶調研的最終目标是拿到典型用戶畫像和用戶旅程圖。這兩方面的内容會幫助我們分析用戶功能使用的優先級。

在做工作台用戶調研時常用的方法：

• 可用性測試：産品發展的不同階段都會使用的一項用戶調研方式。模拟真實的使用場景，一對一觀察用戶的操作路徑，通過用戶的行為，分析用戶的心理，是驗證産品設計的必備手段，屬于定性分析。
• 用戶訪談：成本高，效果好。屬于定性分析，一般在産品積累了一定用戶人群和使用問題時去做用戶訪談效果最佳。
• 調研問卷：比較簡單的一種調研方式，可以在短時間内獲取大量用戶反饋的數據，屬于定量分析。因為B端産品的用戶都是付費用戶，獲取的數據具有真實性，但是我們要主觀分析哪些優先級需求更高，更能幫助産品标準化。
• 現場觀察：當新接觸某一業務領域的産品時，很難真的站在用戶角度思考問題，這個時候去現場觀察用戶真實使用場景，了解行業内幕，工作流程，是幫助産品和設計師快速了解“陌生用戶”的有效方法。

這些用戶調研方法也可以根據優化目标和優化時間段來劃分。

4. 版本優化前後：可用性測試

（1）優化前：定位需求

優化前目标：觀察用戶能否按照我們預設好的路線操作。

方法：召集10-15位目标用戶，使用基于産品邏輯的原型圖demo進行操作，觀察他們完成任務的過程，記錄完成任務所需時間。拿到數據後，分析與事先設想的産品邏輯偏差程度，進行疊代調整。

（2）優化後：驗證目标是否達成

比如我們的目标是提升用戶的操作效率。使用可用性測試，觀察用戶能否快速在工作台上定位自己想要的功能并完成工作，對比改版前後的使用時間，來确認是否達成優化目标。

5. 搜集用戶需求：調研問卷、可用性測試

（1）調研問卷

因為B端SaaS産品的用戶都是付費用戶，付費用戶有統一維護群，我們可以把調研發卷發放到客戶群裡，也因為是付費用戶他們也更樂意試用并反饋，有效幫助我們定期收集客戶的使用反饋。

（2）可用性測試

預約客戶體驗新功能，通過可用性測試獲取用戶需求是具有針對性的，可以快速定位到功能模塊，助于我們收集用戶需求，展開疊代優化。

6. 定義用戶畫像：現場觀察、調研問卷、用戶訪談

（1）現場觀察

有條件的話一定要到真實的使用現場去觀察，不要做任何判斷、不要說話，就單純觀察。

（2）調研問卷

這個方法能拿到比較多的用戶樣本，讓用戶畫像更為清晰。

（3）用戶訪談

用戶訪談會根據使用角色分類，有針對性的制定訪談方案。成本雖高，确是定義用戶畫像的好幫手。

本篇文章主要針對工作台體驗設計優化的案例帶練，以上内容就不再過多贅述，感興趣的夥伴可以留言～有機會為大家更系統的講解。

7. 借助競品：聚焦突破

B端産品的競品找起來是有很大難度的，是較為複雜的課題，這裡僅從工作台相關角度找尋競品并舉例分析，先分享幾個找B端競品的小技巧。

找B端競品的3個技巧：

1. 找競品前先向産品經理請教，他們是最懂産品的（注意平常要跟産品互幫互助，他們才會樂于分享）
2. 找同類競品的TOP：從艾瑞咨詢報告中找到細分領域的TOP1-3，訪問官網查看支持免費試用的産品
3. 當無直接競品的時：不同業内翹楚性競品、間接競品、細分領域優秀的“競品”都能作為參考點

如果找不到同類領域的工作台參考也不用着急，因為本身業務屬性、産品定位的不同，就不可能隻拿一個競品抄一抄敷衍了事。也正是因為這個特點，我們把工作台拆分成不同的模塊後，每個模塊都能找到可以參考的競品。

8. 拆分功能模塊的競品分析

拆分工作台的核心功能。以業務模塊的功能導向去尋找優秀的競品，僅對功能點進行參考。

這裡你可能會問：“哪些競品值得我們借鑒呢？”下面我依據工作台常用的五個業務模塊、一項特色功能做舉例分析：

（1）待辦事項模塊：對應項目管理專業軟件服務商

HRM系統：典型的項目管理/待辦事項功能，可以作為我們在做工作台待辦事項時的參考。不要被“直接”競品四個字束縛住，隻要是同類功能都具有一定的參考價值。

（2）業務數據模塊：對應BI系統、數據類開源組件庫

數據看闆在工作台上占有“一席之地”，想做好工作台上的數據模塊，當然要：專業的事情向專業的“人”請教。AntV、ECharts是國内可視化組件庫中的佼佼者。雖然它們“其貌不揚”，但是核心功能點是很“精緻”的，經得起推敲。我們可以借鑒功能框架，在此基礎上優化視覺，前端工程師還可以直接利用可視化組件庫中的代碼進行改寫，不僅節省設計時間，還有效提升開發實現的效率。

（3）常用功能模塊

工作台中的常用功能一般使用icon 文字的形式展示，功能icon承載了表現産品視覺品牌質感的責任，我們根據B端産品的業務屬性去設計。

（4）消息通知模塊：新聞中心

消息通知若需展示在工作台，可參考網頁類産品的新聞中心設計，根據消息屬性和通知優先級進行分類展示。

（5）新手引導幫助中心模塊

新手引導通常以模态氣泡卡片樣式 高亮指定區域出現，我在體驗彙易聯産品時，感受到兩點可以借鑒的方向，供大家參考：1.功能介紹的話術精煉，通俗易懂 2.模态可關閉也可快速找到，方便快捷有效。

以上舉例僅作參考，大家要學會發散思維，不要被“競品”二次束縛。

9. 差異化調整

有些内容無法直接拿過來照抄，下面我們看看如何差異化調整，做到“抄”的不留痕迹。

隻借鑒”靈魂“，不借鑒“肉身”。

靈魂指功能框架，肉身指視覺效果。功能有相似的部分，用我們需要的邏輯去展示。視覺效果上充分發揮本身産品的品牌調性，利用好品牌的特點。

比如：展示用戶需要錄入信息的内容分類，在功能上它僅僅是步驟條，用基本組件就能表現。但我們想給用戶更好的體驗，就需要無限接近用戶的“心理預期”，做到一方面減少用戶的錄入負擔，另一方面讓其對内容有基礎認知。

定位目标：關聯業務指标

設計優化方案所定位的目标若能與業務指标相關聯則可發揮最大價值。

業務指标與價值強關聯，商業價值指“真金白銀”續費。比如SaaS産品根據用戶的訴求，不斷完善産品标準化，提高簽約率和續費率，為企業賺錢。

客戶價值與用戶價值需借助專業的度量标準，其中UES模型應用場景較為适合B端産品。

10. 三步實現

如果設計師的方案跟業務指标相關聯時，更容易獲得團隊的認可，推進的也會更加順利。當然這不是一件簡單的事，在工作台的設計中，可以通過以下三步實現數據度量支撐設計改版：

（1）明确體驗問題

明晰産品發展目标，點對點突破（設計不要自嗨）。以提升操作效率為主，提升相關業務效能為輔。力求每個體驗優化點都能解決實際問題。比如本次改版工作台要提高管理員下發任務的效率、工作台易用性、客戶滿意度，效率這個可以用時間度量，易用性和滿意度需借助度量模型。

任務頁效率（下發效率）：指下發功能通過步驟簡單化、減少下鑽、降低理解難度，從而提升效率。

易用性：指功能對用戶來說難度程度高低，比如功能入口是否易識别，可以快速找到；操作步驟是否符合用戶使用習慣；浏覽内容時可以快速閱讀和理解；不恰當操作時是否有提示和限制；錯誤操作時是否有提示，提示後用戶能夠繼續完成任務等。

滿意度：工作台在滿足功能的情況下，對用戶有吸引力、産品界面友好給人舒适感、專業性高；當用戶需要幫助和引導時能夠滿足他們的需求；用戶對品牌有贊美、能信任、願意持續使用等。

（2）借助度量模型或者工具

UES：UES是阿裡雲中心基于易用性去擴展而成的度量模型，核心維度包括易用性、一緻性、滿意度、任務頁效率、性能。易用性是B端産品的重要屬性，他的背後就是易用性量表的标準，與常規的易用性量表對比來說更為成熟和精細化。

（3）獲取數據驗證

SUS系統可用性度量表：SUS是評估産品可用性的一個花費少，但十分有效的工具。該量表包含了10條定向問題，每個問題均為5分，按強烈反對（1分）到非常同意（5分）評分。

系統可用性量表最終算出的評分達到70分左右，就可以比市面上一半産品可用性要好，也就是說這個産品的用戶體驗算是合格了。（各位感興趣的夥伴可自行網上查詢可用性量表）

CES易用性度量表：易用性包含易學性、易操作性和清晰三個維度。反映産品對用戶而言是否易于學習和使用，改版前後進行分别使用易用性度量表調研用戶使用反饋，對比分析是否達成易用性的提升。

提升易用性可以降低學習成本，從而提升用戶滿意度、操作效率、任務完成率等。

三、工作台體驗升級的行動和策略

1. 明确使用目标，拆分内容優先級

經過前期的競品分析、用戶調研，我們已經拿到了用戶畫像，對每個角色對應的工作台功能已經有所了解。下面我們使用矩陣法，拆分内容模塊的優先級。

矩陣法：根據使用頻次和重要程度，分析和劃分業務模塊優先級。矩陣法顧名思義，X軸Y軸分别代表使用頻次和重要程度，右上角為重要程度和使用頻次更高的業務功能模塊，那麼越靠近右上角的功能則優先級越高。

特别是在單一工作台不能滿足多個使用角色時，矩陣法能夠幫助我們快速辨别功能優先級。

2. 栅格系統助力模塊劃分

栅格系統（Grid Systems）：最早來源于平面設計中的網格系統，互聯網發展之後，界面設計将這一概念借用過來，簡易的理解栅格就是一種有規則的參考線。

栅格系統主要由列、水槽、邊距三個基本元素構成。

3. 栅格的作用‍

• 對用戶：提高内容布局規律性，減少認知成本。通過栅格系統規劃設計功能模塊，頁面信息的展現更加清晰，從而提高用戶的閱讀和浏覽效率，提供更好的用戶體驗。
• 對設計師：提高效率與規範化。幫助設計師快速校準元素在界面内的位置，節省基礎度量（小學數學加減法計算間距等）的時間。避免設計師團隊因感覺不一緻造成規範不統一的現象。
• 對開發：提高設計還原度，節約時間成本。栅格系統提高了網頁的規範性，一次開發多次複用，提高開發人員的工作效率。
• 響應式布局：栅格能夠幫助工作台在自定義功能模塊時，界定模塊的寬度規範。

常見的兩種删格：12栅格、24栅格

12删格：

舉例：屏幕寬度1440px、左側導航寬度256px、兩個間距16px，剩餘寬度為12*列寬 11*槽寬

特點：欄數較少，适合業務簡單的工作台使用，因為簡單的業務會不出現密集的信息，所以使用12栅格足以。

24删格：

舉例：屏幕寬度1440px、左側導航寬度256px、兩個間距16px，剩餘寬度為24*列寬 11*槽寬

特點：欄數更多，當工作台模塊多且複雜時适用，因為欄數越多，分出的模塊越細緻，能夠承載更多複雜的内容，也是目前B端産品常用的删格列數。

栅格的兩種适配方式：拉伸間距、拉伸邊距

拉伸間距：卡片區域寬度固定，栅格寬度不固定，卡片與卡片之間的距離來适配多餘的寬度

拉伸邊距：與拉伸間距相反，删格寬度（卡片之間的距離）是固定的，卡片寬度适配多餘的寬度。對齊方式有居左（右邊距伸縮适配）和居中（左右邊距同步适配伸縮），居中的對齊方式更為常用。

4. 建議選擇：栅格固定，拉伸内容

拉伸間距和拉伸邊距時常見的兩種拉伸方式，但是都會壓縮我們的展示空間，所以采用了一種全新的适配方式：即栅格固定，拉伸内容。

簡單來說就是，邊距和間距都采用固定值，适配的過程中會采用不同的縮放策略對卡片内容進行伸縮，用卡片來适配多餘的寬度（或高度），這樣我們的展示空間就随之變寬，可以承載更多内容。

優勢：采用自動填充布局可以有效提升内容占比，提升屏效。

5. 優化視覺風格，提升品牌質感

關于工作台的體驗升級策略，前面講到拆分業務功能優先級和栅格系統助力模塊劃分，最後一步才是優化視覺風格。B端産品始終以業務功能服務用戶為導向，視覺設計僅為輔助。下面有三點可以幫助我們做B端工作台的視覺體驗升級：

（1）幫助/引導/歡迎插畫

插畫設計在B端産品中出現的機會較少，一般在工作台以情感化傳達出現，期望與用戶建立親密關系，圖片相較于文字傳達效率更高，提升用戶對内容的掌控感和品牌信任度。

（2）常用功能圖标

B端産品體現視覺設計感的地方比較少，圖标設計為其中之一，将品牌質感融入圖标設計中，體現品牌調性，比如科技、金融、創新、友好的關鍵詞都能通過圖标設計去展現。

（3）業務數據

數據可視化的設計點在于用單一卡片模塊展示較多的業務數據，讓用戶在工作台就能對最新數據有一個了解，這裡就不能以視覺效果為主了，要以功能簡單好用為重點，适當表現産品風格即可。

四、案例拆解

1. 需求與問題

随着工作台橫向業務不定期的需求輸入，業務管理平台的功能服務量級的逐步增加，催生設計師思考：如何用設計上的最優解，來搭建交易管理工作台的體驗框架？這個問題，在共建過程中我們确立了2個核心設計目标：清晰、高效。

問題描述：管理員的首頁工作台信息過于簡單，查找信息低效，分發能力差，難以完成【快速識别業務進展】【管理下屬的工作内容】的使用訴求。

2. 用戶畫像與使用目标

通過前期用戶調研建立的用戶模型，即用戶畫像（人物模型）幫助我們确定哪些任務重要，原因何在，再提煉出核心使用場景并定義需求，最後優化頁面框架。

使用目标：

管理員：查看最新業務數據、審核員工作完成情況、審批員工申請

業務模塊：

涉及到的業務模塊有：身份信息、待辦事項、數據概覽、交易列表、常用功能、交易列表（業務強相關）等

3. 定位改版目标

從使用問題出發，找到使用訴求與工作台現狀的差異點，明确改版後工作台需要擁有的能力，即為本次設計改版目标。

4. 功能拆解與模塊劃分

矩陣法：區分功能優先級

使用矩陣法，區分業務功能的使用頻次和重要程度，重新劃分業務模塊。聚焦管理者關注的核心功能，減少高頻功能的操作下鑽。

24栅格：功能模塊重構

使用24栅格系統為工作台重新布局，規範化内容區域。清晰明确的操作主線可以減少用戶的理解成本，讓用戶快速準确地按照預期獲取信息，提升用戶使用體驗。

遵循浏覽動線，優化信息布局和視覺比例，突出核心數據。遵循【清晰】的設計原則，明确的布局結構決定用戶的浏覽動線，幫助管理員高效便捷的獲取信息。

模塊化設計，還可以為後續業務拓展：新增模塊、功能時提供便利。

5. 視覺質感，體驗細節

（1）強化色彩聚焦

通過顔色對比，強調重點信息，第一眼透傳，聚焦用戶注意力。

（2）提升信息對比

通過文字大小的對比，突出核心信息。

（3）信息降噪

當頁面内容過多時，弱化輔助信息，為頁面降噪。

6. 拿到反饋，持續疊代

我們體驗設計師的目标是幫助産品在體驗設計的角度上不斷進步，幫助産品完成标準化的沉澱，從而“賣給”更多的目标客戶，賺取更多的“真金白銀”，這樣才能體現設計師的能力與價值。

總之，無論是SaaS産品标準化，還是交付項目幫助産品标準化，都需要不斷的疊代和優化，版本疊代上線後，拿到改版前後的數據對比分析，驗證設計方案或找到對應問題的反饋，繼續鑽研疊代下去。

五、文章總結

這篇文章不僅幫助新手B端設計師了解工作台如何設計和優化，還以全局的角度剖析了頁面改版的“心酸曆程”。

工作台的體驗優化升級之路難點在于要貼合用戶的使用訴求，抓住用戶、客戶的内心價值點，其他視覺層面的升級僅為輔助。

設計B端工作台的方法簡化起來很簡單，可總結為3點

1. 初次設計：以産品訴求為基礎，做出demo驗證功能的可行性。
2. 優化設計：調研用戶真實使用場景，拿到功能使用路徑，分析優先級。
3. 視覺設計：模塊劃分、品牌質感、情感化傳達皆為功能輔助，一切以提升使用效率，滿足用戶内心價值點為己任。

本文由 @EllieOne 原創發布于人人都是産品經理，未經許可，禁止轉載

題圖來自Unsplash，基于CC0協議。

,

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!

查看全部