2023-2-16 資深UI設(shè)計(jì)者
度咔是百度短視頻生態(tài)首款面向泛知識創(chuàng)作者的視頻剪輯工具,致力于降低泛知識類作者的創(chuàng)作門檻,助力生產(chǎn)優(yōu)質(zhì)的作品。
隨著產(chǎn)品的功能迭代,體驗(yàn)的逐步更新,產(chǎn)品依勢也需要打造更好的運(yùn)營氛圍和品牌印象來建立用戶口碑、提升轉(zhuǎn)化。對此,設(shè)計(jì)側(cè)針對度咔產(chǎn)品進(jìn)行了全面的思考和分析,通過重新定義度咔運(yùn)營視覺語言,明確產(chǎn)品調(diào)性,幫助用戶更新品牌認(rèn)知。
一、品牌框架搭建
產(chǎn)品的運(yùn)營視覺不只是單純的畫面展示,其背后都有更加明確的設(shè)計(jì)理念和手段,但運(yùn)營視覺語言并不是千篇一律的,首先需要明確自身定位,突出產(chǎn)品獨(dú)特性。
設(shè)計(jì)初期,我們針對同類型產(chǎn)品與用戶類型進(jìn)行了大量分析,在用戶人群劃分上度咔更具有針對性,目標(biāo)用戶是口播自媒體、知識類創(chuàng)作者。但不像專業(yè)剪輯軟件門檻那么高,度咔更多的是通過特色產(chǎn)品功能幫助作者去降低剪輯門檻,業(yè)務(wù)主要通過征稿和教程的運(yùn)營活動來提升用戶認(rèn)知,帶動日活。
由此,我們梳理出度咔的品牌框架圖。以度咔「專為口播自媒體打造的剪輯工具」產(chǎn)品定位作為切入點(diǎn),依據(jù)其自身定位和度咔區(qū)別于同類產(chǎn)品的特色功能,我們提煉出“便捷”、“智能”、“專業(yè)”產(chǎn)品核心關(guān)鍵詞。
二、定義度咔運(yùn)營視覺語言
在前期創(chuàng)意階段,我們通過大量的競品調(diào)研、創(chuàng)意發(fā)散、概念嫁接等創(chuàng)意手段,找到時(shí)下大字為主導(dǎo)的版式創(chuàng)意。簡潔明確的版式結(jié)構(gòu),適當(dāng)?shù)漠嬅媪舭?,使各元素在版面中形成具有條理清晰、富有節(jié)奏的視覺關(guān)系。這種邏輯方式,為運(yùn)營視覺的高效、科學(xué)、嚴(yán)謹(jǐn)性提供了極大的便捷,同時(shí)也對應(yīng)了度咔便捷、智能、專業(yè)的品牌感知。
對品牌定位、業(yè)務(wù)訴求、產(chǎn)品功能進(jìn)行整合后,我們搭建以構(gòu)成、配色、元素為主的視覺語言框架。
與時(shí)下大字為主導(dǎo)的版式創(chuàng)意相結(jié)合,建立以大字排版,強(qiáng)構(gòu)成感為主的視覺語言基調(diào)。通過大量的風(fēng)格測試不斷完善視覺基調(diào)并投入到項(xiàng)目中,同時(shí)規(guī)范運(yùn)營功能排版,搭建元素庫,通過設(shè)計(jì)手法,達(dá)到專業(yè)與簡潔的平衡,統(tǒng)一的視覺基調(diào)和品牌色強(qiáng)化用戶對品牌認(rèn)知。
1、重塑視覺基調(diào):
1)統(tǒng)一風(fēng)格
度咔以往的運(yùn)營視覺趨于參差,導(dǎo)致整體視覺有較為強(qiáng)烈的割裂感,煥新后的視覺變得更加直率簡約,以簡潔的視覺風(fēng)格保證內(nèi)容傳遞的高效性。拋棄了諸多裝飾元素,取而代之的是硬網(wǎng)格,保持視覺整體和諧統(tǒng)一感,同時(shí)也傳遞出度咔便捷、智能、專業(yè)的產(chǎn)品調(diào)性。
我們對運(yùn)營頁面進(jìn)行了布局重構(gòu),采用白色底的背景突出文字信息,使得內(nèi)容信息傳達(dá)更加明確,突出核心內(nèi)容。在各類場景中,我們通過品牌色彩、圖形、符號的滲透,強(qiáng)化度咔品牌印記。
2)主題延展
根據(jù)業(yè)務(wù)訴求,保持主題性征稿活動的特色——在強(qiáng)化功能點(diǎn)的運(yùn)營活動中采用3D元素和彌散漸變背景,如夏日主題將度咔符號與泳圈做3D創(chuàng)意結(jié)合,增添活動氛圍感。
2、品牌色煥新:
1)建立度咔品牌色應(yīng)用規(guī)范。增強(qiáng)品牌識別性和記憶點(diǎn)。
首先搜集符合產(chǎn)品調(diào)性的顏色情緒版,選取整體偏明亮,識別度高的新品牌藍(lán)色。對比原來偏紫的品牌藍(lán),現(xiàn)在升級后的藍(lán)色更顯專業(yè)智能,且更具有電子意味。
在一個科學(xué)有效的色彩系統(tǒng)里,往往包含至少兩種色彩:主色+輔助色,兩者互相搭配組合成產(chǎn)品體系的整體色彩感受,減少用戶在產(chǎn)品體驗(yàn)中對反復(fù)出現(xiàn)的主色的視覺疲勞。
我們將藍(lán)色賦予了統(tǒng)一的品牌認(rèn)知感受,并且將藍(lán)色加入到橙色里,生成了度咔特有的藍(lán)橙色系。橙色在度咔的色彩系統(tǒng)中起著至關(guān)重要的作用,為產(chǎn)品帶來積極,活力的感受,同時(shí)深黑和灰色創(chuàng)造結(jié)構(gòu)、表達(dá)邊界、建立信息層次。
以基礎(chǔ)征稿活動為主的頁面使用度咔標(biāo)準(zhǔn)藍(lán);在需要強(qiáng)主題和活動氛圍的頁面加入輕量的彌散漸變色彩。
3、提升效率:
1)元素庫搭建
建立度咔元素庫,規(guī)范化運(yùn)營活動主視覺圖形原創(chuàng)性和創(chuàng)意性,沉淀設(shè)計(jì)資產(chǎn)。
由于后期運(yùn)營活動多處用到3D元素,對3D的質(zhì)感進(jìn)行了規(guī)范統(tǒng)一。輕量化的3D風(fēng)格更加注重極簡主義理性美學(xué)。
考慮到運(yùn)營頁面的通用性,避免3D材質(zhì)的喧賓奪主,材質(zhì)風(fēng)格以簡單通用為主,顏色以品牌色為基礎(chǔ),采用光感通透的玻璃材質(zhì),加入環(huán)境光感。明朗,透傳度咔的品牌氣質(zhì)。
四、總結(jié)
本次通過度咔運(yùn)營視覺語言的搭建,無論從產(chǎn)品本身還是設(shè)計(jì)側(cè),在數(shù)據(jù)和效率上都有明顯的提升。而設(shè)計(jì)作為和用戶最近的一方,在平衡各方訴求后呈現(xiàn)給用戶一個全新專業(yè)感十足的產(chǎn)品,進(jìn)一步向用戶傳達(dá)品牌感知,助力創(chuàng)作者發(fā)現(xiàn)更多美好。
感謝閱讀,以上內(nèi)容均由百度MEUX團(tuán)隊(duì)原創(chuàng)設(shè)計(jì),以及百度MEUX版權(quán)所有,轉(zhuǎn)載請注明出處,違者必究,謝謝您的合作。申請轉(zhuǎn)載授權(quán)后臺回復(fù)【轉(zhuǎn)載】。也歡迎加入MEUX,視覺/交互/運(yùn)營設(shè)計(jì)師,可投簡歷至MEUX@BAIDU.COM (注明信息獲取來源如:站酷)
關(guān)于我們:
MEUX,百度移動生態(tài)用戶體驗(yàn)設(shè)計(jì)中心,負(fù)責(zé)百度移動生態(tài)體系的用戶/商業(yè)產(chǎn)品的全鏈路體驗(yàn)設(shè)計(jì)。服務(wù)的產(chǎn)品包括百度APP、百度搜索、百度百科、百度貼吧、百度商業(yè)產(chǎn)品等。MEUX以「簡單極致」為設(shè)計(jì)理念,創(chuàng)造極致用戶體驗(yàn)的同時(shí)賦能商業(yè),推動設(shè)計(jì)行業(yè)的價(jià)值和影響力,讓生活因設(shè)計(jì)而更美好。
藍(lán)藍(lán)設(shè)計(jì)( tweetduck.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)公司
藍(lán)藍(lán)設(shè)計(jì)的小編 http://tweetduck.com