Bs界面設(shè)計(jì)之一:從視覺(jué)產(chǎn)品兩方面,分析2022年B端設(shè)計(jì)的發(fā)展趨勢(shì)

2022-6-13    博博


前言:


在 2020 年,疫情最為嚴(yán)峻的時(shí)候,B 端這一領(lǐng)域得到了前所未有的關(guān)注,而那時(shí),身為 B 端用戶(hù)體驗(yàn)設(shè)計(jì)師的我,也曾總結(jié)過(guò),當(dāng)時(shí) B 端設(shè)計(jì)的諸多趨勢(shì),比如:

多端需求:即桌面端、平板端、移動(dòng)端的設(shè)計(jì)形式

設(shè)計(jì)中臺(tái):擁有更為統(tǒng)一的設(shè)計(jì)平臺(tái),與這兩年討論較多的設(shè)計(jì)資產(chǎn)相同,都是起到快速協(xié)作的作用

隨著 2022 年的到來(lái),B 端行業(yè)又會(huì)迎來(lái)哪些新的機(jī)會(huì)?今天我們就從整個(gè)的 B 端入手,回顧一下 2021 年的設(shè)計(jì)形式,展望一下 2022 年的設(shè)計(jì)趨勢(shì)。當(dāng)然趨勢(shì)完全是我自己個(gè)人主觀(guān)理解,僅供參考,如有異議,以你為準(zhǔn)~

完整的趨勢(shì),我們會(huì)分為視覺(jué)趨勢(shì)與產(chǎn)品趨勢(shì):

  1. 視覺(jué)趨勢(shì):主要圍繞設(shè)計(jì)當(dāng)中的細(xì)節(jié)展開(kāi),比如圖標(biāo)、色彩、字體、插畫(huà)等
  2. 產(chǎn)品趨勢(shì):主要是了解不同的 B 端產(chǎn)品當(dāng)中究竟有哪些發(fā)展形式,對(duì)于設(shè)計(jì)師又會(huì)產(chǎn)生何種影響?


視覺(jué)趨勢(shì)

1. 3D 設(shè)計(jì)風(fēng)格

雖然 3D 化的視覺(jué)風(fēng)格早已到來(lái),但是在 B 端市場(chǎng)上,3D 風(fēng)格在此之前依舊表現(xiàn)的十分克制。隨著 C4D、Blender 這些 3D 建模軟件的不斷普及,再加上互聯(lián)網(wǎng)上關(guān)于 3D 建模教程的增多,你會(huì)發(fā)現(xiàn) 3D 風(fēng)格的視覺(jué)表現(xiàn),是一個(gè) B 端視覺(jué)設(shè)計(jì)師的基本要求。

而 3D 風(fēng)格用在 B 端軟件當(dāng)中,會(huì)有兩個(gè)使用場(chǎng)景:

圖標(biāo)

因?yàn)樵?B 端產(chǎn)品當(dāng)中,圖標(biāo)本身就是非常難以去表現(xiàn),比如“物聯(lián)網(wǎng),大數(shù)據(jù)”,許多抽象詞匯很難通過(guò)一個(gè)具象的事物進(jìn)行表達(dá),而在企業(yè)官網(wǎng)當(dāng)中,在視覺(jué)表現(xiàn)上的要求又十分的高。因此你會(huì)發(fā)現(xiàn),在視覺(jué)風(fēng)格上的選擇,往往只有 3D 圖標(biāo) + 插畫(huà)這一條路。

從視覺(jué)產(chǎn)品兩方面,分析2022年B端設(shè)計(jì)的發(fā)展趨勢(shì)

并且 3D 圖標(biāo)的使用場(chǎng)景不會(huì)太過(guò)于局限,也可以用于產(chǎn)品的工作臺(tái)、運(yùn)營(yíng)營(yíng)銷(xiāo)工具箱等頁(yè)面,因此 3D 圖標(biāo)的出現(xiàn),它的應(yīng)用場(chǎng)景也會(huì)相比之前要更加的廣闊。

從視覺(jué)產(chǎn)品兩方面,分析2022年B端設(shè)計(jì)的發(fā)展趨勢(shì)

可視化大屏

大屏設(shè)計(jì)也在不斷的“內(nèi)卷”,因?yàn)閭鹘y(tǒng)的 2D 可視化大屏所搭建出來(lái)的大屏已經(jīng)滿(mǎn)足不了企業(yè)的野心, 像 DataV 騰訊云圖 ,大家都在朝著 3D 風(fēng)格,炫酷的方向進(jìn)行延展,因此也就會(huì)導(dǎo)致 3D 的視覺(jué)風(fēng)格需求激增,而 3D 建模仿佛就是大勢(shì)所趨。

從視覺(jué)產(chǎn)品兩方面,分析2022年B端設(shè)計(jì)的發(fā)展趨勢(shì)

