設計師如何為B端產品創造價值

Sponsor

作者：yuqiaoshuo 公眾號ID:yuqiaoshuo

相信很多傳統UI設計師在接到后臺設計需求的時候，內心是抗拒的：表單為主的界面讓我們空有一腔視覺技法無處發揮，而后就是懵逼的，prd里寫的到底是什么鬼，每個字雖然都認識，但是為什么連在一起就看不懂？

在傳統設計師擅長的表現、體驗層上，業務方意識里并不看重，立項評審都沒有邀約設計師的習慣；在設計師不熟悉的業務邏輯上，錯綜復雜，牽一發動全身：對此我們簡直不敢多說話。

弱小、可憐、又無助可以形容B端設計師的被動局面了。畢竟，如果不看重視覺、也不看重用戶體驗，產品和開發兩個人其實也可以商量著把活兒干了，方便、快捷還省事兒…

設計師如何在B端產品中獲得更多話語權，從而發揮更大價值？

下面我會分別從戰略層、框架層、交互層、視覺層分享設計師在工作中如何通過打破職能限制，化被動為主動，推行設計想法落地，為產品創造出可量化的價值的過程。

戰略層——明確目標，以終為始

牢記自己的目標/使命，確信日常所作所為并未與之南轅北撤，并且每天都向著這個目標努力?！薄陡咝苋耸康钠邆€習慣》

無論是 To B 還是 To C ，開始動手設計之前，都應該去“找到”產品的目標，因為我們和團隊成員所有的努力與溝通都是圍繞“目標”來進行的，在設計之前如果弄不明白產品整體的目標，只拘泥于自己的專業領域，為了1像素還是2像素而糾結，無異于井底之蛙、管中窺豹。

B端產品的目標是什么？

之前看過很多有關B端設計的文章，發現都會強調B端設計目標是“提升效率”，看完我就笑了，難道所有員工都是流水線上記件結算的工人嗎？把做完一件工作的時間從5分鐘縮減到4分鐘就都那么重要？這種一言以概之的認知未免也太狹隘了！

以自如配置的產品優化舉例，整體產品設計的主要功能目標其實有三個：品質管理、成本控制、效率提升，由于公司“做超越用戶期待產品”的“北極星”目標的要求，目前優化都是圍繞“監管線下工作，提升出房品質”來做的，效率和成本反而成了次要考慮的部分。

如何去發現到這些目標呢？我們可以從季度總結、郵件、講話中知道公司的戰略。除此之外，我們還可以通過深度參與項目，切身的去洞察，從一個需求的“接收者”轉變為“參與者”再轉變為“制定者”。

所以，深度參與到項目，應該關注并輸出哪些東西？

設計師參與用研時到底在研究什么？

一、通過和產品經理一起梳理業務流程、拆分大的業務、流程、操作、目標、用戶反饋到“原子級別”

設計是解決問題的過程，當設計師在面對一團亂麻的時候，首先面對的其實是解決什么問題的問題，而拆分大問題到小問題，使無秩序的客觀世界變為有秩序可理解的理性映射，就是尤其重要的第一步。

結構化思維，就是我們解決問題的第一把鑰匙。而且是最關鍵的一把鑰匙，它可以使你有條不紊、忙而不亂地去應付任何問題，去尋找其他的鑰匙，而不論這個問題你是否有經驗?！督鉀Q問題的鑰匙》

以我所優化的自如配置app舉例，這個項目其實有個1.0版本，但是在接手的時候，大家都沒有關于這個產品的第一手信息，業務流程線繁雜，牽扯很多數據、部門以及其他業務線：在我們面前的是一個錯綜復雜的大線團。于是我們發起了一次針對“家裝一線人員”的用戶調研。

在這個過程中，作為設計師的我與產品經理、用戶研究員一起了解并拆解了以下5點：

1、拆解了業務方的工作流程

2、拆解了業務工作流程中的階段性任務

3、拆解了完成階段任務需要做的操作點

4、拆解了用戶意見到具體操作點

5、拆解了階段任務的階段目標/評價標準

二、收集使用意見、了解、拆分使用的場景（5WH）

完成前期的梳理工作之后，對于業務框架、以及階段性目標就有了大致的了解和明確。

之后我們還通過”問卷定量收集“使用者”優化呼聲 ——邀約使用者深度訪談定性了解詳細情況——線下走訪使用場景“三步調研法了解以下3個信息。

1、“使用者”的用戶畫像（who）

2、“使用者”的使用場景(when\where\what)

3、“使用者”不按照設計路徑操作后替代方案(how)

通過分析（why why 分析法），我們得到“使用者”不使用我們原有設計的原因，以及這樣會對業務目標造成的后果，為之后的產品優化提供設計方向與理論依據。

