構(gòu)建平臺(tái)設(shè)計(jì)語(yǔ)言系統(tǒng)

2022-7-14 純純

設(shè)計(jì)語(yǔ)言是把設(shè)計(jì)作為一種“溝通的方式”，在特定的場(chǎng)景中進(jìn)行內(nèi)容與信息的傳達(dá)。設(shè)計(jì)是介于科學(xué)與美學(xué)之間的一種藝術(shù)，是需要理性的去解決感性的問題。它和藝術(shù)之間的差別就在于“ 解決問題”。

設(shè)計(jì)語(yǔ)言有哪些？

設(shè)計(jì)語(yǔ)言最底層是項(xiàng)目設(shè)計(jì)語(yǔ)言，具有典型特征和主題，比如醫(yī)療項(xiàng)目凸顯專業(yè)冷靜，節(jié)日項(xiàng)目凸顯熱鬧氛圍。往上一層是產(chǎn)品設(shè)計(jì)語(yǔ)言，強(qiáng)調(diào)個(gè)性品牌，比如小視頻的設(shè)計(jì)深色更沉浸，電商從結(jié)構(gòu)到色彩都凸顯熱鬧。很多產(chǎn)品隨著發(fā)展，形成一些系列平臺(tái)服務(wù)，平臺(tái)設(shè)計(jì)語(yǔ)言確保服務(wù)“統(tǒng)一規(guī)范”。最頂層是生態(tài)設(shè)計(jì)語(yǔ)言，跨設(shè)備跨平臺(tái)和硬件呈現(xiàn)的設(shè)計(jì)語(yǔ)言。

百度直播業(yè)務(wù)，從單一業(yè)務(wù)形成系列 平臺(tái)服務(wù)，囊括的不只是B端和C端用戶產(chǎn)品，還有8大垂類蓬勃發(fā)展，以及跨業(yè)務(wù)多宿主的呈現(xiàn)。龐大的平臺(tái)業(yè)務(wù)，特別需要建設(shè)平臺(tái)設(shè)計(jì)語(yǔ)言。

如何構(gòu)建設(shè)計(jì)語(yǔ)言？

所有的設(shè)計(jì)語(yǔ)言，都是服務(wù)于業(yè)務(wù) 頂層戰(zhàn)略發(fā)展。制定設(shè)計(jì)策略前，需對(duì)業(yè)務(wù)所在的行業(yè)背景、品牌戰(zhàn)略、用戶群體、流行趨勢(shì)有充足的認(rèn)知。當(dāng)返工無(wú)數(shù)次還是沒方向時(shí)，說明以下前四點(diǎn)需要再深入明確。

建立 設(shè)計(jì)原則時(shí)（設(shè)計(jì)語(yǔ)言的標(biāo)準(zhǔn)），不妨嘗試把品牌戰(zhàn)略人格化，由所有人解決所有人問題的愿景，得出產(chǎn)品是一個(gè)解決問題的行業(yè)專家的身份，Ta傳達(dá)的氣質(zhì)是簡(jiǎn)潔大方的儀表，親和有力的儀態(tài)，和專業(yè)權(quán)威的素養(yǎng)。

設(shè)計(jì)語(yǔ)言以現(xiàn)代輕奢風(fēng)格為基調(diào)，它大簡(jiǎn)至美、配色和諧、材質(zhì)考究，以獨(dú)具特色的現(xiàn)代格調(diào)，構(gòu)筑起一個(gè)充滿質(zhì)感又十分舒適的直播間，給用戶一致、友好、有品的體驗(yàn)。

設(shè)計(jì)動(dòng)手前，按照風(fēng)格基調(diào)具象化拆解分析必不可少，每一個(gè)元素的表達(dá)手法都要定位清晰。

01 至簡(jiǎn) 光影藝術(shù)圖標(biāo)體系

在圖標(biāo)的設(shè)計(jì)中，我們基于專業(yè)親和的品牌理念延展出2個(gè)不同的方向。方案一以直線折紙與光影為視覺元素，呈現(xiàn)一個(gè)用心專業(yè)的態(tài)度。方案二以曲線雕刻藝術(shù)展現(xiàn)專業(yè)親和的魅力。