2. 新擬態(tài)

雖然新擬態(tài)是在前兩年的產(chǎn)物。這個(gè)設(shè)計(jì)風(fēng)格背后,遭到了很多設(shè)計(jì)師的質(zhì)疑與排擠。但是隨著這個(gè)風(fēng)格的不斷成熟,感覺(jué)它在 B 端視覺(jué)領(lǐng)域(特指的是官網(wǎng) ),是非常受歡迎的,因?yàn)檎w的風(fēng)格,與官網(wǎng)的設(shè)計(jì)形式趨同。

同時(shí)作為 B 端產(chǎn)品的官網(wǎng),其實(shí)是更需要新擬態(tài)這種風(fēng)格。因?yàn)殡娔X場(chǎng)景下鼠標(biāo)光標(biāo)對(duì)頁(yè)面進(jìn)行 Hover 操作給出的真實(shí)反饋,而使用了新擬態(tài)的官網(wǎng)按鈕,給你的反饋非常真實(shí)。

這里安利一下騰訊云的首頁(yè)官網(wǎng),大家就會(huì)發(fā)現(xiàn)在設(shè)計(jì)風(fēng)格上大量的采取了新擬態(tài)元素,并且配合 3D 風(fēng)格的圖標(biāo),以及毛玻璃材質(zhì)的設(shè)計(jì),讓它的設(shè)計(jì)瞬間加分不少。

從視覺(jué)產(chǎn)品兩方面,分析2022年B端設(shè)計(jì)的發(fā)展趨勢(shì)

3. 開(kāi)源的設(shè)計(jì)系統(tǒng)

在去年,設(shè)計(jì)系統(tǒng)迎來(lái)了一波發(fā)展的高峰期,隨著字節(jié)、騰訊,三大設(shè)計(jì)系統(tǒng)(Arco Design、TDesign、Semi Design)的開(kāi)源,其實(shí)是給我們很多 B 端設(shè)計(jì)初學(xué)者,有了更加完整仔細(xì)的 B 端入門(mén)教程。

比如 Arco Design 的組件用法 https://arco.design/docs/spec/link

從視覺(jué)產(chǎn)品兩方面,分析2022年B端設(shè)計(jì)的發(fā)展趨勢(shì)

清晰的講解了每一個(gè)組件的使用方式,以及注意事項(xiàng),仔細(xì)閱讀這里面的內(nèi)容,其實(shí)就是 B 端設(shè)計(jì)的入門(mén)學(xué)習(xí)。而未來(lái),國(guó)內(nèi)的環(huán)境,開(kāi)源的系統(tǒng)也會(huì)越來(lái)越多,大家可以針對(duì)這幾大類(lèi)不同的設(shè)計(jì)系統(tǒng)進(jìn)行對(duì)比,或許會(huì)有一番收獲。


產(chǎn)品趨勢(shì)

4. 超級(jí) app

這里的超級(jí) app 可能和大家潛意識(shí)里的支付寶、微信這些軟件不太一樣

在 B 端行業(yè),隨著疫情的不斷擴(kuò)散、再加上兩年時(shí)間的發(fā)展,很多 B 端產(chǎn)品的功能架構(gòu)都出現(xiàn)了一個(gè)現(xiàn)象,產(chǎn)品的功能開(kāi)始變得非常擁擠。因?yàn)?B 端軟件的核心價(jià)值其實(shí)就是靠著一個(gè)又一個(gè)功能去累積,也就意味著隨著 B 端產(chǎn)品的發(fā)展,功能模塊在不斷的累積,導(dǎo)致在設(shè)計(jì)層面,這樣的現(xiàn)象變得更加嚴(yán)峻。

你會(huì)發(fā)現(xiàn)左側(cè)的導(dǎo)航菜單已經(jīng)完全沒(méi)有辦法裝下這些導(dǎo)航內(nèi)容,而這一現(xiàn)象也反映在很多產(chǎn)品當(dāng)中,比如我了解的飛書(shū)管理后臺(tái)、薪人薪事 等等諸多 B 端產(chǎn)品,它們?cè)谡麄€(gè)導(dǎo)航內(nèi)容上,已經(jīng)增加到一級(jí)導(dǎo)航 15+ 、二級(jí)導(dǎo)航 40+ ,這無(wú)疑會(huì)開(kāi)始對(duì)設(shè)計(jì)師的能力造成巨大考驗(yàn)。

從視覺(jué)產(chǎn)品兩方面,分析2022年B端設(shè)計(jì)的發(fā)展趨勢(shì)

面對(duì)這一情況,許多導(dǎo)航菜單都將會(huì)迎來(lái)前所未有的挑戰(zhàn),最近也在深入研究導(dǎo)航菜單過(guò)多時(shí)的解決辦法,發(fā)現(xiàn)了一些新的導(dǎo)航菜單設(shè)計(jì)方法,有機(jī)會(huì)咱們重新梳理一下導(dǎo)航菜單的內(nèi)容,將 B 端設(shè)計(jì)指南文章進(jìn)行更新。

