寫(xiě)給PM、交互、UI 看的ToB產(chǎn)品設(shè)計(jì)原則

0 評(píng)論 11547 瀏覽 100 收藏 12 分鐘

編輯導(dǎo)讀:在習(xí)慣了to C的用戶(hù)視角后,要如何理解B端的客戶(hù)和用戶(hù)?做一款B端產(chǎn)品,在設(shè)計(jì)上需要注意哪些問(wèn)題?本文作者依據(jù)工作中項(xiàng)目實(shí)踐的所思所想,并結(jié)合案例等分享了B端產(chǎn)品設(shè)計(jì)需要遵循的4個(gè)原則,供大家一同參考和學(xué)習(xí)。

前言

哈嘍朋友們,我們?cè)S久不見(jiàn),這一年經(jīng)手了很多好項(xiàng)目,如百度的可視化大屏設(shè)計(jì)、ToG政務(wù)可視化大屏設(shè)計(jì)、B端產(chǎn)品的設(shè)計(jì)迭代等等,收獲頗多,有很多新的感悟,后面要跟大家統(tǒng)統(tǒng)把這些案例都分享出來(lái)。

本期先分享一下B端產(chǎn)品設(shè)計(jì)原則,希望能給你帶來(lái)不一樣的思考。(內(nèi)容較干,不建議掃讀)

B端產(chǎn)品設(shè)計(jì)原則

B端產(chǎn)品服務(wù)組織群體,用戶(hù)具有組織屬性,需求來(lái)自組織和業(yè)務(wù)而不是用戶(hù)本身,所以B端產(chǎn)品是以業(yè)務(wù)為導(dǎo)向制定產(chǎn)品的設(shè)計(jì)方案,這個(gè)過(guò)程需要PM、交互、UI都應(yīng)該知道并遵循一致的產(chǎn)品設(shè)計(jì)原則。

1. B端產(chǎn)品0到1 — 穩(wěn)定性

B端產(chǎn)品0-1最應(yīng)該重視的是產(chǎn)品的穩(wěn)定性,這也是B端產(chǎn)品第一大設(shè)計(jì)原則,產(chǎn)品穩(wěn)定壓倒一切。推動(dòng)產(chǎn)品的穩(wěn)定性,首先產(chǎn)品的設(shè)計(jì)上不要做到大而全,而是小而精,滿(mǎn)足最小可用版本即可(MVP)。

0-1階段不要過(guò)于追求體驗(yàn)和視覺(jué)美感,打造小而精快速上線(xiàn)才是王道,畢竟產(chǎn)品問(wèn)世才會(huì)產(chǎn)生價(jià)值。

(1)如何定義小而精?

B端產(chǎn)品與C端產(chǎn)品不同,C端產(chǎn)品有一個(gè)核心功能即可上線(xiàn),而B(niǎo)端產(chǎn)品通常是多個(gè)功能組成的業(yè)務(wù)線(xiàn),所以小而精應(yīng)該是滿(mǎn)足最小業(yè)務(wù)全場(chǎng)景閉環(huán),并不是以減少產(chǎn)品功能為依據(jù)。對(duì)于單一業(yè)務(wù)的功能定制,如下圖,依據(jù)主線(xiàn)業(yè)務(wù)定制功能,即A-B-C-D,對(duì)于周邊體驗(yàn)性的、不影響主線(xiàn)業(yè)務(wù)的功能,此階段都可以先不要。

對(duì)于混合多業(yè)務(wù)的功能定制,應(yīng)該分模塊開(kāi)發(fā),如下圖,每塊就是一個(gè)業(yè)務(wù)流程,所以做好優(yōu)先級(jí)分模塊開(kāi)發(fā)最優(yōu)。產(chǎn)品經(jīng)理需要注意的是,提前規(guī)劃好開(kāi)發(fā)的優(yōu)先級(jí),并與團(tuán)隊(duì)的每個(gè)角色一起規(guī)劃探討后續(xù)的工作,這樣大家對(duì)后面的工作都能有一定的了解,在此階段能做到思考后續(xù)的功能增加。

(2)追求完美不重要

0-1階段產(chǎn)品的開(kāi)發(fā)不要過(guò)于追求完美,完美需要花費(fèi)團(tuán)隊(duì)每一個(gè)人大量的時(shí)間和精力。

對(duì)于UI/UX設(shè)計(jì)師此階段不要過(guò)于強(qiáng)調(diào)自己的“價(jià)值”,不需要著重去思考產(chǎn)品體驗(yàn),也不需要設(shè)計(jì)太多的效果,這有可能會(huì)導(dǎo)致開(kāi)發(fā)工作量增加,做到滿(mǎn)足最小可用版本即可,盡可能化繁從簡(jiǎn),UI/UX設(shè)計(jì)師這樣做,才是發(fā)揮了真正的價(jià)值。

