起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識B 端產品與企業之間，從來不只是買賣關系
#本文為2022摹客RP原型工具測評大賽優秀獎作品
對于B端產品而言，大多會陷入一個誤區：B 端產品注重底層邏輯而非體驗，但其實無論是B端還是C端用戶，考慮產品體驗都是其產品發展的第一準則。本文以摹客RP為例，論述B 端產品與企業之間，從來不只是買賣關系，優化產品體驗才能夠提升企業的運作效率，是值得關注的一點。
一、淺談 B 端產品經理發展趨勢
提到 B 端產品，習慣性將其定義為把功能或服務售賣給企業的軟件，相較于 C 端產品在用戶感受和創新玩法有較外顯的表現方式，多數人會陷入“B 端產品注重底層邏輯而非體驗”的誤區，但無論是什么類型的產品，最終都是一個個真情實感的用戶在使用，何況 B 端產品在獲取成本上大多又比 C 端產品高，在市場和客戶需求的不斷變化下，“用戶體驗”從來都是各類產品應該保證和關注的。
隨著云計算、AI 智能、教育和產業互聯網的興起，率先獲得新方案的 B 端企業開始思考如何將技術變現，很多大廠愿意投入較多資源在 B 端領域的產品建設，消費互聯網起家的騰訊著手打造產業鏈，阿里巴巴耕耘多年阿里云系列開始產生經濟效應，市場上B端產品經理的崗位需求隨之大增，如下圖調研報告中提及，產品經理的工作內容大多涉及 B 端方向。
（圖片來源：騰訊問卷 2020 產品經理生存報告）
我目前負責的產品是為元件供應商和買家之間交易服務的在線商城，可以簡單想象成一個只賣電子元器件的淘寶或天貓，算是帶點 C 端調性的 B 端產品。
剛接手這個產品時，我也一直秉持著“只要功能符合業務需求即可”，加上公司開發人力有限和著急開拓新盈利模式，便把資源全花在推進新功能上；直到追蹤新功能使用數據發現不如預期，深度訪談了供應商和買家之后，才得知原來我們早期開發的部分基礎功能已不符合當今市場趨勢下的使用習慣。
就算新功能是來自最近搜集的用戶需求，依然衍生許多問題和使用意向低落的情況，產品團隊因此決定重新定義基礎功能以進行網站改版，也才讓我意識到原來 B 端產品與企業之間，其實真的不只是提供合乎業務邏輯的服務，更是以伴隨著企業成長的角度，在各階段提供合適的產品功能來協助企業標準化流程和成本節約，而整件事便脫離不了對產品體驗的追求和死磕。
二、怎么開啟產品體驗優化之路？
在開始闡述優化體驗前，先定義 B 端產品三種常見頁面：
1. 落地頁面
即用戶登入產品后的第一個畫面，透過這個頁面去找到對應功能，將用戶分發到不同頁面去，因此落地頁面通常會以主畫面+側欄的形式展開功能清單，搭配幫助中心避免用戶迷路而流失。
（圖片來源：Freshdesk 落地頁）
2. 工作頁面
用戶會沉浸的進入功能界面，以處理特定任務為主，此頁面需要降低對用戶干擾，幫助用戶高效且合理找到所需的功能，在 UI 上會減少花哨布局，盡量以聚焦簡約的方式讓用戶專注各種功能操作。
（圖片來源：Axure 操作頁）
3. 管理頁面
對應前臺應用的后臺管理系統，舉凡成員角色權限、管理報表呈現方式、工作臺配置形式等，輔助用戶建立組織操作體系及降低用戶的使用成本，通常會按照管理類別細分為多個頁簽。
（圖片來源：Wix 設定頁）
在不同頁面中，產品經理需要關注的優化重點也大有區別，例如落地頁面的圖示和導航是否足以清晰引導用戶？工作頁面的功能布局及工作區大小是否合理？管理頁面的各項權限切分是否符合目標對象的組織邏輯？
而產品經理也常接收到各種渠道的用戶反饋，可能來自內部同事、高層的主觀使用建議，或從競品調研、自查獲得客觀數據，不過請留意是“關注”反饋而非被“要挾”，才能在兼顧用戶體驗時，保有產品核心定位及普遍適用性。
三、為什么原型圖對產品經理如此重要？
在完成用戶反饋搜集之后，產品經理需要繪制幾種圖來向不同對象表達需求規劃：
1. 角色/關系圖
描述產品業務如何運作，每個角色在此業務邏輯下彼此的交互行為和信息傳遞方式，通常在搜集業務需求之后梳理角色用。
（圖片來源：我司產品管理后臺功能關系圖）
2. 業務流程圖
整理用戶各種行為產生的數據，在不同頁面之間的流向，并標記可能產生異常的環節?？此坪唵蔚男袨橐矔婕扒爸泻笈_的數據流轉，舉例來說：用戶在雙十一買了兩個不同店家商品，并點擊下單并完成付款，此時會觸發訂單信息從前臺被拋到中臺，中臺使用后臺預先傳遞的整合資料包處理訂單，最終再將訂單信息拆送到貨運系統、客戶售后管理系統、財務金流系統等。
（圖片來源：我司訂單系統后臺流程）
3. 頁面流程圖
以前述的業務流程圖為基礎，輔助各功能頁面示意圖（通常會把頁面中會引發交互的關鍵功能列出，但不會呈現頁面排版布局），更具象的表述是哪一個頁面元素讓用戶在頁面之間發生跳轉，完善整體交互流程。
（圖片來源：如何正確畫出頁面流程圖）
4. 原型圖
細化每個頁面，進一步闡述頁面元素及相對位置、跳轉邏輯、設計要求、交互目的傳達，在正式進入開發階段之前必備的溝通圖檔，也產品經理最重要的技能之一。
（圖片來源：我司標簽管理后臺原型圖）
在優化產品體驗的過程中，產品經理首先需要把“故事（為什么提這個需求）”說清楚，而要說好一個故事，具象的“場景（用戶使用情境是什么）”和“角色（哪些人是我們的用戶）”有助于“讀者（處理需求的人，包含設計、開發團隊）”更快的進入狀況并理解脈絡。
因此，對于產品經理來說，一個好用的原型圖工具便是能將故事講明白的橋梁，原型圖既能體現自己的構思和想象，又能讓協作人員更直觀掌握你的核心訴求從而將其實踐。下圖為騰訊問卷 2020 產品經理生存報告的調查結果，超過八成的產品經理表示工作內容中包含“產品設計”，繪制原型圖能力的重要度可見一斑。
（圖片來源：騰訊問卷 2020 產品經理生存報告）
產品經理大多以產出低保真原型圖為主，確保流程和元素能夠傳達設計細節與功能理念，高保真原型圖則多交由設計團隊接手，產品經理可依據自身成熟度和使用習慣選擇對應工具，外企或海外較常使用的原型圖工具 Axure、Figma 的特點在于交互效果強大，但對初學者有較高的學習門檻，對企業在選擇組織協作工具也是一筆成本，也因此現在有越來越多的產品經理傾向選擇免費一站式且有更多團隊協作功能的平臺，來產出高質量的原型圖優化產品體驗，這也是近期我開始調研原型圖平臺的原因。
四、摹客 RP 如何助力原型圖產出？
在比較工具的過程中，我發現了大學時期曾使用的 Mockplus 經典版，在近期推出了在線原型設計功能——摹客 RP，適逢公司在下個開發周期準備進行全網站改版，身為老用戶的我當然得借此機會試試新功能。
首先簡介我司“全網站改版”這個項目：
- 背景：我司網站雖有在每個開發周期推出新功能，但舊的頁面一直缺乏優化，很多早期規劃的 UI 和功能現已不符合使用趨勢及習慣，也無系統性的做過全網站調性調整。我們將全網站拆成類型頁面按服務類型、頁面種類分三個開發周期優化，來推動全網站 0 上線。
- 測試頁面：這次主要在摹客 RP 繪制的是供應商店家頁，此頁面需要呈現內容包含：信息公布欄、供應商簡介、產品線、亮點產品、技術支持文章、問與答，屬于改版幅度較大的頁面，因此需要產出大量的原型圖來說明不同按鈕或功能的交互關系。
再來說明使用原型圖工具時，我自己最重視的幾個層面：
- 面板布局合理性：過于復雜的功能擺放層級，光是找尋功能就會耗費大量時間，不合適的工作區域功能和布局調整方式，將增加繪圖過程的使用和學習成本。
- 預設組件和圖標數量：若是每個組件都需要自己從頭拉圖和設定交互，圖標得自行從網上下載或依賴設計師手繪，將降低原型圖的產出效能。
- 交互形式及設置彈性：交互方式決定原型圖的豐富度，組件、畫板、頁面都應該開放設置彈性來強化操作效果，多樣且精細的交互更有助于協作人員理解及還原需求。
- 歷史版本與演示方式：產品經理經常遇到需求變動和版本迭代，尤其 B 端產品設計的業務邏輯復雜，每次原型圖變更都需要被妥善保存，并在展示時零誤差還原所有內容。
這次透過摹客 RP 繪制原型圖的過程，我也以上述四點當作主要測評的方向，對比平常慣用的 Axure，發現摹客 RP 非常符合我制作原型圖的訴求，以下結合摹客 RP 界面截圖和自己使用的經驗分享。
這次商店頁面涉及前后臺的功能設計，前臺需要輪播圖、下拉選單、面包屑等豐富的內容呈現方式，后臺又需要有對應的設置功能，在組件的類型上有較復雜的需求。
摹客 RP 內建組件幾乎覆蓋了所有功能類型，海量且高質感的圖庫讓我在繪制時能找到最合適的圖標，有效制作引導用戶操作的后臺功能，還可將此次建立的顏色、樣式、組件儲存為設計資源，或者請設計師提前建制資源庫，日后即可透過共享的方式讓其他項目共同使用。
界面布局可說是摹客 RP 最大的亮點。之前常遇到的問題是，當單一頁面有許多層交互畫面時，往往會變成用疊加的方式將頁面變化一層層蓋上去，每次要編輯其中一個畫面就需要點開圖層調整，有時候容易誤觸或整個模塊被拖拉到。
摹客 RP 的輔助畫板正好可以解決這個問題，在輔助面板上制作功能的交互流程有效將工作區劃分開，分別來制作主流程和次流程，再透過交互設定來關聯主次畫板的流程；而當畫板一多（像這次光是一個頁面改版我就畫了十幾張圖），右下角導航面板的重要性也體現出來了，透過導航面板可以在茫茫圖海中加速找到目標頁面，這是大部分原型圖工具都不具備的功能，一般比較常見于設計師使用的高保真繪圖工具中（如 Figma）。
再來是頁面或組件之間的交互設置方式，以往 Axure 的做法是從側欄中按頁面順序設定交互，但摹客 RP 是透過托拉的方式將頁面形成交互與鏈接，可指向整個畫板或其中的單獨功能，托拉過程也會有輔助框線幫助用戶理解交互影響的范圍，讓操作過程可視化程度提升。
最后是歷史記錄和演示的部分，歷史記錄清晰記錄由哪一位成員編輯和版本變動時間，方便控制版本內容和成員狀態；而演示模式則高度還原原型圖內容，Axure 時常在發布到云端后會有位置和樣式變形的情況，展示上也沒有太多的彈性。
最后
毫無疑問摹客 RP 是一款足以將原型圖制作過程變得更流暢的工具，在產品功能越趨復雜的設計過程中，透過簡化使用成本讓產品經理將心思更著重在思考產品本質及用戶需求中，讓用戶體驗優化的過程不再是產品經理一人的孤軍奮戰。
扣回題目本身，B 端產品與企業之間從來不只是買賣關系，如何從優化用戶體驗賦能產品價值進而提升企業運作的效率，是每個 B 端產品經理都應該關注的事情，讓企業與 B 端產品形成互補與增益關系，讓每個產品都能成為改變世界一部分的起點。
本文為2022摹客RP原型工具測評大賽的測評文章，如對摹客RP感興趣可點擊體驗鏈接：https://www.mockplus.cn/rp-event/?hmsr=woshipmhuangjie
本文由 @三十七天 原創發布于人人都是產品經理，未經許可，禁止轉載。
題圖來自Unsplash，基于CC0協議。
該文觀點僅代表作者本人，人人都是產品經理平臺僅提供信息存儲空間服務。
- 目前還沒評論，等你發揮！
