設計師如何為B端產品創造價值
作者：yuqiaoshuo 公眾號ID:yuqiaoshuo
相信很多傳統UI設計師在接到後臺設計需求的時候，內心是抗拒的：表單為主的介面讓我們空有一腔視覺技法無處發揮，而後就是懵逼的，prd裡寫的到底是什麼鬼，每個字雖然都認識，但是為什麼連在一起就看不懂？
在傳統設計師擅長的表現、體驗層上，業務方意識裡並不看重，立項評審都沒有邀約設計師的習慣；在設計師不熟悉的業務邏輯上，錯綜複雜，牽一髮動全身：對此我們簡直不敢多說話。
弱小、可憐、又無助可以形容B端設計師的被動局面了。畢竟，如果不看重視覺、也不看重使用者體驗，產品和開發兩個人其實也可以商量著把活兒幹了，方便、快捷還省事兒…
設計師如何在B端產品中獲得更多話語權，從而發揮更大價值？
下面我會分別從戰略層、框架層、互動層、視覺層分享設計師在工作中如何通過打破職能限制，化被動為主動，推行設計想法落地，為產品創造出可量化的價值的過程。
戰略層——明確目標，以終為始
牢記自己的目標/使命，確信日常所作所為並未與之南轅北撤，並且每天都向著這個目標努力。”——《高效能人士的七個習慣》
無論是 To B 還是 To C ，開始動手設計之前，都應該去“找到”產品的目標，因為我們和團隊成員所有的努力與溝通都是圍繞“目標”來進行的，在設計之前如果弄不明白產品整體的目標，只拘泥於自己的專業領域，為了1畫素還是2畫素而糾結，無異於井底之蛙、管中窺豹。
B端產品的目標是什麼？
之前看過很多有關B端設計的文章，發現都會強調B端設計目標是“提升效率”，看完我就笑了，難道所有員工都是流水線上記件結算的工人嗎？把做完一件工作的時間從5分鐘縮減到4分鐘就都那麼重要？這種一言以概之的認知未免也太狹隘了！
以自如配置的產品優化舉例，整體產品設計的主要功能目標其實有三個：品質管理、成本控制、效率提升，由於公司“做超越使用者期待產品”的“北極星”目標的要求，目前優化都是圍繞“監管線下工作，提升出房品質”來做的，效率和成本反而成了次要考慮的部分。
如何去發現到這些目標呢？我們可以從季度總結、郵件、講話中知道公司的戰略。除此之外，我們還可以 通過深度參與專案，切身的去洞察，從一個需求的“接收者”轉變為“參與者”再轉變為“制定者”。
所以，深度參與到專案，應該關注並輸出哪些東西？
設計師參與用研時到底在研究什麼？
一、通過和產品經理一起梳理業務流程、拆分大的業務、流程、操作、目標、使用者反饋到“原子級別”
設計是解決問題的過程，當設計師在面對一團亂麻的時候，首先面對的其實是解決什麼問題的問題，而拆分大問題到小問題，使無秩序的客觀世界變為有秩序可理解的理性對映，就是尤其重要的第一步。
結構化思維，就是我們解決問題的第一把鑰匙。而且是最關鍵的一把鑰匙，它可以使你有條不紊、忙而不亂地去應付任何問題，去尋找其他的鑰匙，而不論這個問題你是否有經驗。——《解決問題的鑰匙》
以我所優化的自如配置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、圖示規範：使用功能性圖示，扁平化、顏色造型簡潔剋制
後設計時期——上線不是設計的終結而是開始
在產品優化時，我們按照框架層、互動層、視覺層對產品進行了改版，但是說白了，這些都是基於前期瞭解和經驗的猜想而已，並沒有經過實際的驗證會有好的效果，貿然一次性做到完美，會耗費很多的成本和資源，尤其是像自如這樣有大量線下業務的網際網路+企業，沒有經過驗證的方案要一次性線上下推廣運用，確實難以取得預期效果。
當在開發資源、時間有限的情況下，成本最低的方式就是分步上線，從最近的、信任度最高的地區（北京地區）開始測試，通過前期確定的指標資料反饋來指導下一步的優化方向，而不是盲目執念於最初的設計猜想。
但是，這個時候需要產品經理/運營配合，將上線後的資料以週報的形式傳送到每一個專案團隊成員，設計師也需要了解到每一步的過程資訊，從而共同分析原因，並參與討論相應的下一步優化方向。