從視覺(jué)產(chǎn)品兩方面,分析2022年B端設(shè)計(jì)的發(fā)展趨勢(shì)

低代碼定制化

低代碼一直是我關(guān)注的一個(gè)領(lǐng)域,先給不明白低代碼的同學(xué)簡(jiǎn)單科普一下。

低代碼,一種快速開(kāi)發(fā)應(yīng)用的軟件,將通用、可重復(fù)利用的代碼形成組件化的模塊,通過(guò)圖形化的界面來(lái)拖拽組件并形成應(yīng)用。低代碼能夠?qū)崿F(xiàn)只寫(xiě)少量代碼或不寫(xiě)代碼,類(lèi)似用“樂(lè)高積木”的方式來(lái)開(kāi)發(fā)。

在國(guó)外有很多著名的低代碼成功案例。Outsystems(國(guó)外非常出名的低代碼平臺(tái))幫助施耐德電氣在 20 個(gè)月內(nèi)推出了 60 款應(yīng)用程序,開(kāi)發(fā)過(guò)程加速了兩倍;在 2012 年即將推出 Model S 之際,特斯拉放棄了 SAP 的 ERP 產(chǎn)品(可以思考一下為什么),改用低代碼開(kāi)發(fā)平臺(tái) Mendix,用 25 個(gè)人四個(gè)月時(shí)間自建 ERP 系統(tǒng)。

去年,低代碼平臺(tái),也有很多新產(chǎn)品面世,其中就包含:

從視覺(jué)產(chǎn)品兩方面,分析2022年B端設(shè)計(jì)的發(fā)展趨勢(shì)

因此你會(huì)發(fā)現(xiàn),其實(shí)低代碼就是在解決一件事,圍繞著某一個(gè)業(yè)務(wù)場(chǎng)景,通過(guò)平臺(tái)的持續(xù)完善優(yōu)化。讓所有的功能都能?chē)@這個(gè)業(yè)務(wù)展開(kāi),其中包括:權(quán)限、時(shí)間軸、流程、表單、公式等等,能夠解決很多特殊的業(yè)務(wù)場(chǎng)景。而低代碼會(huì)涉及到設(shè)計(jì)思路上的轉(zhuǎn)變,以及低代碼編輯器的出現(xiàn),如何去設(shè)計(jì)如此復(fù)雜的配置流程,如何讓用戶(hù)能夠快速上手,如果你能夠有比較完整的思路,這些都會(huì)成為我們?cè)O(shè)計(jì)的新機(jī)會(huì)。

行業(yè)細(xì)分

隨著互聯(lián)網(wǎng)市場(chǎng)的不斷發(fā)展,用戶(hù)會(huì)越來(lái)越關(guān)注產(chǎn)品在自己行業(yè)的應(yīng)用,比如 CRM,其實(shí)只是一個(gè)籠統(tǒng)的稱(chēng)呼,現(xiàn)在 CRM 市場(chǎng)又會(huì)分為 SCRM、運(yùn)營(yíng) CRM,等諸多產(chǎn)品。

SaaS 類(lèi)的平臺(tái)也出現(xiàn)了負(fù)責(zé)從虛擬主機(jī)和數(shù)據(jù)庫(kù)層面入手的 iPaaS 以及從應(yīng)用和數(shù)據(jù)層面入手的 aPaaS。

即使是大家經(jīng)常使用的 釘釘、企微、飛書(shū),它們也在各自的領(lǐng)域有所擅長(zhǎng)。

從視覺(jué)產(chǎn)品兩方面,分析2022年B端設(shè)計(jì)的發(fā)展趨勢(shì)

因?yàn)?B 端產(chǎn)品,在底層邏輯上是不能允許趨同的產(chǎn)品出現(xiàn),如果你和別人的產(chǎn)品一樣,其實(shí)是沒(méi)有辦法在目前的市場(chǎng)上立足。因此你會(huì)發(fā)現(xiàn),雖然產(chǎn)品形式都會(huì)比較相同,但是 B 端市場(chǎng)十分廣闊,大家都在去尋找自己產(chǎn)品的差異化。

當(dāng)然市場(chǎng)是瞬息萬(wàn)變的,這里也只是簡(jiǎn)單聊聊我自己的看法,希望對(duì)你有所幫助。

作者:CE青年

轉(zhuǎn)載請(qǐng)注明:優(yōu)設(shè)網(wǎng)

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話(huà),可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)掃碼藍(lán)小助,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系。

魏華的微信.png

分享此文一切功德,皆悉回向給文章原作者及眾讀者.

免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)www.bouu.cn )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)、

UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司


更多精彩文章:






分享本文至:

日歷

鏈接

個(gè)人資料

存檔