對(duì)于技術(shù)開(kāi)發(fā)來(lái)說(shuō),簡(jiǎn)單的功能,開(kāi)發(fā)人員心態(tài)也會(huì)更輕松,功能越多壓力越大,出現(xiàn)問(wèn)題的數(shù)量也會(huì)變多,最后測(cè)試階段Bug就像打地鼠一樣一個(gè)一個(gè)冒出來(lái),最終會(huì)導(dǎo)致產(chǎn)品遲遲不能上線(xiàn)。

2. 高效性

高效是B端產(chǎn)品設(shè)計(jì)必須要重視的一個(gè)方面,高效說(shuō)的是用戶(hù)長(zhǎng)時(shí)間使用產(chǎn)品的效率。B端產(chǎn)品通常是為了解決業(yè)務(wù)需求,一般非常重視工作效率,如果產(chǎn)品的功能和交互設(shè)計(jì)的不合理,就會(huì)直接導(dǎo)致產(chǎn)品使用者的工作效率降低,甚至最終會(huì)影響企業(yè)的業(yè)績(jī)。

案例解析:

筆者曾經(jīng)改版過(guò)一個(gè)巡查采集信息的產(chǎn)品,采集的信息為了保證真實(shí)性,后臺(tái)需要專(zhuān)人對(duì)信息做審核,對(duì)于龐大的數(shù)據(jù),如果審核功能設(shè)計(jì)的不合理,就會(huì)變得費(fèi)時(shí)又費(fèi)力。

而舊版的設(shè)計(jì)就是如此,頁(yè)面的設(shè)計(jì)把采集的信息用列表呈現(xiàn),審核人員需要點(diǎn)擊列表中的審核小按鈕進(jìn)入詳情頁(yè)才可以進(jìn)行審核,審核下一條需要重復(fù)前面的操作,交互上是標(biāo)準(zhǔn)的往復(fù)式操作邏輯,如下圖所示。

為了解決審核效率問(wèn)題,改版了審核的交互設(shè)計(jì),最核心的改變就是“一鍵審核”,下圖所示,同樣是列表呈現(xiàn),增加審核模式,點(diǎn)擊進(jìn)入審核模式后,全屏展示(可以顯示更多內(nèi)容),當(dāng)點(diǎn)擊審核通過(guò)時(shí),立馬切換下一條信息,這樣就實(shí)現(xiàn)了連續(xù)性的交互審核方式。

在此案例中,為了助力審核效率,UI設(shè)計(jì)上把主要需要審核的信息,全部固定呈現(xiàn)在第一屏,對(duì)于有些板塊信息過(guò)多時(shí)需要滾動(dòng)查看,但也盡可能保證了信息不多時(shí),能夠一屏全部呈現(xiàn)出來(lái),這樣審核人員在不用挪動(dòng)鼠標(biāo)的情況下,只需要點(diǎn)點(diǎn)點(diǎn)即可完成每一條信息的快速審核。

同時(shí),審核按鈕較大的設(shè)計(jì),也是為了滿(mǎn)足審核人員能夠準(zhǔn)確點(diǎn)擊,按鈕旁邊增加了待審核量的統(tǒng)計(jì),能給用戶(hù)一種目標(biāo)感。

3. 易用性

易用性是指用戶(hù)使用產(chǎn)品能夠快速上手,這包括易理解、易操作、吸引性等。

易用性在產(chǎn)品迭代過(guò)程中是需要著重思考并優(yōu)化的方面,用戶(hù)一般是通過(guò)產(chǎn)品使用的易用性來(lái)衡量產(chǎn)品的好與壞,哪怕產(chǎn)品很穩(wěn)定。舉個(gè)例子,筆者曾在過(guò)的一個(gè)家公司,財(cái)務(wù)報(bào)銷(xiāo)系統(tǒng)使用效率及其低下,出差員工報(bào)銷(xiāo)差旅費(fèi)一般都需要花掉半天到一天的時(shí)間,因?yàn)楫a(chǎn)品操作難度大,以及線(xiàn)上線(xiàn)下結(jié)合的不夠好。

例如報(bào)銷(xiāo)功能入口在二級(jí)頁(yè)面不容易找到、當(dāng)信息提交后沒(méi)有任何引導(dǎo),不知道下一步該做什么,每次需要問(wèn)有經(jīng)驗(yàn)的老員工,然后老員工也是一頓操作加回憶,最后跟你說(shuō)“好像應(yīng)該打印單據(jù)找領(lǐng)導(dǎo)簽字了”。