圖標(biāo)體系化，多場(chǎng)景驗(yàn)證一致性，發(fā)現(xiàn)方案一不夠極致，造型復(fù)雜；方案二具備良好的一致性，但破壞了物體固有的結(jié)構(gòu)，影響識(shí)別度。

在一致性的前提下，嘗試簡(jiǎn)化、提高識(shí)別度。巧妙的將光影和結(jié)構(gòu)交匯，極簡(jiǎn)到2個(gè)圖層呈現(xiàn)主體；語(yǔ)義清晰識(shí)別度高；角度漸變光影帶來(lái)舒適親和感，15°x角度的精準(zhǔn)把控傳達(dá)專業(yè)的品牌特性。因此總結(jié)出圖標(biāo)繪制要遵循的法則為識(shí)別性、品牌性、愉悅性、一致性。

02 和諧家族感的色彩體系

a）標(biāo)準(zhǔn)色

初期直播品牌色繼承百度App品牌色，隨著業(yè)務(wù)逐漸中臺(tái)化，需要專屬直播色。運(yùn)用色彩心理學(xué)傳遞給人不同的情緒及心理感受，尋找直播的專屬色相，而活力、溫暖的紅色色調(diào)，更能體現(xiàn)親和有力的產(chǎn)品氣質(zhì)。

紅色也有冷暖之分，此時(shí)提高色相、飽和度的顆粒度，H色相以350°為起點(diǎn)，以2°遞增或遞減，S飽和度以5°為階梯，生成更多色階（保持相同B明度100），在多界面和真機(jī)驗(yàn)證，得出直播專屬紅（H350 S80 B100），冷暖適中符合平臺(tái)屬性。

b)協(xié)調(diào)的輔助色

同時(shí)，運(yùn)用色環(huán)建立輔助色彩體系。H色相以350°為起點(diǎn)，以15°遞增或遞減標(biāo)準(zhǔn)，創(chuàng)建24色相色板（保持相同B明度100、S飽和度80）；選取柔和與協(xié)調(diào)的類似色和鄰近色作為家族色彩主體，調(diào)和互補(bǔ)色與對(duì)比色，平衡整體色調(diào)。因?yàn)椴煌嗟母泄倜鞫炔⒉幌嗤Ｕ恳粋€(gè)輔助色的HSB，達(dá)到色彩感官上一致。

C）調(diào)色版

一般會(huì)有2種方法，一種是使用明度差獲得統(tǒng)一性佳的調(diào)色板，優(yōu)點(diǎn)是落地成本低，代碼可直接實(shí)現(xiàn)；另一種則是微調(diào)飽和度和色相，獲得鮮明的色板，可使用在插圖繪制上。

03 考究新穎獨(dú)特材質(zhì)

亞克力，這種具有透明質(zhì)感、光學(xué)品質(zhì)的材質(zhì)，在設(shè)計(jì)領(lǐng)域最早應(yīng)用在家居設(shè)計(jì)上，被互聯(lián)網(wǎng)設(shè)計(jì)師熟知是在微軟的概念視頻里，隨之逐漸應(yīng)用到icon繪制上，亞克力1.0版本背景和主體層次沒拉開，2.0版本更趨向加大不透明度和模糊值，達(dá)到清晰舒適又兼具藝術(shù)美感。

這種量身打造的稀缺材質(zhì)運(yùn)用在運(yùn)營(yíng)玩法上，如紅包雨玩法，即能凸顯平臺(tái)專業(yè)用心的態(tài)度，又能強(qiáng)化用戶消費(fèi)行為轉(zhuǎn)化，助力變現(xiàn)增長(zhǎng)。

用戶激勵(lì)體系，采用3D玉石潤(rùn)澤質(zhì)感+動(dòng)態(tài)折射光影，體現(xiàn)有內(nèi)涵不張揚(yáng)的泛知識(shí)調(diào)性，凸顯用戶獨(dú)特身份感。

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

作者：百度MEUX

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( m.sdgs6788.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、包裝設(shè)計(jì) 、圖標(biāo)定制、用戶體驗(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咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司