三、明確B端真正的用戶是誰？

為什么我會把使用app的人稱為“使用者”而不是“主要用戶”呢？這又可以引出一個小問題：B端產品真正主要的用戶是誰？

在B端產品眾多角色對于產品的眾多意見中，當出現矛盾的時候，應該以誰的意見為主？

很明顯，在這點上，B端和C端的側重點是不同的。

以自如配置app為例，整個產品波及的角色大概有下面幾種，除了“配置專員”之外，其他角色都不會使用它，但是也會毫無疑問受到產品的影響，或者影響產品的設計。

之上的角色都是用戶，我們需要考慮他們的意見，得到他們的支持，但卻并非我們的“主要用戶”。

判斷“主要用戶”的標準也很簡單，可以從三個角度去判斷：“需求、規則、目標”。

所以，這個B端產品的“主要用戶”是“業務方”，因為業務方對其他角色用戶提出了需求（高效率、低成本、高品質），需要各個角色遵守規則（管理手段讓其他角色的愉悅、恐懼），去達到業務目標（多快好省盈利）。

如果是C端產品，使用者很大可能也是“主要用戶”，因為產品需要通過去解決他們的需求（如購物、看新聞、社交等），設計需要遵守這些使用者的規則如：用戶習慣、人性弱點、心理等（如果我們不遵守這些規律，他們就會拋棄我們的產品，從而讓我們恐懼、不爽），去達到目標（購買成功、看到最新的新聞、點贊評論），C端通過產品達成用戶的目標來達成業務的目標。

經過在戰略層的一番探索，我們有如下幾個收獲：

1、團隊成員一起梳理了業務原有流程 ，團隊成員對產品的認知統一了

2、通過調研，了解了“終端使用者”的使用場景，通過why\why分析法收集和發現了目前存在的問題?

3、在匯報交流的過程中明確了業務方的目標，并拆解了目標到具體操作點

4、通過業務方當前的重點目標明確了優先要解決的具體問題

框架層——建立一條不漏水的水渠

明確了方向，找到優化線索之后，就可以開始著手于具體的優化，在優化的思路上，B端和C端也具有明顯的區別。

在我看來，B端的設計方式就像是修建“人工水渠”，是先得把“水渠”修建好，保證方向正確，不漏水，我們再往里放“水”（使用者）。

而C端的設計方式是對“水”的引導，河流是本來就有的，所以我們需要了解目標”水流“的方向、走勢、弱點才能引導他們到我們希望的地方去。

所以, 我們首先要建立一個不漏水的“水渠”。

在具體的產品設計上，每個需要管理的角色在使用中的“開始”、“過程”、“結束”都設計了相應的記錄/績效壓力。

但是需要注意的是，以管理（恐懼驅動）為主，但也需要適當的愉悅激勵才能事半功倍，在激勵方面可以通過開展pk活動，每日推送工作數據，設立目標、獎項、排名等方式激勵員工積極工作。

交互層——? “堵”不如“疏”，一場清除淤泥的運動

建好了邊界，但是“淤泥”太多，或者“坡度”太高，不符合“水”流動的特性，“水”也無法按照我們希望它流動的方向灌滿水渠，所以，我們還需要對使用者引導，減少他們使用的阻力。

沒有最好的交互方式，只有最適合的。

用配置app舉例，之前整改操作的交互方式采用“線性流程”的方式，這種交互方式的優勢是每個頁面的內容少，操作清晰，但是缺點也顯而易見，就是一個操作流程跳轉頁面數過多。當時我們的整改標準多達50多項，每一項都需要跳轉3次才能到達具體的整改項，會讓整個任務顯得冗長，這也是前期調研中，我們分析的用戶反應說操作很繁瑣的一個原因

。

原來“線性工作流程”交互方式

B端的設計是基于角色的，但是在角色之外，我們不應該忽略的是：他們也是實實在在的人，并不是機器，他們擁有著普通用戶的用戶習慣，如果操作成本過大，也會造成用戶想出對策來不按照業務規定操作，從而影響最后的目標達成。

經過討論之后，我和產品確定了多面板布局的交互方式，這種頁面布局最大的好處是單頁面可以展示更多的信息量，操作效率高，減少了頁面的硬跳轉，符合業務整改項目多，信息多的情況。

改版后改用“多面板布局”

但是這種布局的缺點也很明顯，即一個頁面承載的信息和層級都較多，識別和認知難度相比較之前會難一些。所以，當時也有爭論和糾結這兩種交互方式的取舍，但是后來基于兩個原因，我們認為多面板的交互方式是更適合我們產品的方式。