不僅如此,產(chǎn)品報(bào)銷(xiāo)的表單設(shè)計(jì),把各種分類(lèi)全部集中在一起,使用者很難辨別應(yīng)該填寫(xiě)哪個(gè),很多時(shí)候填了半天,發(fā)現(xiàn)把報(bào)銷(xiāo)填在了借款。這一系列不友好的產(chǎn)品體驗(yàn),最后只會(huì)導(dǎo)致員工不愿意出差,不想面對(duì)繁瑣的報(bào)銷(xiāo)工作。

做好產(chǎn)品的易用性,要遵循一些原則,首先是保持產(chǎn)品設(shè)計(jì)的一致性,讓用戶(hù)有熟悉感,不要讓用戶(hù)迷失在產(chǎn)品中,當(dāng)用戶(hù)有疑惑時(shí)及時(shí)提醒,這點(diǎn)需要做可用性測(cè)試。

另外,要把產(chǎn)品首頁(yè)設(shè)計(jì)好,做好流量分發(fā),用戶(hù)通常只愛(ài)在首頁(yè)找東西,而不是二級(jí)頁(yè)面或者更深。B端產(chǎn)品有的服務(wù)企業(yè)員工,有的服務(wù)項(xiàng)目,比如OA系統(tǒng),服務(wù)的是企業(yè)員工,這類(lèi)產(chǎn)品要有協(xié)同工作的功能,需要了解組織架構(gòu),善于從多個(gè)角色視角去看待問(wèn)題,避免因?yàn)楫a(chǎn)品設(shè)計(jì)導(dǎo)致某個(gè)角色工作量增加。

服務(wù)項(xiàng)目的產(chǎn)品,對(duì)外有商業(yè)屬性,要做好個(gè)性化配置功能,因?yàn)榭蛻?hù)總是有個(gè)性化的需求,但也要遵循產(chǎn)品的原則。例如外賣(mài)的商家都希望有刪差評(píng)的功能,但其實(shí)這樣的功能是不可以有的,這會(huì)違背產(chǎn)品的商業(yè)邏輯,商家可以刪差評(píng),服務(wù)意識(shí)就會(huì)很難上去。

4. 好看

B端產(chǎn)品0-1,好看是最后應(yīng)該考慮的方面,但這并不代表不重要,而是當(dāng)與穩(wěn)定性、高效性…不能并轡而行時(shí),需要合理作出讓步。產(chǎn)品應(yīng)該是先問(wèn)世,功能和架構(gòu)都得到了驗(yàn)證后,然后再去著重優(yōu)化視覺(jué)層面以及提高產(chǎn)品體驗(yàn)。

在視覺(jué)設(shè)計(jì)上,B端產(chǎn)品應(yīng)該是干凈整潔,B端產(chǎn)品通常是為了工作,經(jīng)常長(zhǎng)時(shí)間沉浸式使用,所以盡量少用過(guò)于強(qiáng)烈刺激性的色彩。

產(chǎn)品設(shè)計(jì)目標(biāo),應(yīng)該是從用戶(hù)使用產(chǎn)品的效率性、便捷性出發(fā),不能讓視覺(jué)效果喧賓奪主,這也就是B端產(chǎn)品慣用冷靜理性的藍(lán)色調(diào)原因。

另外,產(chǎn)品的UI設(shè)計(jì)要善于運(yùn)用第三方組件庫(kù)設(shè)計(jì),比如選擇器、折疊面板、上傳、表格、表單等組件,這些成熟的組件都代表了用戶(hù)常用的操作習(xí)慣,同時(shí)組件的使用有利于和技術(shù)人員高效協(xié)作。

總結(jié)

綜上所述,B端產(chǎn)品設(shè)計(jì)優(yōu)先級(jí)方面應(yīng)該是:穩(wěn)定性-高效性-易用性-好看。

B端產(chǎn)品0-1,功能上做到最小可用版本即可,這樣可以推動(dòng)產(chǎn)品的穩(wěn)定性。對(duì)于高效性、易用性、好看都是產(chǎn)品上線(xiàn)之后,需要著重優(yōu)秀的方面。

最后

最后需要強(qiáng)調(diào)的是,產(chǎn)品設(shè)計(jì)原則沒(méi)有標(biāo)準(zhǔn),以上觀點(diǎn)可能只適用于一部分B端產(chǎn)品的設(shè)計(jì)理念。產(chǎn)品設(shè)計(jì)對(duì)于不同行業(yè)、不同公司、不同決策者都會(huì)有很大的差異,沒(méi)有最好的設(shè)計(jì)原則,只有最適合你產(chǎn)品的原則。

 

作者:吳星辰,微信公眾號(hào):互聯(lián)網(wǎng)設(shè)計(jì)幫

本文由 @吳星辰 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來(lái)自Unsplash,基于CC0協(xié)議

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 目前還沒(méi)評(píng)論,等你發(fā)揮!