在網(wǎng)頁和移動端界面中，內(nèi)容和信息是否能夠經(jīng)過系統(tǒng)性、有效的整理和組織，對于內(nèi)容的可用性和實用性，都是意義巨大的。而在呈現(xiàn)信息的時候，視覺間隔是組織信息的關(guān)鍵因素。它說起來并不難理解，但是在實際的運用當(dāng)中，卻是千變?nèi)f化，今天我們來梳理一下流行的視覺間隔的方法。
視覺間隔是一種布局元素，它有助于將內(nèi)容分隔成為清晰的分組、選項和部分。它可以讓設(shè)計師更好地組織內(nèi)容的視覺體驗，處理信息的層級，也有助于用戶理解內(nèi)容，明白內(nèi)容之間的關(guān)系。
視覺間隔和頁面上的其他內(nèi)容在一起，構(gòu)成視覺層級，這是它最重要的作用。在視覺間隔的幫助之下，用戶可以輕松地感知內(nèi)容之間的關(guān)系，明白各個信息片段之間的關(guān)系是相似，并列，承襲，從屬，還是其他。
視覺間隔的可用性也同樣重要：在很多時候，有的視覺間隔元素看起來是可點擊，可交互的，這在移動端界面上，是非常重要的。
談到視覺間隔，我們可以從兩方面來進行拆解分析：視覺間隔的外觀和功能。按照視覺特征，視覺間隔有5種基本的類型：
下面我們分別針對這5種類型進行說明。
很長時間以來，在排版印刷領(lǐng)域，線條就一直是一種用來分隔內(nèi)容的方法。線條的分隔功能是認(rèn)可度最高的一種間隔方式，用戶幾乎不用思考，就能夠理解和感知它，并且發(fā)揮作用。
另一方面，這種間隔方式也很容易顯得過于簡單，并且和應(yīng)有的形態(tài)相去甚遠(yuǎn)。這也是為什么設(shè)計師在想盡辦法去尋求別的視覺間隔形態(tài)。太多的線條間隔會讓屏幕上的視覺干擾太多，并且?guī)聿槐匾囊曈X噪音。
所以，能夠?qū)⒕€條間隔用得微妙、恰到好處、出神入化，是設(shè)計師功力的一個重要體現(xiàn)。
在這個網(wǎng)站產(chǎn)品頁面中，使用深色的線條間隔來分割產(chǎn)品信息，用來組織和間隔信息內(nèi)容。
在這個頁面當(dāng)中，線條分隔了不同的內(nèi)容區(qū)塊，讓頁面的結(jié)構(gòu)更易于被掃讀。
這個電商網(wǎng)站將不同級別的視覺內(nèi)容進行了分離，借助簡單的水平線將價格、CTA按鈕以及承載相關(guān)信息的表單分隔到不同的區(qū)域。
負(fù)空間，也就是留白，也是最為常見的一種視覺分隔元素。留白絕不是對空間的浪費，和屏幕上其他的元素一樣，它同樣發(fā)揮著重要的作用，拱衛(wèi)支撐著整個用戶體驗。負(fù)空間是最為流行的視覺分隔之一，尤其是在極簡主義風(fēng)格為主導(dǎo)的設(shè)計當(dāng)中。負(fù)空間本身遵循著格式塔原理，尤其是其中「接近原理」和「相似原理」是負(fù)空間在設(shè)計中，發(fā)揮分隔作用的核心所在。合理地運用負(fù)空間，還能強化頁面的呼吸感。
上面這款旅行規(guī)劃 APP當(dāng)中，使用留白將不同的條目分開，沒有使用額外的具體視覺元素，僅僅只靠留白。
Health Blog 的列表的排版層次是基于負(fù)空間來實現(xiàn)的，看起來清晰又充滿呼吸感。
高對比度的色彩，同樣能夠帶來清晰的視覺間隔效果。在 UI 界面中高對比度的色彩有著極為明顯視覺表現(xiàn)潛質(zhì)，它們能夠增強網(wǎng)站的信息和內(nèi)容的表現(xiàn)力，分割區(qū)塊，營造氛圍。對比度是影響頁面和屏幕可讀性的關(guān)鍵因素之一。在具體的應(yīng)用當(dāng)中，不同的色彩會有效地分離不同的選項、條目和區(qū)域，這意味著它作為視覺分隔的作用非常強。這也是近年來分屏式設(shè)計如此流行的原因所在。
這是一套移動端菜單的概念設(shè)計，強烈的色彩對比讓信息清晰可見。
即使是在這樣的柔和的設(shè)計當(dāng)中，色彩的對比度也發(fā)揮了相當(dāng)?shù)淖饔茫阂环矫?，強烈的色彩對比讓CTA按鈕和輸入框之間有了明顯的區(qū)分，另一方面，右側(cè)的主視覺元素的背景也同樣借由不同色彩的對比，做到了突出的效果。
在 GNO Blankets 這個網(wǎng)站當(dāng)中，強烈的明暗對比將網(wǎng)站元素分隔成為精美而清晰的區(qū)塊。
陰影和體積也是一種非常常見的視覺間隔方式，通過營造在「高度」或者說高程上的視覺差異，從而達(dá)到分層的效果，而這種設(shè)計也是符合人類一直以來的認(rèn)知習(xí)慣。這種方法有利于保持整個設(shè)計的平衡和易讀性，另一方面，它又能保持足夠的微妙和自然，不會那么引人矚目從而讓人覺得出戲或者受到干擾。
這個APP的目錄頁面所有元素都采用了白色的背景，而陰影讓布局呈現(xiàn)出了縱深層次，讓內(nèi)容足以展現(xiàn)又不顯突兀。
這款提供定制化花束服務(wù)的APP也采用了類似的陰影元素，讓整體看起來清晰又通透。
圖片在 UI 界面當(dāng)中，同樣也是一種非常有效的視覺間隔，尤其是在包含大量文本內(nèi)容的界面中。無論是博客、在線媒體網(wǎng)站還是其他類型的網(wǎng)站當(dāng)中，圖片的間隔作用都非常明顯。無論是照片、插畫、3D圖形，它們作為圖片都可以很好的平衡文本內(nèi)容，提高內(nèi)容的識別度和可讀性，有效地劃分層級，并且提高情感吸引力。
這個比特幣網(wǎng)站的著陸頁就使用了帶有3D效果「了解更多」動態(tài)圖片，圖片和文本在內(nèi)容和功能上都清晰地分隔開來。
在這個餐廳 APP 當(dāng)中，圖片作為劃分內(nèi)容的關(guān)鍵元素而存在。
如果從功能的角度上來劃分視覺間隔，可以根據(jù)它所處的層次來進行劃分。
使用線條作為全出血間隔是最為常見的，它會很跨整個屏幕布局來作為信息層級的劃分。
這個畫廊圖庫 APP 的藝術(shù)家目錄當(dāng)中，使用線條作為全出血間隔，來區(qū)分藝術(shù)家。
這個名為完美食譜的APP也使用了全出血間隔線來區(qū)分內(nèi)容。
在這個財務(wù)APP當(dāng)中，也使用了全出血間隔線來區(qū)分條目。
在這個電影APP的結(jié)帳頁面當(dāng)中，也使用了線條來作為全出血間隔。
嵌入式間隔的功能是將相關(guān)性較高的內(nèi)容分割開，并且它通常會和標(biāo)題或者其他的特定元素保持對齊或者對應(yīng)，它們通常是進行某個大區(qū)塊內(nèi)不同組件的分隔，或者將多個同類的元素分隔開。
這個網(wǎng)站當(dāng)中，使用橫向的短分隔線來區(qū)分表單中的參數(shù)條目。
這種分割線通常會置于布局的中間某處，同樣是分隔相關(guān)的內(nèi)容，但是通常它們在屬性上不一定是一致的，但是層級近似。
在這個出售草藥的電商網(wǎng)站的右側(cè)，使用中間分隔線將文本和可交互的區(qū)域清晰地分隔開。
上面對于不同類型的視覺分隔方式都有描述，在此之外，還有兩個問題需要注意：
文章來源：站酷
日常工作中，經(jīng)常聽到交互和視覺同學(xué)有著如下對話：
可以看到，無論交互還是視覺同學(xué)的提問，其實都是圍繞「信息」表達(dá)的邏輯。視覺同學(xué)設(shè)計過程中，應(yīng)該如何理解交互稿件，并進一步體現(xiàn)交互的層級邏輯？是否可以對交互稿的布局進行調(diào)整發(fā)揮？我們通過案例來一起看看。
目前，頁面類設(shè)計一般分為運營型和平臺型。
關(guān)注重點：「活動利益點」「模塊內(nèi)容順序」「視覺發(fā)揮空間大」
活動頁設(shè)計中，信息的層級表達(dá)相對簡單，一般分為主氛圍圖-體現(xiàn)活動主題、內(nèi)容展示區(qū)-直接轉(zhuǎn)化、尾部兜底區(qū)-相關(guān)擴展。這類型需求，重點在理解交互稿中主題的表達(dá)、內(nèi)容區(qū)的分類及重點元素體現(xiàn)。視覺設(shè)計師在該類型的設(shè)計中，發(fā)揮度是很大的。
關(guān)注重點：「層級結(jié)構(gòu)」「瀏覽順序」「視覺在信息邏輯之上發(fā)揮」
平臺類設(shè)計項目，交互設(shè)計師通過頁面框架、模塊設(shè)計來表達(dá)產(chǎn)品/運營的策劃思路，涉及內(nèi)容及模塊更多，且包含著復(fù)雜的邏輯關(guān)系。一個優(yōu)秀的平臺視覺設(shè)計師，應(yīng)當(dāng)是通過好的視覺表達(dá)，按照交互信息層級關(guān)系，將信息內(nèi)容傳遞給用戶。這里視覺同學(xué)要避免兩個誤區(qū)：完全按照交互框架和排布，只是純粹填色；從「好看」的角度重新布局，忽略交互層級關(guān)系。
下圖是美妝頻道的一次改版，通過觀察交互稿和視覺稿可以看到，這位視覺設(shè)計師在交互稿的基礎(chǔ)上，采用了更靈活的視覺引導(dǎo)方式。這些改變是否有效傳遞了交互邏輯？視覺階段的這些調(diào)整是否都合適呢？看完本文，你就能有一個清晰的答案了。
瀏覽順序 元素表意
這是一個新品速遞模塊的設(shè)計方案。交互稿表達(dá)的信息是：這個區(qū)塊是用來介紹新品的，首先希望用戶知道模塊屬性是什么，然后讓用戶快速了解推薦商品是什么，及為什么值得買。視覺稿較好的傳遞了交互層級及信息表達(dá)，首先突出了欄目名稱讓用戶能一眼看到，其次是商品及商品特性展示；而稿件中的欄目名稱位置和樣式則在視覺上做了自由的發(fā)揮。
小結(jié)：模塊中各元素的瀏覽引導(dǎo)（眼睛瀏覽路徑）需要嚴(yán)格按照交互邏輯，元素的表達(dá)和位置可以根據(jù)邏輯發(fā)揮。
下面這組案例，在信息層級上，視覺稿是否完整傳遞了交互邏輯？先自己思考一下吧~
模塊比重 內(nèi)容布局
交互層級來看，整個區(qū)域有2個模塊「正在進行」和「品牌精選」，每個模塊有4個等大的展示單元格。而視覺稿中，「正在進行」模塊的單元格變成了兩大兩小。嚴(yán)格來說，這個調(diào)整是不符合交互邏輯的。
但是，視覺稿的輸出效果明顯更靈活，瀏覽層次更佳！那，能不能這么改呢？
這需要回到，為什么交互輸出時，畫成了等大樣式。在交互環(huán)節(jié)，運營側(cè)提出四個專題希望是相同層級，無優(yōu)先級的差異。
這種情況下，視覺同學(xué)如果仍然堅持有層級差異的視覺感官更好，可以先和交互同學(xué)一起商量，從用戶體驗的角度來看，這個改變是否有嚴(yán)重影響，如果團隊內(nèi)部也都認(rèn)為改動后的效果更佳，可以一起找到對應(yīng)的運營同學(xué)，說明原因，建議他們進行調(diào)整；同時去了解這樣的調(diào)整對業(yè)務(wù)方的業(yè)務(wù)表達(dá)是否有影響。
小結(jié)：視覺表達(dá)要關(guān)注信息模塊的比重，視覺側(cè)好的想法也要直接提出和交互及業(yè)務(wù)方討論
上面這個案例也是關(guān)于模塊比重的，最大的差異在于欄目名稱及入口的調(diào)整。從不強調(diào)樓層名稱變成樓層名稱成為模塊的視覺焦點，因涉及到模塊比重，類似的改動也建議和交互設(shè)計師進行討論。同樣，該案例的改動，豐富了樓層樣式，并通過標(biāo)題模塊強調(diào)了樓層的調(diào)性氛圍，同時并未對用戶閱讀體驗造成不好的影響，因此是個視覺提升交互表達(dá)的優(yōu)秀案例。
對于同層級關(guān)系的單元格，我們也可以采用不同的操作方式，比如上面案例中，視覺環(huán)節(jié)使用了疊起的展示樣式。相對于交互，優(yōu)點在于增加了一種互動形式，而缺點則在于會對部分信息進行遮蓋，不能直觀呈現(xiàn)全部內(nèi)容。這個案例的處理方式是，我們將兩種方案的優(yōu)劣告知運營方，運營方認(rèn)為可以犧牲部分信息的呈現(xiàn)，而選擇互動方式的不同呈現(xiàn)。
我們以TAB來舉例，TAB形式體現(xiàn)的是并列關(guān)系的多個模塊呈現(xiàn)，視覺設(shè)計師可以根據(jù)不同場景用不同視覺方案來呈現(xiàn)。
常規(guī)的視覺展示
場景化表達(dá)-日歷
下面案例中，交互傳達(dá)的是一周七天的食物推薦，在視覺階段可以把TAB樣式設(shè)計得更貼近日歷，更貼合模塊的主題表達(dá)。
場景化表達(dá)-餐桌
這個案例視覺側(cè)在模塊面積上進行擴大，影響到原首屏內(nèi)展示內(nèi)容的信息量。這種情況則需要與業(yè)務(wù)同學(xué)進行溝通，信息后置是否會影響他們在首屏信息的展示需求。一般活動類頁面，首屏內(nèi)容和頁面長度的要求，相對寬松；如果是工具類/綜合性展示頁面，信息是否能在首屏出現(xiàn)，對頁面點擊和使用效率會有很大影響。
TAB的引導(dǎo)位置
下面案例中，因為TAB的位置發(fā)生了調(diào)整，用戶的閱讀順序發(fā)生了變化。交互稿中，我們希望用戶先看到TAB分類以了解推薦手機的不同緯度；而視覺稿中，優(yōu)先讓用戶看到推薦商品，如果首輪推薦無興趣，再通過TAB切換查看其它維度內(nèi)容。
元素的不同呈現(xiàn)順序會體現(xiàn)不同的交互邏輯。
下圖中的推薦區(qū)模塊，交互上的順序是圖→人物→具體商品描述，首先強調(diào)的是商品，其次是用戶的評價；而視覺稿上的順序是人物→圖→具體商品描述，首先調(diào)的是評價的人，再說商品是什么。兩種邏輯其實都符合「食鮮者說」的邏輯，但從屬關(guān)系是不同的。這里的邏輯決策是，如果評價用戶是知名度較高的，可以通過人物為食物加分，則我們選擇視覺稿邏輯；而如果我們是靠商品圖本身致勝，評論者只是輔助決策元素，則選擇交互稿邏輯。
模塊間的層級關(guān)系，可以通過去色來快速判斷，是否符合交互瀏覽要求。去除顏色和元素對界面視覺優(yōu)先級的影響，更聚焦邏輯本身。
對比下面案例，去色后可以更容易看到，優(yōu)化后方案更加整體，視覺引導(dǎo)也更加順暢。
交互稿中體現(xiàn)的邏輯，涉及到樣式/位置調(diào)整的，我們應(yīng)遵循原則：「在保證信息順序、層級關(guān)系、信息占比邏輯正確的前提下，視覺可以進行專業(yè)的各種發(fā)揮」。
文章來源：優(yōu)設(shè)
無論是2B產(chǎn)品，還是2C產(chǎn)品，用戶系統(tǒng)都是基礎(chǔ)。對于非互聯(lián)網(wǎng)產(chǎn)品從業(yè)者，2C用戶系統(tǒng)的場景和功能通過日常各類APP的使用，大家都非常熟悉。因此，筆者通過和2C產(chǎn)品的對比，談?wù)?B SaaS產(chǎn)品的用戶系統(tǒng)設(shè)計。
2C產(chǎn)品面向的用戶是個人，用戶系統(tǒng)的核心是獲客，因此大多2C產(chǎn)品的用戶系統(tǒng)設(shè)計重點在于方便用戶注冊、登錄，能夠建立精準(zhǔn)的用戶畫像，從而達(dá)到流量變現(xiàn)的目標(biāo)。
2B產(chǎn)品面向的用戶是企業(yè)，用戶系統(tǒng)的核心是組織、員工精細(xì)化管理，提升人效，從而實現(xiàn)節(jié)約成本的目標(biāo)。
2C產(chǎn)品的注冊主要用于個人用戶注冊場景，重點在于提供多種渠道的注冊方式，如賬號、手機、第三方社交應(yīng)用（微信、微博等），其核心目標(biāo)是既能方便用戶注冊，又能多渠道多平臺賬號打通。
2B產(chǎn)品的注冊分為兩部分：企業(yè)管理員代表企業(yè)注冊和企業(yè)員工注冊。
2B平臺型SaaS產(chǎn)品，和2C最大的區(qū)別在于產(chǎn)品需要用戶付費。因此，平臺方為企業(yè)（平臺租戶）提供了注冊入口，一方面需要方便租戶能夠通過其他渠道快速注冊試用產(chǎn)品，一方面需要驗證企業(yè)相關(guān)信息，識別該用戶確實為潛在用戶。
1）企業(yè)注冊：
當(dāng)企業(yè)管理員代表企業(yè)注冊時，需要提供的注冊信息：管理員昵稱、手機號、郵箱、企業(yè)工商信息（名稱、組織機構(gòu)代碼、地址、法人信息等）。
其中工商信息的完整度，不同的產(chǎn)品要求不一樣，需要根據(jù)具體產(chǎn)品而定。如果方便注冊拉新，盡量減少工商信息填寫要求，如果產(chǎn)品安全性要求較高，可以盡量要求工商信息填寫完整。
2）企業(yè)工商信息認(rèn)證：
這部分并非強需求場景，取決于產(chǎn)品的安全性要求。一般安全性要求較高的平臺產(chǎn)品，會在企業(yè)注冊后，進入到企業(yè)工商信息認(rèn)證環(huán)節(jié)。此環(huán)節(jié)要么是平臺管理員人工審核，要么通過第三方認(rèn)證驗證企業(yè)工商信息是否合規(guī)。企業(yè)完成認(rèn)證后，即可試用產(chǎn)品。
如非安全性要求較高的產(chǎn)品，可以直接跳過該環(huán)節(jié)，租戶通過注冊頁信息填寫完整后既注冊成功。
3）企業(yè)員工注冊：
登錄場景比較容易理解，目前B端產(chǎn)品相較C端產(chǎn)品仍然比較傳統(tǒng)，多采用郵箱/手機進行登錄。
未來也希望可以實現(xiàn)，B端產(chǎn)品能夠和更多C端產(chǎn)品平臺打通，可通過通用的第三方賬號進行登錄，實現(xiàn)業(yè)務(wù)與社交的連接。
用戶畫像是2C產(chǎn)品至關(guān)重要的內(nèi)容，只有精準(zhǔn)的用戶畫像，才能更精準(zhǔn)的服務(wù)好用戶。無論是電商，還是資訊平臺，基于用戶畫像的精準(zhǔn)營銷投放才是產(chǎn)品的核心。
2B的產(chǎn)品很少有講用戶畫像相關(guān)的內(nèi)容，事實上對于2B產(chǎn)品而言，用戶畫像也至關(guān)重要。
筆者目前從事CRM產(chǎn)品相關(guān)工作，CRM核心要解決的問題就是幫助你的客戶獲客，那么如何去建立客戶的企業(yè)標(biāo)簽，去按照企業(yè)標(biāo)簽屬性，借助大數(shù)據(jù)分析，幫你的客戶找到他的客戶群，是筆者近期在研究的課題。
2C的產(chǎn)品從本質(zhì)上來講不存在組織結(jié)構(gòu)，個人用戶即為產(chǎn)品主體，但會存在群組/社群的概念。
2B產(chǎn)品的應(yīng)用主體是企業(yè)，而組織結(jié)構(gòu)是企業(yè)運營管理的必要手段和方式。因此組織結(jié)構(gòu)管理是用戶系統(tǒng)的重要組成部分。
1）建立組織結(jié)構(gòu)
組織的單元是部門，因此管理員需要能夠按照企業(yè)組織結(jié)構(gòu)建立、調(diào)整（編輯、合并）、刪除部門。
2）部門樹結(jié)構(gòu)
部門作為組織結(jié)構(gòu)的單元，只是組織結(jié)構(gòu)的分子，而要形成組織，就要按照企業(yè)的業(yè)務(wù)形態(tài)要求形成一定的層級體系。因此部門不僅僅只是簡單的信息描述，還需要有層級描述，這就需要我們在建立部門時按照層級結(jié)構(gòu)建立部門，定義清楚所建立的部門是上級部門、下級部門。
3）通訊錄展示
管理員通過后臺創(chuàng)建完組織結(jié)構(gòu)后，企業(yè)員工可通過前臺查詢按照部門結(jié)構(gòu)展示的通訊錄。
角色管理是B端產(chǎn)品的特有功能，企業(yè)員工按其所負(fù)責(zé)的業(yè)務(wù)模塊劃分不同的崗位職責(zé)。
由于企業(yè)數(shù)據(jù)具有較高的安全性和私密性要求，按照崗位職責(zé)的不同，不同崗位的員工對于業(yè)務(wù)數(shù)據(jù)的操作/查看權(quán)限不同。
因此，我們設(shè)計了角色管理，該角色并非嚴(yán)格意義上的崗位職能角色，而為了區(qū)分不同的員工不同的系統(tǒng)權(quán)限所設(shè)計的系統(tǒng)角色，這就是RBAC設(shè)計。
1）建立角色
建立角色的主要目標(biāo)即為建立一個用戶權(quán)限組，該權(quán)限組內(nèi)的用戶具有相同的權(quán)限。
2）分配角色權(quán)限
基于角色分配系統(tǒng)權(quán)限，以實現(xiàn)不同的角色下的用戶擁有不同的權(quán)限。
員工管理是B端產(chǎn)品的特有功能，員工是企業(yè)組織的重要組成部分，員工也是產(chǎn)品真正的終端用戶。
B端產(chǎn)品從本質(zhì)上是要能夠幫助企業(yè)員工提升工作效率，提高企業(yè)人效，以實現(xiàn)企業(yè)管理者降低運營成本的目標(biāo)。
1）新建員工
前面提到的用戶注冊即為新建員工的過程。包括被動邀請和主動注冊兩種形態(tài)，主要目標(biāo)是將員工信息注冊至系統(tǒng)，并建立員工和企業(yè)的關(guān)聯(lián)關(guān)系。
2）建立員工匯報關(guān)系結(jié)構(gòu)
為了實現(xiàn)精細(xì)化管理，企業(yè)內(nèi)部一般按照組織結(jié)構(gòu)設(shè)定員工的匯報關(guān)系，因此從CEO到基層員工會形成組織關(guān)系樹，該結(jié)構(gòu)可以和組織結(jié)構(gòu)完全一一對應(yīng)，即該部門下的所有員工均匯報給部門負(fù)責(zé)人，但也有部門內(nèi)部分不同的小組，不同的人匯報給不同的小組負(fù)責(zé)人。
因此匯報關(guān)系和組織結(jié)構(gòu)關(guān)系有一定關(guān)聯(lián)，但并不是完全一一對應(yīng)，所以我們需要設(shè)計員工匯報關(guān)系功能。
3）員工離職設(shè)定
為了保證企業(yè)數(shù)據(jù)的安全，員工離職后，需凍結(jié)員工賬號，離職員工將不能以該企業(yè)員工的身份登錄系統(tǒng)，以確保企業(yè)數(shù)據(jù)的安全性。
至此，2B用戶系統(tǒng)的功能基本設(shè)計完整，其重難點在于組織結(jié)構(gòu)、權(quán)限控制，需要重點關(guān)注。
文章來源：人人都是產(chǎn)品經(jīng)理
當(dāng)我們在談 SaaS 的時候，在談什么？
● 什么是 SaaS
● SaaS 產(chǎn)品的優(yōu)缺點
● SaaS 產(chǎn)品的銷售模式
● SaaS 產(chǎn)品指標(biāo)
● SaaS 業(yè)務(wù)指標(biāo)
● SaaS 收入計算
一、什么是 SaaS
這個模式讓軟件變得和水電氣很相似，只需要每月繳納固定的費用即可享受服務(wù)。
——馬克·貝尼奧夫（salesforce 創(chuàng)始人）
訂閱模式
SaaS（software as a service），軟件即服務(wù)，是一種軟件交付和銷售方式——訂閱許可模式。
它基于云， 運行在遠(yuǎn)程服務(wù)器上，集中托管。因此不需要獨立部署甚至物理分發(fā)來完成交付和使用，這意味著用戶通過網(wǎng)絡(luò)即可使用。
例如，過去你使用 office，需要買一張光盤或者在線下載，輸入序列號（一次性付費），進行本地使用。如果要更新你需要重新購買和下載版本。而 SaaS 只需在線登錄即可使用服務(wù)，無需安裝和手動升級，并根據(jù)使用時間付費（按月/年）。
規(guī)模化和復(fù)利
SaaS 采取訂閱付費（按月/年）模式，良好留存的情況下，當(dāng)月/年的收入就是下個月/年的基礎(chǔ)，不斷累加下去（復(fù)合累積收益），形成良好的現(xiàn)金流。
也因此，SaaS 產(chǎn)品的收入具有了經(jīng)常性、可預(yù)測性的特點。這使得，企業(yè)可以根據(jù)現(xiàn)金流進行規(guī)劃，甚至通過融資，提前獲取未來的收入，來進行產(chǎn)品的增長和擴張。
同時，對于訂閱者而言，無需購買硬件和中間件（前期成本），以及實施、維護、更新、運維和管理成本（后期持續(xù)投入成本），只需要連接網(wǎng)絡(luò)即可使用，致使決策和投入成本得到了大幅降低。同時，后期可根據(jù)業(yè)務(wù)的發(fā)展，升級套餐或增加數(shù)量，這些優(yōu)勢致使 SaaS 軟件更容易擁有大量客戶，形成規(guī)模。
從復(fù)利性角度，SaaS 產(chǎn)品的估值是經(jīng)常性收入的若干倍。因此，SaaS 產(chǎn)品的改進，不僅僅是提高下個月的或者長期的收入，而是整個企業(yè)的市值，可謂“一本萬利”。
開放和靈活
SaaS 會針對不同組織的訴求，提供多種套餐方案，通常在付錢前，用戶可以進行免費試用，從而更好的判斷是否滿足自身需求。
同時，SaaS 會開放自己的接口（API），方便與其他軟件集成，從而更好的滿足客戶業(yè)務(wù)。SaaS 廠商也會對接市場上跟產(chǎn)品業(yè)務(wù)相關(guān)的主流軟件，從而提供更加完善的解決方案。
例如，你使用 53KF 云客服進行在線服務(wù)，同時打通 CRM 和訂單系統(tǒng)，以及百度、騰訊、頭條、360 等流量渠道，從而提供更好的客戶支持和流量轉(zhuǎn)化。
先進生產(chǎn)力
SaaS 產(chǎn)品的發(fā)展，是不斷驗證市場需求（PMF）、優(yōu)勝劣汰的過程，其成功就代表著某種先進生產(chǎn)力（工具、流程或方法）。
從更大價值角度考慮，SaaS 賣的不僅僅只是工具，而是解決方案，融入到生產(chǎn)制造中去，協(xié)助客戶獲取成功。同時，對于廠商而言，也是更有價值、更有競爭力、更長久存在的經(jīng)營方式。
從市場而言，SaaS 是一種眾包模式，廠商覺得市場有大量的同類需求且長期存在，開發(fā)成產(chǎn)品進行運作。也真正有效的節(jié)省了同類訴求其社會資源的多次投入。
由于 SaaS 產(chǎn)品的有利可圖，促使市場的激烈競爭，也鍛造了廠商在其領(lǐng)域的專業(yè)化，提供更加有效的解決方案。
二、SaaS 產(chǎn)品的優(yōu)缺點
優(yōu)點/優(yōu)勢
● 易于訪問。SaaS 通過網(wǎng)絡(luò)提供服務(wù)，用戶可隨時訪問，且數(shù)據(jù)儲存在云端，實時同步。
● 免費試用?？梢栽诟犊钋?，進行免費試用，進行多家對比，選擇最合適的。
● 費用便宜。使用訂閱模式，價格取決于用戶數(shù)量，訂閱者無需一次性支付大量費用，降低前期購置成本。
● 支付靈活。按月/年進行支付，此外，訂閱者可根據(jù)業(yè)務(wù)發(fā)展，增加或升級套餐，減少或降低套餐，甚至隨時停止使用。
● 良好支持。服務(wù)的好壞決定了客戶的訂閱，所以 SaaS 廠商會提供更加友好、高質(zhì)量的客戶服務(wù)。
● 開放集成。開放的接口（API）可以與其他產(chǎn)品進行數(shù)據(jù)打通。
● 立即使用。無需安裝和部署，有網(wǎng)絡(luò)的地方即可使用。
● 無需維護。SaaS 統(tǒng)一運行在廠商的服務(wù)器上，由廠商統(tǒng)一維護、更新。
缺點/風(fēng)險
● 數(shù)據(jù)安全。所有數(shù)據(jù)儲存在云端和軟件廠商的服務(wù)器上，可能會引發(fā)泄露等安全問題。SaaS 軟件廠商，通常非常注重數(shù)據(jù)的安全性，因為數(shù)據(jù)泄露對于 SaaS 廠商的企業(yè)經(jīng)營而言是致命打擊。有些 SaaS 廠商也提供混合云服務(wù)，將敏感性數(shù)據(jù)儲存在客戶自己的服務(wù)器上。
● 網(wǎng)絡(luò)連接。沒有網(wǎng)絡(luò)，將無法使用 SaaS 產(chǎn)品。同時，網(wǎng)速深刻影響 SaaS 產(chǎn)品的運行速度。
● 服務(wù)中斷。軟件廠商的硬件故障、網(wǎng)絡(luò)攻擊等造成的服務(wù)中斷，會致使產(chǎn)品無法使用。
三、SaaS 產(chǎn)品的銷售模式
通常來說，SaaS 的銷售模式分為三種：
1、非接觸（no-touch）：自助服務(wù)
1、低接觸（low-touch）：交易型銷售
2、高接觸（high-touch）：顧問式銷售
非接觸（no-touch）：自助服務(wù)
理想的 SaaS 銷售模式是客戶自助完成整個服務(wù)，沒有銷售人員的介入。
這需要產(chǎn)品簡單、價值明顯、支付容易甚至售價便宜。同時，產(chǎn)品本身提供良好的支持（操作引導(dǎo)、使用說明、幫助中心以及反饋入口），從而允許客戶自助完成服務(wù)。
非接觸的 SaaS 產(chǎn)品，通過省去銷售團隊和支持性投入，采用低價，獲取大量客戶。同時，也因為價格便宜，無法支持銷售和支持性團隊的組建。
例如，某 SaaS 產(chǎn)品，10 月/月，一個銷售人員的底薪 4000 元/月 + 五險一金和辦公等費用，那么至少需要銷售 600 個客戶才能抵消成本，這是很難完成的。
低接觸（low-touch）：交易型銷售
低接觸的 SaaS 產(chǎn)品，通常采用免費試用的方式，進行獲客。然后，銷售人員通過在線咨詢服務(wù)（53KF 云客服）或者電話進行銷售轉(zhuǎn)化。
同時，產(chǎn)品在 onboarding 上需要投入大量的資源，從而降低用戶使用摩擦，使得用戶能夠成功的上手并獲取價值。
低接觸的 SaaS 產(chǎn)品通常采用按月訂閱的模式，其滿意度決定了持續(xù)收入。因此，低接觸的 SaaS 產(chǎn)品的銷售，需要同時兼任“客戶成功”的職能，提供良好的客戶支持，從而保證客戶持續(xù)的獲取產(chǎn)品價值而不斷續(xù)費。
高接觸（high-touch）：顧問式銷售
高接觸的 SaaS，通常需要大量的人力投入，招標(biāo)、拜訪、出解決方案、商務(wù)談判等等。
高接觸的 SaaS 更多采用年度收費的模式。強銷售決定了年收入的上限。因此，高接觸的 SaaS 產(chǎn)品幾乎是圍繞銷售團隊的，市場營銷的主要工作是為銷售團隊獲得足夠多且合格的銷售線索；產(chǎn)品、開發(fā)更多的配合銷售團隊滿足客戶需求；客戶成功團隊接收后期服務(wù)、產(chǎn)品支持、關(guān)系維護以保證客戶續(xù)費。
從我個人接觸到的，低接觸、高接觸對于產(chǎn)品設(shè)計而言，在于主導(dǎo)權(quán)方面。
低接觸會考慮更多的價值面（通用的最大化價值），從而會拒接沒有未來（可能性和想象力）的單體訴求。
而高接觸，更多來自客戶傳導(dǎo)給銷售，銷售傳導(dǎo)給公司，公司傳導(dǎo)給產(chǎn)品的業(yè)績壓力。所以，高接觸一定是高單價，低單價的高接觸在一定層面掙得是辛苦錢，無競爭力的勞動輸出，而不是方案輸出。
四、SaaS 產(chǎn)品指標(biāo)（SaaS Product Metrics）
PMF（Product-market fit） 產(chǎn)品市場匹配
SaaS 產(chǎn)品的早期，更多的是驗證產(chǎn)品與市場的匹配（Product-market fit，PMF），直白的說就是生產(chǎn)的產(chǎn)品是否具有市場價值，是否有人愿意花錢購買。
所以 PMF 是不斷確認(rèn)這三點的過程：
1、目標(biāo)客戶是誰
2、目標(biāo)客戶的需求（痛點、爽點、癢點）
3、提供的解決方案是否能掙到錢
PMF 通過早期付費客戶來確定有利可圖的細(xì)分市場。和他們不斷交談，收集反饋來迭代產(chǎn)品。
并根據(jù)付費客戶特征，尋找客戶共性，從而更緊密的圍繞最佳客戶打造產(chǎn)品、從而更明確的找到目標(biāo)客戶接觸途徑、從而更有效的設(shè)計市場營銷宣傳策略。
NPS（net promoter score） 凈推薦值
通過 NPS 進行客戶滿意度調(diào)查，衡量客戶體驗，預(yù)測未來業(yè)務(wù)增長以及預(yù)防客戶流失風(fēng)險。
NPS 采用 10 分制，讓客戶進行打分。
打分者分類：
● 推薦者（dpromoter）：9-10 分，對服務(wù)非常滿意，愿意持續(xù)使用并向他人推薦，從而推動產(chǎn)品增長
● 中立者（passive）：7-8 分，對服務(wù)滿意，但忠誠度低不會主動對產(chǎn)品宣傳，容易受競爭對手影響
● 貶低者（detractor）：0-6 分，對服務(wù)不滿意，會對產(chǎn)品進行負(fù)面評價和傳播，從而阻礙產(chǎn)品增長
NPS=(推薦者數(shù)/總樣本數(shù))×100%-(貶損者數(shù)/總樣本數(shù))×100%
例如，有 100 客戶打了分，結(jié)果如下：
● 10 分：15 人
● 9 分：20 人
● 8 分：20 人
● 7 分：20 人
● 6 分：10 人
● 5 分： 10 人
● 4 分：5 人
忽略打 7-8 分的人數(shù)，9-10 分人數(shù) 35，6 分及以下 25 人，NPS=35%-25%=+10%
如果 NPS 是負(fù)值，那么業(yè)務(wù)收入可能將會減少，因為客戶在不斷流失。正值的 NPS，表明客戶滿意度高，未來具有可持續(xù)增長的潛力。
五、SaaS 業(yè)務(wù)指標(biāo)（SaaS Sales Metrics）
單位經(jīng)濟收益：CAC：LTV
SaaS 產(chǎn)品的成功與 PMF 高度匹配之外，還需要一個切實可行的商業(yè)模式，即客戶價值（LTV）大于獲取成本（CAC），健康的增長意味有效平衡兩者，從而確定這是一個有利可圖的市場。
CAC（Customer Acquisition Cost）
獲得客戶的平均成本。
CAC= 銷售和營銷費用之和 ÷ 新增客戶數(shù)量
LTV（Customer Lifetime Value）
客戶生命周期內(nèi)（從注冊到流失）平均總價值。
LTV=（ARPA*毛利率%）÷ 客戶流失率
ROI（Return on investment）
客戶獲取的投資回報率。
ROI=LTV：CAC
Months to recover CAC
CAC 通過 MRR 收回的平均月份。
Months to recover CAC=CAC÷（ARPA*毛利率%）
ARPA：每個帳戶的平均收入，你的 MRR 除以客戶數(shù)量，即所有客戶的平均 MRR
毛利率=[（營收-成本）÷ 營收]×100%
David 在《SaaS Metrics 2.0–衡量和改進重要內(nèi)容的指南》一文中指出，LTV：CAC ≥3，Months to recover CAC ≤12 月，通常被認(rèn)為是良好的 SaaS 項目。同時也指出，很多健康 SaaS 在初期可能并不符合，但會在一段時間內(nèi)通過改善業(yè)務(wù)逐漸接近這兩條準(zhǔn)則。
經(jīng)常性收入：MRR 和 ARR
經(jīng)常性收入（Recurring Revenue）是未來持續(xù)可獲得的收入，就 SaaS 而言，經(jīng)常性收入來自客戶的訂閱，具有穩(wěn)定、可預(yù)測、高度確定的特點。
在 SaaS 業(yè)務(wù)中通常采用按月或按年合同：
● 主要按月合同及少量的年度合同，采用 MRR（Month Recurring Revenue 月度經(jīng)常性收入）。MRR 用于衡量每月訂閱收入，如果有一些年度訂閱，除以 12，再分?jǐn)偟矫吭聛碛嬎?MRR
● 按年合同及少量的多年合同 ，采用 ARR（Annual Recurring Revenue 年度經(jīng)常性收入）。多年合同除以合同年限，再分?jǐn)偟矫磕陙碛嬎?ARR
在 MRR/ARR 統(tǒng)計中，并不會計算一次性的收入。例如，定制功能費用。
經(jīng)常性收入會不斷推動這 SaaS 廠商的發(fā)展，也是驗證產(chǎn)品是否具有可持續(xù)增長的指標(biāo)。
流失（Churn）
SaaS 是訂閱模式，在高留存率下，隨著時間的推移，意味著更多的客戶、更多的訂閱，持續(xù)收入不斷復(fù)合累積。所以，流失率對 SaaS 廠商是非常重要的指標(biāo)。
在 SaaS 中有兩種計算流失的角度：
● 客戶流失（Customer Churn），取消訂閱的客戶數(shù)量
● 收入流失（MRR/ARR Churn），取消訂閱的收入損失
那為什么會有兩種計算方式？
例如，53KF 云客服的業(yè)務(wù)，是按照坐席收費，50 元/月。假如我們有 200 個客戶，100 個大客戶（每個大客戶擁有 100 個坐席），100 個小客戶（每個小客戶擁有 10 個坐席）。
當(dāng)月，我們流失了 10 個客戶，那么月客戶流失率為 5％。
如果，流失的客戶中，有 8 個是大客戶，2 個是小客戶，那么 MRR 流失 45000 元，MRR 流失率為 7.45%。
如果，流失的客戶中，有 2 個是大客戶，8 個是小客戶，那么 MRR 流失 14000 元，MRR 流失率為 2.55%。
所以，通過不同的計算方式，使得我們更加全面、準(zhǔn)確的了解到業(yè)務(wù)中所發(fā)生的事情。
Customer Churn Rate
客戶流失率，客戶取消訂閱的比率。
Customer Churn Rate= 期間流失客戶數(shù) ÷ 期初客戶數(shù)
MRR Churn Rate
月度經(jīng)常性收入流失率，通過降級、取消而損失的 MRR 比率
MRR Churn Rate= 期間流失 MRR ÷ 期初 MRR
Net MRR/ARR Churn
凈 MRR/ARR 流失。
Net MRR/ARR＝期間新增 MRR/ARR 之和 - 期間流失和收縮 MRR/ARR 之和
Net MRR/ARR Churn Rate
凈 MRR/ARR 流失率。
Net MRR/ARR Churn Rate=（期間流失和收縮 MRR/ARR 之和-期間新增 MRR/ARR 之和）÷ 期初 MRR/ARR
當(dāng)收入增長超過流失的損失，在這種情況下，凈 MRR/ARR 流失則為負(fù)值，稱之為負(fù)流失（Negative Churn），表現(xiàn)在財務(wù)表上的就是收入的不斷增長。
記住，在計算流失時，總是在特定的時間范圍內(nèi)，例如上月客戶流失率是 5%。
六、SaaS 收入計算
確認(rèn)收入（revenue recognition）
對于 SaaS 而言，確認(rèn)收入是非常重要的財務(wù)知識，確認(rèn)收入與合同金額、收款金額有很大的區(qū)別。
例如，按年收費的 SaaS 產(chǎn)品，年費 1200 元，那么：
● 合同金額是 1200 元
● 客戶一次性支付年費，收款金額是 1200 元
● 在合同期間的每個月的確認(rèn)收入則為 100 元。剩下的 1100 元則為遞延收益
● 從企業(yè)資產(chǎn)負(fù)債表而言，剩下的 1100 元均為負(fù)債。因為服務(wù)還未完成，還需要投入 11 個月資源履行服務(wù)義務(wù)，甚至合同可能發(fā)生中止等情況，所以還不是確定的收入，需要通過后期的確認(rèn)收入（損益表中的利潤）來減少資產(chǎn)負(fù)債表上的負(fù)債
* 遞延收益：指尚待確認(rèn)的收入或收益。凡在期間內(nèi)完成的服務(wù)所產(chǎn)生的收入，則為確認(rèn)收入；反之，即使款項提前預(yù)收，但未在期間內(nèi)完成服務(wù)，則不作為確認(rèn)收入。
* 資產(chǎn)負(fù)債表：反映企業(yè)經(jīng)營在一定時期內(nèi)（月份、年度）財務(wù)狀況（兩個方面，一方資產(chǎn)、另一方負(fù)債和權(quán)益）的報表。
* 損益表：反映企業(yè)經(jīng)營在一定時期內(nèi)（月份、年度）利潤（收入）或虧損（支出）的報表
總結(jié)
通過梳理總結(jié)，談了談 SaaS，這是在我當(dāng)前知識體系范圍內(nèi)的總結(jié)，SaaS 是的龐大的體系，關(guān)乎個個層面：產(chǎn)品、營銷、銷售、客戶成功、增長、定價、渠道等等。
如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里
藍(lán)藍(lán)設(shè)計( bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)。
如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里
在電子商務(wù)界，你的網(wǎng)站設(shè)計就是一張在線名片。它能幫助你從擁擠不堪的海量信息中脫穎而出，同時也反映出你的可信度。這是你的用戶通過初次訪問來了解你品牌的地方。如果他們沒有找到自己喜歡的，幾乎80%的人都會選擇離開你的網(wǎng)站。
這就是為什么在構(gòu)建和設(shè)計網(wǎng)站時，永遠(yuǎn)不要低估用戶滿意度帶來的影響。
接下來要講的是如何設(shè)計一個無可挑剔的、以用戶為中心的網(wǎng)站，來使你的網(wǎng)站轉(zhuǎn)化率飛速上漲。
如果不能引導(dǎo)用戶完成最終購買，那么設(shè)計再精美的網(wǎng)站都是毫無意義的。用戶沒有選擇在你這里購買的一個主要原因是復(fù)雜的網(wǎng)站導(dǎo)航。記住，用戶不希望無休止的點擊和滑動鼠標(biāo)后才能找到他們想要的產(chǎn)品。如果他們發(fā)現(xiàn)自己正將時間浪費在不必要的操作上，就會棄你而去，到你的競爭對手那里。
這也是你想要阻止發(fā)生的事情。
人們常說不能以貌取人，但我們卻一直都在這么做。在電商的世界中，你的主頁就是顏值。
研究表明，只需0.05秒，一個用戶就能判斷出你的網(wǎng)站是否能夠滿足他們的需求。而且，如果你不能讓他們相信你的網(wǎng)站是可靠的、安全的或足夠有價值的，他們就會在眨眼之間拋棄你的網(wǎng)站。
那么，一個令人驚艷的主頁包含哪些要素呢?
主頁是用來吸引用戶并與他們建立關(guān)系的。但當(dāng)你想把一位訪客變成付費用戶時，體現(xiàn)產(chǎn)品詳情頁重要價值的時刻就到了。它們需要為用戶深度展示你的產(chǎn)品，激發(fā)他們的興趣，并讓他們產(chǎn)生點擊“立即購買”按鈕的欲望。那么，讓我們來一起看看產(chǎn)品詳情頁中最重要的元素都有哪些吧。
如果有用戶不確定是否要從你這里購買產(chǎn)品，那他很可能會在深思熟慮前就離開你的網(wǎng)站。你需要向他們證明這是一個錯誤的選擇，而這正是“常見問題“的切入點。
創(chuàng)建一個頁面去回答用戶最常問的問題，會讓用戶感到高興，將他們的購買焦慮降到，也能夠更快引導(dǎo)他們完成購買。這就是為什么，你需要積極地構(gòu)建FAQ頁面，提供可操作和有用的技巧，甚至通過截圖和圖片的形式來讓答案容易被更多人理解。
一個可靠的FAQ頁面還可以提升SEO（搜索引擎排名優(yōu)化），特別是在語音搜索SEO和本地化SEO盛行的時代。數(shù)據(jù)顯示，22%的搜索者會使用語音搜索在網(wǎng)上查找本地企業(yè)。因此，綜合考慮電商SEO實踐與本地化SEO服務(wù)，對你的電商網(wǎng)站至關(guān)重要。
這就是FAQ頁發(fā)揮首要作用的地方。也就是說，在不損害用戶體驗的情況下，它使你有機會針對搜索時高頻出現(xiàn)，及具有地區(qū)特征的關(guān)鍵詞，來優(yōu)化FAQ頁面的問題和答案。此外，這也有助于提升你的網(wǎng)站在語音搜索中的排名，因為谷歌經(jīng)常使用FAQ頁面作為語音搜索結(jié)果。
你已經(jīng)通過種種努力讓令人驚艷的主頁贏得了用戶的信任，用產(chǎn)品詳情頁頁的優(yōu)質(zhì)文案提升了他們對產(chǎn)品的興趣，現(xiàn)在是時候激發(fā)他們?nèi)ネ瓿勺詈蟮馁徺I流程了。你千萬不能搞砸了這個關(guān)鍵環(huán)節(jié)，因為購買流程是購物流程閉環(huán)的最后一步。
對于電商而言，用戶體驗至關(guān)重要。她會為你積累忠實的老用戶，激勵新訪客轉(zhuǎn)換為付費用戶，并有助于他們向親朋好友傳播關(guān)于你的正面口碑。Jeff Bezos對此有很好的詮釋：
“如果你的確建立了很好的體驗，用戶就會口口相傳?？诒牧α渴菬o比強大的?！?/span>
我希望以上的這些秘訣將可以成為你的堅實基礎(chǔ)，助力你在在電商領(lǐng)域取得成功。
藍(lán)藍(lán)設(shè)計( bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)。
如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里
B端產(chǎn)品設(shè)計的6大挑戰(zhàn)
翻譯： alina Wong 審校：華姐 | UXRen翻譯組 #297 譯文
在VWO工作初期，我遇到的許多情況促使我想弄明白：企業(yè)類應(yīng)用（B2B，后文中統(tǒng)稱為B端應(yīng)用）真的和消費類應(yīng)用（B2C）不一樣嗎？對于設(shè)計師和設(shè)計流程來說，這種區(qū)別有多重要？
這篇文章是我在過去幾年里的一些經(jīng)驗梳理，希望能夠幫助那些想去或者已經(jīng)在B端團隊工作的設(shè)計師們。
維基百科中的定義：B端應(yīng)用是一種用來滿足企業(yè)而非個人用戶需求的計算機軟件系統(tǒng)。
這是一些大家可能用過或者見過的B端應(yīng)用。
在現(xiàn)代社會，大多數(shù)B端應(yīng)用都是復(fù)雜的任務(wù)關(guān)鍵型應(yīng)用，具有可拓展、分布式和模塊化等特征。B端應(yīng)用對大量復(fù)雜的數(shù)據(jù)進行展示、處理和存儲，并利用這些數(shù)據(jù)實現(xiàn)對業(yè)務(wù)流程的支撐及其自動化。
B端工具可以幫助構(gòu)件你的產(chǎn)品，從而幫助企業(yè)和員工更好地完成工作。
注：雖然B2B和B端應(yīng)用在定義上略有不同，在目前的軟件生態(tài)中，這些差別幾乎無關(guān)緊要，所以本文將它們視為一類。
為B端設(shè)計并無特殊之處，優(yōu)秀設(shè)計的一切準(zhǔn)則，在這里都適用。不過，設(shè)計B2B產(chǎn)品和B2C產(chǎn)品，確實存在一些差別。
試想一下，汽車制造vs.商用飛機制造。它們都是非凡的工業(yè)設(shè)計，把人們從A點運輸?shù)紹點。顯而易見，它們有很多的不同之處，比如使用場景、制造時間、測試&安全規(guī)范、用戶預(yù)期、購買以及所有權(quán)。所有這些不同之處都會影響設(shè)計及流程。
同樣對于B2B應(yīng)用來說，不同之處在于其獨特挑戰(zhàn)和應(yīng)對方法。
聲明：任何一款軟件設(shè)計都會面臨以下一些挑戰(zhàn)，但為B端設(shè)計時，這些挑戰(zhàn)更加突出。
由于數(shù)據(jù)多態(tài)、可視化選項多、管理操作、多用戶協(xié)作以及和其他軟件集成等諸多因素，B2B應(yīng)用的復(fù)雜度普遍高于B2C應(yīng)用。為了滿足一個需求而做出的一項設(shè)計決策，往往會影響其他許多需求，而其方式有時會難以預(yù)測。一項看似簡單的功能添加，都要進行全面檢查，考慮到各種極端情況。
Atlassian公司的Jira軟件界面：功能復(fù)雜的軟件案例。
解決方法：
解決復(fù)雜性的方法是什么？
當(dāng)然是簡化。不要將這誤認(rèn)為是簡化界面，或者現(xiàn)下流行的極簡UI。這是通過恰當(dāng)?shù)囊?guī)劃和流程達(dá)到的簡化。無論項目周期多么緊張，都必須在設(shè)計開始之前投入時間思考，將收集到的需求和規(guī)范進行整理。實際上，這些是設(shè)計中非常重要的工作。
當(dāng)你對設(shè)計方案確認(rèn)無誤時，會直接進入Sketch、Figma或者PS階段，但這往往為時過早。抽點時間來厘清你將要設(shè)計的產(chǎn)品的背景和含義。通過研究和規(guī)劃，找出所有的可能性，處理所有的極端情況。確保準(zhǔn)備萬無一失時，再進入界面設(shè)計階段。
“如果我有60分鐘來砍斷一棵樹，我會花40分鐘先磨好斧子， 20分鐘砍倒它?！薄獊喞?林肯
恰當(dāng)?shù)囊?guī)劃和流程會在長期運行中展露優(yōu)勢，帶來流暢無阻的產(chǎn)品體驗。
B端用戶的心理和行為模式與B2C的用戶的截然不同。B端用戶除了要完成本職工作之外，還要兼顧在組織內(nèi)的其他方面，如職業(yè)發(fā)展，職業(yè)學(xué)習(xí)，職業(yè)成功。為在職人士設(shè)計時，需要充分了解清楚他們的工作背景、流程、環(huán)境、期望、問題以及當(dāng)前的解決方案。
如何做：
設(shè)計B端應(yīng)用時，理解用戶需求非常重要。不僅要了解產(chǎn)品相關(guān)的需求，還要了解用戶工作和職業(yè)相關(guān)的需求。與最終用戶深入交流，研究他們的領(lǐng)域，嘗試用他們當(dāng)前的方法，這些都非常有助于培養(yǎng)對用戶的同理心。
此外，用戶太過于習(xí)慣現(xiàn)有的工作流程，這導(dǎo)致他們很難想像自己真正想要什么。他們可能會告訴你功能和選項，但卻無法提供產(chǎn)品創(chuàng)新之道。
用戶可能認(rèn)為自己想要的只是更多的功能。
B端產(chǎn)品設(shè)計團隊的設(shè)計指導(dǎo)原則，是知道用戶目前遇到的困難是什么，然后設(shè)計出方案來解決這些困難。一旦真正理解用戶的長期目標(biāo)是什么，設(shè)計師就可以有很多發(fā)揮的空間了。
“用戶購買產(chǎn)品是希望變成更好的自己。”—— JTBD理論
與其關(guān)注用戶說什么，不如關(guān)注他們實際做什么，并以此為創(chuàng)新的基點，構(gòu)建精益原型，并與用戶一起進行測試。
一般來說，B端用戶習(xí)慣且滿意現(xiàn)有的工作流程，并沒有切換到另一種產(chǎn)品的需要。而且即便他們想換一個，也要層層審批。更不要說，現(xiàn)有數(shù)據(jù)的遷移對于公司和員工來說都是非常難的事情。所以同大眾消費者應(yīng)用不同，B端應(yīng)用的切換成本顯然要高得多。
解決方法：
說服企業(yè)換用你的軟件的兩大方法：
第二點才是設(shè)計中真正閃光之處。生產(chǎn)效率、工作流程是企業(yè)最關(guān)注的事情。仔細(xì)研究它們現(xiàn)在的方案，找到需要提升的地方?？紤]如何設(shè)計出更快的工作流程，如何提升效率并降低成本。在這幾方面上創(chuàng)新，往往會帶來可以說服企業(yè)作出改變的解決方案。
“衡量創(chuàng)新的唯一標(biāo)準(zhǔn)，就是看它是否改變了人們的行為”——Stewart Butterfield, Slack聯(lián)合創(chuàng)始人
不斷尋找機會，改變傳統(tǒng)的方法，使之更有效，更。
對于B端產(chǎn)品，新增功能幾乎總是比提升現(xiàn)有功能的體驗更優(yōu)先。在產(chǎn)品啟動時，通常會有專門的設(shè)計沖刺階段。而一旦產(chǎn)品發(fā)布出去，用戶需求就開始涌入進來。付費客戶會不斷要求增加新的功能，產(chǎn)品團隊也制定繁忙的開發(fā)計劃。在這種情況下，設(shè)計師尤其很難說服有關(guān)人士投入時間和資源來提升設(shè)計和用戶體驗。
避免方法：
嘗試從這些相關(guān)人士的角度看待問題。他們經(jīng)常認(rèn)為，任何一段開發(fā)時間，無論是一周還是一個月，如果沒有用來開發(fā)新功能就基本等于舍棄了潛在的收入。這時，讓他們明白優(yōu)化產(chǎn)品所帶來的好處就很重要了，要讓他們懂得優(yōu)化遠(yuǎn)比增加新功能可以帶來更多的收入。重點講講成功故事。直接和高管聊這件事，讓他們接受這種觀念。優(yōu)化設(shè)計總是需要仔細(xì)分析痛點，檢驗新的想法，而這些都需要時間和創(chuàng)新。
“電燈不是通過不斷優(yōu)化蠟燭發(fā)明出來的。”—奧倫·哈拉里（Oren Harari）
一旦你獲得了公司的信任，就要在有限的時間內(nèi)取得一些小勝利，并且一直努力度量其影響。逐步建立起公司對設(shè)計團隊的信心，繼續(xù)嘗試更大的改進方案。
讓產(chǎn)品和開發(fā)團隊成員承諾確保優(yōu)秀的用戶體驗，并幫助他們主認(rèn)識到這不僅僅是設(shè)計團隊的任務(wù)。
來源：B端用戶體驗行業(yè)報告 2017-2018
最近，一項對3000多名B端產(chǎn)品設(shè)計師的調(diào)查顯示，對B端設(shè)計團隊來說，最大的挑戰(zhàn)是提高產(chǎn)品的用戶體驗一致性。不同于消費類應(yīng)用，B2B產(chǎn)品通常有更長的產(chǎn)品周期且異步運行，很多時候都是分布式團隊合作設(shè)計。
每一名設(shè)計師都面對著與其他團隊類似的問題，很容易導(dǎo)致產(chǎn)品設(shè)計不一致，比如更改設(shè)計組件、更新樣式，甚至像顏色這樣的細(xì)節(jié)都會產(chǎn)生不同。這些問題隨著團隊的擴大或者產(chǎn)品的體量增加而變得更加嚴(yán)重。
解決方法：
許多公司開始建立設(shè)計規(guī)范來保持產(chǎn)品的一致性和可拓展性。設(shè)計規(guī)范包含可復(fù)用的組件集合、清晰的設(shè)計指導(dǎo)，可以幫助構(gòu)建任何數(shù)量的產(chǎn)品。設(shè)計規(guī)范通常包括：
當(dāng)B端設(shè)計團隊被問到是否建立了設(shè)計規(guī)范時，約55%的團隊回答是或正在創(chuàng)建中。這是很好的現(xiàn)象。需要指出的是，設(shè)計規(guī)范永遠(yuǎn)不會100%完成，它著眼于長期，會隨著時間的推移不斷更新。
“設(shè)計每個元素時都應(yīng)該考慮到其是否易于制作和修復(fù)。”?—Leo Fender
設(shè)計規(guī)范對于保證用戶體驗一致性具有里程碑意義。
以下是一些B端設(shè)計規(guī)范，可以給你一些靈感：Salesforce的Lightning設(shè)計規(guī)范, Intuit的Harmony設(shè)計規(guī)范。
不少設(shè)計師在做過一段時間B端應(yīng)用設(shè)計后，發(fā)現(xiàn)它無聊單調(diào)。許多來自咨詢公司或者有B2C經(jīng)驗的設(shè)計師覺得B端設(shè)計缺乏激情和多樣性。做那種酷炫的微交互和動畫（就是會發(fā)在dribbble上那種）的機會并常有。這樣，工作就變得乏味無趣，設(shè)計師們感受不到成就感，提不起勁來。
避免方法：
B端應(yīng)用的用戶體驗旨在幫助用戶更好地完成工作。設(shè)計一個迷人的界面來吸引用戶，（盡管并無害處，卻）總是在被排在低優(yōu)先級。標(biāo)準(zhǔn)化的、可預(yù)知的、所見即所得的用戶界面，最適合目標(biāo)用戶。
我們的目標(biāo)是讓用戶發(fā)出“哇！”的感嘆，不是因為絢麗的界面，而是因為產(chǎn)品能夠幫助他地完成工作。
組建B端應(yīng)用設(shè)計團隊時，選擇目的和動機一致的設(shè)計師最為關(guān)鍵。設(shè)計師的動機，應(yīng)該大量來自于解決復(fù)雜的問題，看到自己的設(shè)計如何幫助用戶完成他們的工作。
所以，在設(shè)計師加入團隊之前，評估他們的想法并設(shè)定正確的期望是非常必要的。
企業(yè)本身是在逐步發(fā)展的。B端應(yīng)用不再是難用、無聊的產(chǎn)品，用戶期望B端用戶像消費類應(yīng)用一樣有著優(yōu)秀的體驗。他們喜歡漂亮的界面，不希望在使用前看說明文檔。下一代技術(shù)，例如VR、AI和聲音已經(jīng)進入了我們的生活，也很快會應(yīng)用到工作中。對B端應(yīng)用來說，這令人興奮，而設(shè)計師所能做的，則是無限的。
做B端應(yīng)用設(shè)計的三個指導(dǎo)原則：
藍(lán)藍(lán)設(shè)計( bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)。
如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里
Fucking Young(簡稱 FY) 是一家專注于男性半球的年輕美學(xué)，我們自由使用和支配模特及藝術(shù)家合作，從而幫助自己與合作方達(dá)到合理的業(yè)務(wù)需求，建立一個擁有創(chuàng)造力的社區(qū)，贊助和發(fā)布這些驚艷的作品在我們的官網(wǎng)甚至手機產(chǎn)品上。帶來的作品有FY品牌官網(wǎng)與移動端設(shè)計，展示部分界面與交互動效，Gif輸出存在色差，實際情況以高保真視覺界面為準(zhǔn)。
文章來源：UI中國
藍(lán)藍(lán)設(shè)計( bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)。
藍(lán)藍(lán)設(shè)計的小編 http://bouu.cn