第一個原因：基于調研，我們知道我們的產品使用者其實都非常年輕（25歲左右一、二線城市年輕人）、大學本科學歷，所以他們具有一定的認知和學習能力。

第二個原因：多面板布局與一二線城市年輕人常用的外賣點餐使用的布局交互一致，從某種程度上來說，其他產品已經幫助我們教育了用戶。

即使是這樣，并不表示這種交互就是完美的無阻力的，我們也需要采取一些措施去盡量減少它給用戶達到目標帶來的阻力。

一方面我們可以通過UI設計讓層級更加分明，降低視覺信息上的識別、學習難度。

另一方面，在容易誤操作的地方（比如業務是要求用戶得按照每個房間去檢查，并提交信息保存的，這種限制性的操作和C端常規的交互方式有所不同）。所以，我們會另外給予文字信息、顏色區別（未檢查為灰色、通過為綠色、不通過為紅色）、toast狀態提示，盡量減少用戶的犯錯機會，即使出現了誤操作（例如；檢查了房間，但是沒有提交，就跳到下一個房間了）也會替用戶保留數據，用戶很容易從錯誤中恢復過來，并不會出現誤操作導致數據丟失的破壞性后果。

在設計中，同樣的功能通?？梢酝ㄟ^不同的控件、組件去實施。（我的朋友，在阿里做交互設計師的season曾經告訴我，交互其實就是在思考三個問題：1、功能該使用何種控件實現。2、界面內如何布局。3、界面間如何串聯），但是我還是想要再補充一下，交互控件、布局、串聯方式的選擇標準應該是以前期調研或者洞察出的用戶模型和用戶場景為基礎的：沒有放諸四海都適用的、最好的交互方式，只有最適合的。

視覺層——制造適合的場景氛圍

大家是不是有過這種感覺：在自習室/圖書館的時候效率奇高，一回到家里看見沙發、床就只想平躺，或者東走走西走走，效率變得奇低。

其實我們每個人完成任務的時候都需要一個場景（無論這個任務是購買、轉發、點贊、或者專心學習），所以我們才需要在視覺上給予特定的任務特定的場景氛圍，作為一個觸發器（triger）觸發用戶的情緒，刺激用戶更好的完成任務。

視覺層是直接面向于使用者的，它通常會決定使用者在看到這個產品后的第一印象，所以產品的視覺層并非獨立于上面的“交互層”、“框架層”、“戰略層”，而是應該是以上三層的支撐后的外在體現，就好像人的外表是基于內部的骨骼、血液、組織支撐后外在表現一樣，它為使用者能更好的感知到產品功能、使用產品而服務。

以配置后臺為例，前期的調研發現使用者多是以男性為主的，接受過大學教育，年齡在25歲左右的年輕人，使用手機的場景是嘈雜的室內。而B端本質上屬于工具型產品，過度的視覺設計會干擾使用者對產品的使用。

所以從用戶模型、使用場景、產品類型三個角度為抓手，我們可以得出這個產品大概的視覺方向：

設計原則

2、顏色規范：顏色色值克制、對比明確、不曖昧

3、字號層級：字號大小對比拉開，突出重點信息，克制輔助信息

4、間距層級：層級以5pt為基數，視覺元素親密性有律可循

5、圖標規范：使用功能性圖標，扁平化、顏色造型簡潔克制

后設計時期——上線不是設計的終結而是開始

在產品優化時，我們按照框架層、交互層、視覺層對產品進行了改版，但是說白了，這些都是基于前期了解和經驗的猜想而已，并沒有經過實際的驗證會有好的效果，貿然一次性做到完美，會耗費很多的成本和資源，尤其是像自如這樣有大量線下業務的互聯網+企業，沒有經過驗證的方案要一次性在線下推廣運用，確實難以取得預期效果。

當在開發資源、時間有限的情況下，成本最低的方式就是分步上線，從最近的、信任度最高的地區（北京地區）開始測試，通過前期確定的指標數據反饋來指導下一步的優化方向，而不是盲目執念于最初的設計猜想。

但是，這個時候需要產品經理/運營配合，將上線后的數據以周報的形式發送到每一個項目團隊成員，設計師也需要了解到每一步的過程信息，從而共同分析原因，并參與討論相應的下一步優化方向。

所以，對于設計師來說，產品優化上線只是設計初步猜想的落地，完美的設計往往不是一次性最好的方案，而是在猜想——修正——猜想——驗證中不斷精進的那個。

贊助商鏈接

喜歡這篇文章嗎？歡迎分享到你的微博、QQ群，并關注我們的微博，謝謝支持。
版權：除非注明，本站文章均為原創文章，轉載請聯系我們授權，否則禁止轉載。