追波年度最佳作品來(lái)自大家最熟悉的UI8團(tuán)隊(duì)中的Tran Mau Tri Tam ?，作者來(lái)自越南西貢，最佳作品截止目前355K瀏覽量，2933個(gè)贊。
為什么看似平平無(wú)奇的作品卻能獲得追波年度最佳作品呢？既不是C端也不是純B端的作品，更像一個(gè)網(wǎng)頁(yè)與平面的結(jié)合體。如果去掉搜索圖標(biāo)、分類圖標(biāo)和按鈕，你可以理解它就是一個(gè)平面作品，一個(gè)字體加幾何形體構(gòu)建的作品，為了豐富畫面的層次，讓畫面更加的活潑采用了多彩加幾何色塊，讓標(biāo)題閱讀有停頓感和呼吸感。faster底部的橫線讓它從標(biāo)題文字中脫穎而出，這種使用線條突出重要信息的設(shè)計(jì)也是今年追波設(shè)計(jì)流行趨勢(shì)之一。
MetroUI是Windows8的界面設(shè)計(jì)語(yǔ)言，在2010年至2013年間曾經(jīng)風(fēng)靡一時(shí)，那也是移動(dòng)互聯(lián)網(wǎng)的發(fā)展元年，現(xiàn)在國(guó)家推行實(shí)體經(jīng)濟(jì)、數(shù)字化帶動(dòng)To B 、To G 的發(fā)展元年，通過(guò)幾何色塊（MetroUI）實(shí)現(xiàn)B端產(chǎn)品與C端設(shè)計(jì)風(fēng)格的傳承與銜接，你會(huì)發(fā)現(xiàn)歷史總是驚人的相似。最后背景結(jié)合今年最流行的微軟風(fēng)，毛玻璃的多彩高斯模糊漸變風(fēng)，年度作品當(dāng)之無(wú)愧。
最后來(lái)看下按鈕的設(shè)計(jì)，正常的按鈕要么文字加色塊，要么左圖標(biāo)加右文字，它設(shè)計(jì)成左文本加右圖標(biāo)，更加注重信息的可讀性和易讀性，也體現(xiàn)B端設(shè)計(jì)重功能和交互體驗(yàn)，視覺點(diǎn)到為止的設(shè)計(jì)理念。
下面我們來(lái)欣賞年度最佳作品里面的流行趨勢(shì)吧。
字體三原則：可讀性、易識(shí)性、易讀性。當(dāng)你同時(shí)讀一篇文言文和一篇設(shè)計(jì)文章，肯定設(shè)計(jì)文章的內(nèi)容可讀性更好。易識(shí)性是用在字體設(shè)計(jì)上，不能過(guò)于浮夸的改變字體骨架、形體而不易識(shí)別。易讀性和每個(gè)位設(shè)計(jì)師都息息相關(guān)，因?yàn)槲覀兌夹枰幣盼谋尽．?dāng)我們小時(shí)候?qū)懽魑臅r(shí)，不會(huì)寫的文字可以用拼音代替。這時(shí)候讀者讀到拼音時(shí)會(huì)有停頓感，更加適合用戶閱讀。
通過(guò)給用戶制作停頓感來(lái)增加用戶的易讀性。可以在相關(guān)聯(lián)文本后面添加圖片、表情、圖標(biāo)來(lái)更好的理解文本內(nèi)容，豐富文本內(nèi)涵。比如情侶間表達(dá)愛意時(shí)會(huì)輸入文本，“我愛你”、“我Love你”、“我ai你”、“我??你”，哪個(gè)更加會(huì)有情感共鳴呢？不言而喻，相信你心中已經(jīng)有答案了。
在標(biāo)題文字上添加曲線來(lái)突出重要文案是2021追波最流行的趨勢(shì)之一，第一個(gè)設(shè)計(jì)目的就是突顯文字，其次就是想表現(xiàn)鉛筆真實(shí)書寫的感覺。之前很多帶有簽名的設(shè)計(jì)中，簽字的文本都是手寫體的感覺，手寫體對(duì)比電腦的機(jī)械字體會(huì)帶有一種人文氣息，也會(huì)讓兩者之間產(chǎn)生一種對(duì)比、矛盾。
除了突顯文本外，曲線還有視覺引導(dǎo)的作用。通過(guò)視覺引導(dǎo)讓用戶按照設(shè)計(jì)師編排的順序進(jìn)行瀏覽界面。當(dāng)然還有比這更科學(xué)的工具就是眼動(dòng)儀測(cè)試，通過(guò)真實(shí)用戶眼睛瀏覽界面顯示對(duì)應(yīng)的熱點(diǎn)圖。
多彩高斯?jié)u變風(fēng)是從色彩的角度來(lái)傳達(dá)和豐富畫面的，多彩高斯?jié)u變風(fēng)其實(shí)是從制造矛盾到平衡矛盾的過(guò)程，多彩漸變多為冷暖對(duì)比來(lái)制造畫面的沖突，需要控制冷暖畫面的大小來(lái)實(shí)現(xiàn)平衡。主流的還是以暖色突顯為主。多彩漸變主要起到活躍氣氛、吸引目光、平衡畫面的作用。
多彩高斯?jié)u變還可以結(jié)合輕擬物、幾何圖形、三維等新的組合方式去創(chuàng)新，給用戶呈現(xiàn)一種更加新穎的視覺表現(xiàn)形式。最后我們還是要回歸到內(nèi)容上，為了更好的傳達(dá)信息需要去設(shè)計(jì)與內(nèi)容相匹配的視覺風(fēng)格。
B端設(shè)計(jì)的火爆帶動(dòng)了B端相關(guān)模塊設(shè)計(jì)，更多的人也愿意嘗試B端相關(guān)模塊設(shè)計(jì)，側(cè)邊欄作為產(chǎn)品架構(gòu)中重要的導(dǎo)航系統(tǒng)，好的側(cè)邊欄設(shè)計(jì)能為用戶帶來(lái)更好的效率。主流側(cè)邊欄都做了展開、收起、拖拽等交互效果，也是受限于PC屏幕為展示更多數(shù)據(jù)而騰空間。側(cè)邊欄主要承擔(dān)的功能有導(dǎo)航、分類、自定義篩選、共享、新增等。追波的B端產(chǎn)品設(shè)計(jì)已經(jīng)不再是假大空概念設(shè)計(jì)，而是一套實(shí)用美觀可落地的設(shè)計(jì)。
儀表盤設(shè)計(jì)是一個(gè)很好的隱喻，想象一下開摩托車或汽車主駕駛前面的屏幕，汽車儀表有燃油表、車速表、里程表、水溫表、轉(zhuǎn)速表、故障指示燈等。B端類產(chǎn)品后臺(tái)界面的儀表盤設(shè)計(jì)也需要展示一些重要的數(shù)據(jù)和各種狀態(tài)，大體分為側(cè)標(biāo)欄、導(dǎo)航欄、待辦任務(wù)、個(gè)人信息、報(bào)表數(shù)據(jù)、消息中心、快捷入口等。當(dāng)然最重要的就是報(bào)表數(shù)據(jù)，團(tuán)隊(duì)收益、任務(wù)進(jìn)度、轉(zhuǎn)化比例、新增、存量、團(tuán)隊(duì)工作時(shí)長(zhǎng)等都是老板或領(lǐng)導(dǎo)關(guān)心的內(nèi)容。每個(gè)公司業(yè)務(wù)不同、每個(gè)人員權(quán)限不同，自定義的儀表盤也各有差異。重要的是突顯數(shù)據(jù)和業(yè)務(wù)狀態(tài)，需要分層級(jí)系統(tǒng)性去思考和設(shè)計(jì)。
復(fù)雜的事情簡(jiǎn)單化，簡(jiǎn)單的事情標(biāo)準(zhǔn)化，標(biāo)準(zhǔn)的事情流程化，流程的事情自動(dòng)化。流程設(shè)計(jì)是每一個(gè)企業(yè)核心功能和業(yè)務(wù)，可自定義的管理流程系統(tǒng)搭建也是B端產(chǎn)品設(shè)計(jì)的難點(diǎn)，需要對(duì)業(yè)務(wù)高度抽象，讓每一個(gè)業(yè)務(wù)人員可自定義的流程才是好的流程設(shè)計(jì)。
B端C化是B端產(chǎn)品設(shè)計(jì)的視覺表現(xiàn)力慢慢往C端產(chǎn)品設(shè)計(jì)的視覺靠齊，國(guó)內(nèi)B端產(chǎn)品界面設(shè)計(jì)視覺水平還有很大的提高空間。除了視覺上的提升外，由于業(yè)務(wù)的發(fā)展，B端產(chǎn)品也開始移動(dòng)化、智能化，國(guó)內(nèi)主流還是通過(guò)小程序、H5來(lái)現(xiàn)實(shí)B端產(chǎn)品C端化。
輕代碼化是一種低代碼賦能無(wú)代碼的方式，彌補(bǔ)無(wú)代碼拓展性差、覆蓋場(chǎng)景少的問(wèn)題。在保有無(wú)代碼靈活、易用、快捷的同時(shí)，又能覆蓋低代碼使用場(chǎng)景。簡(jiǎn)單理解就是無(wú)需代碼開發(fā)即可如搭積木般快速、靈活地創(chuàng)造屬于你的個(gè)性化管理系統(tǒng)，輕松實(shí)現(xiàn)多元業(yè)務(wù)場(chǎng)景的數(shù)字化管理。
輕代碼化將功能進(jìn)行打包，升級(jí)成全局可以用的配置，技術(shù)人員配置好后，業(yè)務(wù)人員在應(yīng)用編輯時(shí)直接選擇使用模版，綁定對(duì)應(yīng)的變量即可使用。
為什么人加色塊的組合方式能流行起來(lái)？還是B端行業(yè)流行帶動(dòng)的。B端講的更多的是企業(yè)對(duì)企業(yè)。企業(yè)對(duì)企業(yè)除了講行業(yè)解決方案外，還需要傳達(dá)公司的價(jià)值觀、使命、愿景。人加色塊的組合方式非常適合體現(xiàn)公司的企業(yè)文化。對(duì)于一家全球化的公司不同膚色的人物組合在一起，這種人文氣息和價(jià)值觀已經(jīng)就不言而喻了。
當(dāng)然企業(yè)也需要進(jìn)行營(yíng)銷，抓人眼球。幾千年來(lái)的遺傳證明了，人的大腦對(duì)食物、性、動(dòng)的東西、人臉和眼睛、危險(xiǎn)的動(dòng)物很敏感。人加色塊的組合方式也具有抓人眼球營(yíng)銷的功能。真可謂一舉兩得。
這種風(fēng)格更適合大公司，國(guó)內(nèi)的一些手機(jī)廠商OPPO、VIVO等也會(huì)通過(guò)手機(jī)+背景+人物來(lái)體現(xiàn)科技與人文的結(jié)合，而對(duì)于中小型公司產(chǎn)品差異化和行業(yè)解決方案展現(xiàn)應(yīng)該還是重中之重。
毛玻璃效果加大了模糊程度，透明效果更加扁平，很好的順應(yīng)當(dāng)下UI扁平化的設(shè)計(jì)趨勢(shì)。蘋果Mac OS Big Sur系統(tǒng)的圖標(biāo)、界面中運(yùn)用了大量毛玻璃和半透明元素，界面更扁平。至于C4D三維彩色玻璃的視頻教程可以在B站搜索“透光藝術(shù)-C4D創(chuàng)建彩色玻璃的4個(gè)技法”，完全能滿足UI設(shè)計(jì)師。當(dāng)然還有一個(gè)好消息就是Mac用戶可以享有OC一年免費(fèi)的使用權(quán)，具體安裝購(gòu)買方法可以上“某寶”就可以輕松搞定，真香。
輕擬物這幾年一直流行，在UI設(shè)計(jì)中趨于穩(wěn)定的位置。從寫實(shí)到扁平再到輕擬物，其實(shí)是設(shè)計(jì)師們一路不斷探索的結(jié)果。本質(zhì)就是光影對(duì)形體產(chǎn)生的視覺感受。在色彩中對(duì)高光、亮面、明暗交界線、暗面、反光（環(huán)境光）五個(gè)部分的處理。寫實(shí)三維的圖標(biāo)等設(shè)計(jì)更適用于簡(jiǎn)潔的畫面中，扁平等設(shè)計(jì)更適用于復(fù)雜一點(diǎn)的界面中，比如B端產(chǎn)品界面中的功能圖標(biāo)。輕擬物可使用的范圍更廣，效果更佳。Sketch、Figma軟件對(duì)于漸變、高光、投影、高斯模糊處理已經(jīng)非常簡(jiǎn)單且出彩。
簡(jiǎn)潔設(shè)計(jì)遵從了密斯·凡德羅的“少即是多”的設(shè)計(jì)原則，在B端產(chǎn)品界面中更加需要簡(jiǎn)潔設(shè)計(jì)，我們最熟悉的Sketch軟件界面已經(jīng)是相當(dāng)?shù)暮?jiǎn)潔了?；氐浆F(xiàn)實(shí)當(dāng)需求功能不斷增加，產(chǎn)品界面的編排如何取舍，如何保證界面的簡(jiǎn)潔是設(shè)計(jì)師需要深度思考的問(wèn)題？如何與上級(jí)溝通？該功能是否可做可不做？是否需要埋點(diǎn)用數(shù)據(jù)說(shuō)話？如果只是一味競(jìng)品有我們就需要有，功能不斷累加只會(huì)讓界面越來(lái)越重。
幾何圖形和幾何插畫有異曲同工之妙，幾何圖形多為產(chǎn)品界面和宣傳內(nèi)容的抽象，產(chǎn)品界面的幾何圖形多為占位符形式，加上色彩和幾何色塊讓其成為一個(gè)整體。B端產(chǎn)品視覺設(shè)計(jì)C端化的進(jìn)程中，幾何圖形、幾何色彩不失為最好的突破口，相信今年追波B端產(chǎn)品的視覺設(shè)計(jì)一定會(huì)更上一個(gè)臺(tái)階。
幾何圖形另一個(gè)場(chǎng)景化的地方就是品牌，作為一名UI設(shè)計(jì)師一定會(huì)經(jīng)歷從圖標(biāo)到幾何圖形到品牌設(shè)計(jì)的過(guò)程，品牌設(shè)計(jì)的技巧基本還是以幾何圖形為主，至于品牌的內(nèi)涵需要更深層次的解讀。掌握主流品牌設(shè)計(jì)的技巧對(duì)產(chǎn)品定位、品牌宣傳打下扎實(shí)的基礎(chǔ)。
暗黑模式的設(shè)計(jì)是解決在微弱環(huán)境下內(nèi)容也可以有更高的可讀性。隨著用戶夜晚及深夜使用電子設(shè)備時(shí)長(zhǎng)增大，如何在夜晚這個(gè)特定場(chǎng)景下使用更加舒適。合理使用暗黑模式可以減輕眼睛疲勞，提高在夜間使用的可讀性。
在設(shè)計(jì)暗黑主題時(shí)，不能為了突顯視覺上的逼格，而去使用高飽和度鮮艷的色彩來(lái)突顯界面的品質(zhì)感。而應(yīng)該把舒適度、可讀性作為設(shè)計(jì)的衡量指標(biāo)。Material Design給出了暗黑主題的設(shè)計(jì)準(zhǔn)則，即正文和背景之間的對(duì)比度應(yīng)至少為15.8:1。按照此標(biāo)準(zhǔn)設(shè)計(jì)，可讀性都還不錯(cuò)。這里介紹一個(gè)插件“Stark”（Figma、Sketch、XD、Chrome插件）用來(lái)測(cè)試界面的對(duì)比度。
為什么叫模塊化，而不叫組件化，組件化更多的利用原子系統(tǒng)從原子、分子、組織、模版、頁(yè)面來(lái)快速的搭建界面，但在B端產(chǎn)品設(shè)計(jì)中基礎(chǔ)組件和業(yè)務(wù)組件的搭建是以提高工作效率為前提，是否有從0到1搭建B端產(chǎn)品組件的經(jīng)歷是設(shè)計(jì)師一生中最寶貴的經(jīng)驗(yàn)之一，它能提高設(shè)計(jì)師的系統(tǒng)化思維、邏輯思維和抽象思維能力。
產(chǎn)品模塊化設(shè)計(jì)就是將產(chǎn)品分成幾個(gè)部分，也就是幾個(gè)模塊，每一部分都是具有獨(dú)立功能，具有一致的連接接口和一致的輸入、輸出接口的單元，相同種類的模塊在產(chǎn)品族中可以重用和互換，相關(guān)模塊的排列組合就可以形成最終的產(chǎn)品。通過(guò)模塊的組合配置，就可以創(chuàng)建不同需求的產(chǎn)品，滿足客戶的定制需求 。
插畫作為設(shè)計(jì)的一大品類，不同的插畫師都有自己擅長(zhǎng)的風(fēng)格，本質(zhì)是都有自己的個(gè)性，但是在產(chǎn)品設(shè)計(jì)中更多是需要共情、共性來(lái)講故事，表達(dá)產(chǎn)品理念和價(jià)值觀。這就需要插畫師去嘗試并探尋出適合互聯(lián)網(wǎng)產(chǎn)品設(shè)計(jì)類的插畫風(fēng)格。設(shè)計(jì)的本質(zhì)是舊元素的重新組合，插畫不會(huì)過(guò)時(shí)，而是需要結(jié)合當(dāng)下和產(chǎn)品找到最匹配的設(shè)計(jì)風(fēng)格。
幾何插畫算是插畫簡(jiǎn)化的一種表現(xiàn)形式，人和物的形態(tài)不再寫實(shí)，而是抽象成幾何圖形拼湊的感覺，同時(shí)保留人物形態(tài)的神韻。加上幾何色塊與人物交互形態(tài)的表現(xiàn)，傳達(dá)出簡(jiǎn)潔、科技的現(xiàn)代感。難點(diǎn)還是在人物形態(tài)的表現(xiàn)上，平時(shí)多練習(xí)練習(xí)速寫還是很有必要的。
線面插畫最近一兩年非常流行，準(zhǔn)確的說(shuō)是非常適合。首先線面插畫主要是由線條和塊面組合而成，用塊面表現(xiàn)人物形態(tài)時(shí)某些結(jié)構(gòu)會(huì)表現(xiàn)不出來(lái)，這時(shí)候用線條簡(jiǎn)單勾勒后，結(jié)構(gòu)就會(huì)清晰明了。其次當(dāng)線面插畫運(yùn)用在界面上時(shí)，可以打破界面純文字或組件化的機(jī)械和沉悶感。線面插畫的風(fēng)格提升畫面熱鬧感的同時(shí)，還能保持界面的干凈整潔。
界面微交互動(dòng)效會(huì)讓用戶的體驗(yàn)更加精致到位。想要打造優(yōu)秀的產(chǎn)品設(shè)計(jì)，微交互和動(dòng)效設(shè)計(jì)是繞不開的，UI界面設(shè)計(jì)通過(guò)微交互反饋告知用戶當(dāng)前正在發(fā)生的事情，所處的狀態(tài)。細(xì)微的動(dòng)效更能調(diào)動(dòng)用戶情緒，取悅用戶。C端產(chǎn)品微交互和動(dòng)效已經(jīng)很成熟了，一部分功勞來(lái)自iOS系統(tǒng)原生自帶的效果。B端產(chǎn)品的微交互和動(dòng)效更多還是在學(xué)習(xí)海外產(chǎn)品，還需要給前端工程師灌輸微交互和動(dòng)效的設(shè)計(jì)價(jià)值，共同打造產(chǎn)品體驗(yàn)細(xì)節(jié)。
Mg動(dòng)畫需要很好的節(jié)奏感、韻律，每一個(gè)場(chǎng)景動(dòng)畫都需要其中的元素進(jìn)行連接變化，讓轉(zhuǎn)場(chǎng)動(dòng)畫更加自然，MG人物動(dòng)畫通過(guò)點(diǎn)線面的動(dòng)效變化讓畫面更加有趣、自然，通過(guò)粒子效果讓特定場(chǎng)景無(wú)限循環(huán)會(huì)讓人更加印象深刻。
MacOS Big Sur系統(tǒng)圖標(biāo)的更新帶動(dòng)了三維圖標(biāo)的流行，三維圖標(biāo)的應(yīng)該場(chǎng)景還是需要有較大留白空間的界面，因?yàn)槿S圖標(biāo)太小后就看不到更多細(xì)節(jié)。三維圖標(biāo)感覺又回到了擬物化和扁平化哪個(gè)更好的問(wèn)題上？設(shè)計(jì)師應(yīng)該保持開放多元的視角。設(shè)計(jì)本身也在不斷的演化融合，存在即合理。合適最重要，它們都會(huì)有適合自己的場(chǎng)景和設(shè)計(jì)價(jià)值。
為什么輕三維在界面設(shè)計(jì)中占有一席之位？一個(gè)是設(shè)計(jì)師不斷追求差異化的產(chǎn)物。另一個(gè)是更好的表現(xiàn)內(nèi)容，并與用戶產(chǎn)生共鳴。輕三維的基礎(chǔ)模型都是來(lái)自手機(jī)界面中的各種元素，比如組件、開關(guān)、按鈕、占位符、圖表、幾何圖形、圖標(biāo)、進(jìn)度條等，這些都是用戶日常使用系統(tǒng)軟件常見的元素，通過(guò)簡(jiǎn)單的幾何形體建?！驘艄狻硬馁|(zhì)—渲染—PS調(diào)色。難度系數(shù)不大但效果很出彩。第一個(gè)出彩點(diǎn)是模型帶有厚度的倒角，結(jié)合燈光渲染的光澤是二維軟件不能比擬的。第二個(gè)出彩點(diǎn)就是材質(zhì)自由添加，特別是當(dāng)下流行的毛玻璃效果，玻璃材質(zhì)渲染效果更佳。第三個(gè)出彩點(diǎn)就是可以加局部燈光，局部的漸變色或環(huán)境光更佳出彩。
P4D是PS加C4D的設(shè)計(jì)表現(xiàn)技法，也是視覺設(shè)計(jì)的最后一個(gè)環(huán)節(jié)，通過(guò)PS對(duì)C4D的渲染圖片進(jìn)行調(diào)色，利用PS的調(diào)色技巧可以很好的解決C4D打燈光的瑕疵，還可以利用PS強(qiáng)大的合成功能，將渲染圖片與圖片素材進(jìn)行合成，來(lái)表現(xiàn)畫面的視覺度，當(dāng)然三維軟件比較難實(shí)現(xiàn)的水、粒子、煙花等效果，也可以通過(guò)PS的后期合成來(lái)實(shí)現(xiàn)，這也是P4D的強(qiáng)大之處。
卡通IP設(shè)計(jì)最近三四年技術(shù)的迭代已經(jīng)慢慢的走上成熟，卡通IP也從傳統(tǒng)的純PS手繪技法，轉(zhuǎn)到C4D建?！巧壎ā狹D衣服制作—OC渲染—PS（靜態(tài)）/AE（動(dòng)態(tài)）調(diào)色。
卡通IP火的本質(zhì)更適合做營(yíng)銷，相比于品牌或Slogan，卡通IP具有親和力和畫面感。隨著各種手辦行業(yè)大熱，受互聯(lián)網(wǎng)大廠影響下，卡通IP已經(jīng)是互聯(lián)網(wǎng)B輪以上公司的標(biāo)配了。如果團(tuán)隊(duì)中沒(méi)有這樣能力的人，也可以通過(guò)繪制好二維，一套三維可以選擇外包完成。
對(duì)于UI設(shè)計(jì)師來(lái)說(shuō)學(xué)習(xí)是有成本的，暫時(shí)并不是必備技能，如果喜歡完全可以學(xué)習(xí)，從設(shè)計(jì)差異化的角度來(lái)看三維視覺確實(shí)有一定的競(jìng)爭(zhēng)力。
C4D三維場(chǎng)景動(dòng)畫通過(guò)構(gòu)建實(shí)物和場(chǎng)景模擬生活中的現(xiàn)實(shí)場(chǎng)景，會(huì)讓用戶體驗(yàn)真實(shí)感，三維軟件制作動(dòng)效的最大優(yōu)勢(shì)是通過(guò)動(dòng)力學(xué)和表達(dá)式來(lái)模擬真實(shí)感，未來(lái)在AR/VR領(lǐng)域會(huì)有更好的發(fā)展。相對(duì)于界面動(dòng)效學(xué)習(xí)成本難度也相對(duì)較大。在三維動(dòng)畫中C4D軟件對(duì)于域、動(dòng)力學(xué)還是有一定的優(yōu)勢(shì)。
作者：水手哥。 來(lái)源：站酷網(wǎng)
藍(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)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(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.yvirxh.cn )是一家專注而深入的界面設(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ì)公司。
以下是碳水Sir在App Store發(fā)現(xiàn)的幾款“寶貝”，之所以稱為“寶貝”是因?yàn)楫a(chǎn)品中可學(xué)到的東西太多了，每個(gè)產(chǎn)品視覺UI以及動(dòng)效都有其獨(dú)特風(fēng)格（當(dāng)然網(wǎng)上也有別人總結(jié)過(guò)的產(chǎn)品，我這里就不拿出來(lái)重復(fù)說(shuō)了）我僅針對(duì)未總結(jié)的大廠產(chǎn)品，進(jìn)行設(shè)計(jì)細(xì)節(jié)拆解，看看優(yōu)秀的產(chǎn)品設(shè)計(jì)到底好在哪里，請(qǐng)君細(xì)細(xì)品味。
（淘寶 - 屋顏 - 一站式潮流家居平臺(tái)）
（字節(jié) - 抖音盒子 - 潮流時(shí)尚電商平臺(tái)）
（騰訊 - doX多克斯 - 生活碎片視頻社交）
（淘寶 - 吃貨筆記 - 記錄美食好生活）
（得物旗下 - 95分 - 奢潮二手平臺(tái)）
（騰訊 - PODO漫畫 - 獨(dú)特交互體驗(yàn)漫畫閱讀平臺(tái)）
（荔枝 - 皮玩 - 語(yǔ)音社交平臺(tái)）
（陌陌 - 咔咔 - 實(shí)拍互動(dòng)交友平臺(tái)）
排名不分先后，從以上幾款產(chǎn)品logo中不難看出，圖形設(shè)計(jì)都偏向于具像化，傳遞出正向的情緒，顏色方面使用熒光黃、青綠、漸變粉等凸顯年輕、大膽，富有朝氣。
第一眼看到這個(gè)名就有被驚艷。首先屋顏是屋檐的斜譯，檐變成顏，中華文字博大精深，讀起來(lái)也不違和，同時(shí)也直觀呈現(xiàn)出產(chǎn)品定位屬性。logo采用字體設(shè)計(jì)手法，“屋”字經(jīng)過(guò)設(shè)計(jì)手法使線條呈現(xiàn)出立體空間感，也間接體現(xiàn)出產(chǎn)品是和房屋軟裝相關(guān)，同時(shí)為屋內(nèi)添置“顏色”（軟裝）相關(guān)的產(chǎn)品。一個(gè)logo兩層含義，通過(guò)字體設(shè)計(jì)以及諧音表現(xiàn)，巧妙的融入其中。
直觀來(lái)看，頁(yè)面大量留白，圖片質(zhì)量高級(jí)且風(fēng)格統(tǒng)一，均采用素底作為產(chǎn)品首圖，很好的提升產(chǎn)品整體調(diào)性。
圖形方面均采用直角元素，配圖、banner、按鈕、icon無(wú)一例外；細(xì)線風(fēng)格設(shè)計(jì)使產(chǎn)品極具品質(zhì)感，有種無(wú)印良品的現(xiàn)代極簡(jiǎn)主義風(fēng)潮。也叫MUJI風(fēng)。
瓷片區(qū)的配圖采用線性+2.5D風(fēng)格，使畫面富有空間層次，能撐住頁(yè)面頭部重要位置，且再次突出產(chǎn)品極簡(jiǎn)主義風(fēng)格。當(dāng)然還有空狀態(tài)、無(wú)網(wǎng)絡(luò)環(huán)境下的配圖等等都很統(tǒng)一。
動(dòng)效方面最值得關(guān)注的是下拉刷新，使用吊燈作為下拉效果，當(dāng)向下滑動(dòng)時(shí)電線被拉扯長(zhǎng)，但斷不了，給人以安全可靠的產(chǎn)品透?jìng)鳎菜闶峭ㄟ^(guò)創(chuàng)意設(shè)計(jì)助力產(chǎn)品體驗(yàn)的手段之一。釋放刷新時(shí)，輪播不同的家居icon圖標(biāo)，再次強(qiáng)化定位產(chǎn)品屬性，且刷新時(shí)不至于乏味。
加載狀態(tài)采用+號(hào)線條旋轉(zhuǎn)表現(xiàn)，同時(shí)在結(jié)尾變成一個(gè)方形，這么極簡(jiǎn)的設(shè)計(jì)之前其他產(chǎn)品從未出現(xiàn)過(guò)，同時(shí)它也符合屋顏的產(chǎn)品調(diào)性（新家軟裝要做加法，僅個(gè)人理解）也算是一個(gè)設(shè)計(jì)亮點(diǎn)。
最新穎的是產(chǎn)品特有的【3D實(shí)景逛店】功能，進(jìn)一步強(qiáng)化家具與室內(nèi)的強(qiáng)相關(guān)性，為什么這么說(shuō)，單從買家具上，線上買前只能靠照片來(lái)間接聯(lián)想買后填入家中的情況，并不能按照自己習(xí)慣多角度查看家具。又或者因?yàn)槊?，沒(méi)時(shí)間去線下家具館，或者怕白去一趟，通過(guò)【3D實(shí)景逛店】快速解決這部分用戶需求。同時(shí)，也給線下家具館增加了更多曝光度的可能性。
至此，屋顏的設(shè)計(jì)細(xì)節(jié)講解就結(jié)束了，希望產(chǎn)品體驗(yàn)越做越好。
抖音旗下的電商平臺(tái)，整體風(fēng)格清爽直觀，綠色與紫色搭配也是一種時(shí)尚風(fēng)。相比其他電商產(chǎn)品，抖音盒子沒(méi)有金剛區(qū)圖標(biāo)設(shè)計(jì)以及營(yíng)銷類的占位圖，相反金剛區(qū)僅展示奢侈品實(shí)物圖，產(chǎn)品圖大小做了統(tǒng)一，視覺呈現(xiàn)很高級(jí)，同時(shí)下列瀑布流商品中首圖沒(méi)有活動(dòng)促銷等信息干擾，只展示商品圖，突出其時(shí)尚潮牌好物的特性，同時(shí)也與當(dāng)前清爽、高級(jí)的設(shè)計(jì)風(fēng)格相一致。
幾處設(shè)計(jì)細(xì)節(jié)值得參考，首先是底部Tab欄點(diǎn)擊動(dòng)效，承載抖音logo的故障風(fēng)效果，黑色+紫色故障效果一來(lái)告知與抖音具有相關(guān)聯(lián)性，是旗下電商產(chǎn)品；二來(lái)黑色Tab圖標(biāo)能很好的壓住“紫綠主色調(diào)”的跳躍感，不至于太過(guò)俏皮脫離電商屬性。
并且圖標(biāo)的整體性與統(tǒng)一性都做得很好，“小紅點(diǎn)”的設(shè)計(jì)采用品牌色“小紫點(diǎn)”呈現(xiàn)（小小的顏色改變），更加強(qiáng)化了產(chǎn)品風(fēng)格與調(diào)性的統(tǒng)一，（小紅點(diǎn)并不是只能用紅色）這點(diǎn)值得學(xué)習(xí)。
最后想告訴大家，產(chǎn)品在每個(gè)階段設(shè)計(jì)形式都會(huì)發(fā)生改變，比如1.0.1-1.0.2可能是輕微調(diào)整，1.0.0-2.0.0就是大的視覺升級(jí)?？赡芤?yàn)楫a(chǎn)品發(fā)展或用戶變化，使得產(chǎn)品設(shè)計(jì)風(fēng)格發(fā)生改變， 但要知道每個(gè)上線版本一定是當(dāng)前方案的最優(yōu)解。就如你看到的“抖音盒子”現(xiàn)在是1.9.0版本號(hào)，或許在不久的將來(lái)就會(huì)全新升級(jí)。這就不得而知了。
是一款短視頻社交平臺(tái)，與其他社交產(chǎn)品不同，doX主打短視頻內(nèi)容社交，用戶通過(guò)拍攝上傳有趣的短視頻內(nèi)容，來(lái)認(rèn)識(shí)志同道合的朋友。雖然與抖音同為短視頻平臺(tái)，但抖音更側(cè)重視頻分發(fā)，而doX側(cè)重于通過(guò)視頻與用戶建立聯(lián)系，一個(gè)視頻下可以跟拍多條，有點(diǎn)像qq以前的漂流瓶，只是換種呈現(xiàn)方式。這種陌生人視頻交友有一絲“探探”的味道。
設(shè)計(jì)上面單看logo以為會(huì)沿用手繪線稿類似的風(fēng)格。整體使用下來(lái)，僅在我的頁(yè)面頂部背景中用到，其余均采用斷線像素風(fēng)icon設(shè)計(jì)，綠+白的設(shè)計(jì)風(fēng)格，可能也是為了營(yíng)造出一種陌生人交友的科幻感覺吧。
發(fā)起拍攝頁(yè)，背景會(huì)有噪點(diǎn)動(dòng)效，也是營(yíng)造一種拍攝前無(wú)鏡頭的感覺，引導(dǎo)用戶隨手記錄。
最后產(chǎn)品的切入方向很新穎，但是否能在短視頻風(fēng)口分出一杯羹就不知道了，但目前來(lái)說(shuō)整體設(shè)計(jì)風(fēng)格框架已搭建起來(lái)，剩下的就是不斷填補(bǔ)及完善設(shè)計(jì)，使其更加統(tǒng)一，希望doX越來(lái)越好。
第一次接觸“吃貨筆記”就被頁(yè)面整體設(shè)計(jì)風(fēng)格吸引。粗線圖標(biāo)+擬物圖標(biāo)形式空前新潮，給人眼前一亮的感覺。它類似于“大眾點(diǎn)評(píng)”，是個(gè)寶藏探店美食分享的平臺(tái)。通過(guò)線上探店選擇報(bào)名-自行到店-發(fā)表動(dòng)態(tài)-上傳票據(jù)-提取飯票，來(lái)獲得優(yōu)惠消費(fèi)的同時(shí)提高平臺(tái)UGC內(nèi)容的產(chǎn)出?？上У氖悄壳皟H支持【廣州】店鋪（可能是先做小范圍本土化嘗試然后再逐漸擴(kuò)大地域），外地用戶只能看看界面并不能真實(shí)使用，這點(diǎn)很遺憾。
動(dòng)態(tài)布局也很有創(chuàng)意，第一張大圖，其他小圖呈現(xiàn)，五宮格的樣式使布局統(tǒng)一，且更好突出第一張圖的主視覺層級(jí)。
如今本地餐飲服務(wù)平臺(tái)已經(jīng)做得很好了，“吃貨筆記”在嘗試從優(yōu)化福利流程、視覺表現(xiàn)、設(shè)計(jì)手法等多維度探索新的操作形式，這種身先士卒的精神值得尊敬，單說(shuō)設(shè)計(jì)表現(xiàn)的細(xì)致，就以超過(guò)了大部分產(chǎn)品。當(dāng)然，每一款好的產(chǎn)品離不開設(shè)計(jì)，更離不開產(chǎn)品功能是否真實(shí)滿足用戶需求，讓用戶使用輕松、解決需求后是否帶來(lái)爽點(diǎn)。
圖標(biāo)用色很鮮明，均采用3D質(zhì)感表現(xiàn)形式，能看出設(shè)計(jì)上面下了很多功夫。底部Tab欄選中圖標(biāo)也采用3D質(zhì)感表現(xiàn)，與金剛區(qū)和空狀態(tài)圖標(biāo)形成呼應(yīng)，增強(qiáng)產(chǎn)品風(fēng)格記憶點(diǎn)。產(chǎn)品目前的評(píng)論和下載量都不像沒(méi)推過(guò)一樣，可能產(chǎn)品分享度不高導(dǎo)致很多一部分人不知道，所以增加徽章模塊評(píng)價(jià)打卡獲得獎(jiǎng)勵(lì)，并以此成就來(lái)滿足用戶心里預(yù)期，從而增加使用黏性和傳播分享。
最后這款產(chǎn)品設(shè)計(jì)表現(xiàn)都特別出眾，通過(guò)空狀態(tài)文案等內(nèi)容也能看出產(chǎn)品的個(gè)性特征。例如：“蝦米都沒(méi)有，快看看其他的”，還有很多小的設(shè)計(jì)細(xì)節(jié)，這里就不一一說(shuō)了，大伙兒自行下載體驗(yàn)一下吧。
95分是得物旗下的分離出來(lái)的全新App，主打潮流閑置交易平臺(tái)，而得物定位是新一代潮流網(wǎng)購(gòu)電商，兩者還是有所區(qū)別。但從UI設(shè)計(jì)角度，還是能看到得物的影子，潮流前線，并且整體風(fēng)格時(shí)尚統(tǒng)一，很多細(xì)節(jié)值得在這里展開說(shuō)說(shuō)。
整個(gè)設(shè)計(jì)清爽直觀、沒(méi)有多余裝飾元素，這就要求圖標(biāo)必須做到極致，才能撐住整個(gè)頁(yè)面。我羅列了一下可能出現(xiàn)的圖標(biāo)，輕質(zhì)感毛玻璃效果，結(jié)合統(tǒng)一的漸變?cè)厥沟妹總€(gè)圖標(biāo)都精致耐看，值得研究。線性圖標(biāo)也是一樣，整體配套，這套圖標(biāo)應(yīng)該下了不少功夫。
在二手平臺(tái)存量競(jìng)爭(zhēng)的時(shí)代，能有一款產(chǎn)品嘗試新的設(shè)計(jì)風(fēng)格，并且把近幾年火起來(lái)的毛玻璃風(fēng)格相融合，這種走在設(shè)計(jì)前線的作風(fēng)與95分產(chǎn)品潮流前線的調(diào)性一致，單說(shuō)設(shè)計(jì)嘗試這種做法就已經(jīng)超越了大多數(shù)產(chǎn)品了。
毫不夸張，這款產(chǎn)品打開了我對(duì)交互表現(xiàn)與實(shí)現(xiàn)的新認(rèn)知。我看了一下最早發(fā)布是去年9月27日，到目前為止短短8個(gè)月時(shí)間，就能讓PODO這款產(chǎn)品的交互設(shè)計(jì)做到如此優(yōu)秀，背后依靠騰訊，也有游戲元素的影子，這就不足為奇了。
使用下來(lái)基本沒(méi)有太多圖標(biāo)元素，更多是把屏幕空間分給了動(dòng)漫封面，一行三個(gè)動(dòng)漫排列，背景與主體人物分開，滑動(dòng)時(shí)二者在空間層進(jìn)行錯(cuò)位，營(yíng)造一種錯(cuò)層的空間感，使原本扁平的圖像瞬間立體了許多很是新奇。
點(diǎn)開動(dòng)漫詳情，圖文信息依次從上到下展開，引導(dǎo)用戶視覺享受，并且頭圖中的動(dòng)漫人物也做了動(dòng)效設(shè)計(jì)，全覽下來(lái)很是細(xì)致。除此之外，還有三個(gè)明顯的交互細(xì)節(jié)，分別是：設(shè)置頁(yè)展開交互、閱讀頁(yè)底部導(dǎo)航交互以及目錄頁(yè)的交互樣式，都以新的表現(xiàn)形式呈現(xiàn)出來(lái)，作為設(shè)計(jì)師的我們現(xiàn)在不能再說(shuō)：“設(shè)計(jì)已經(jīng)玩不出新的花樣”這樣的說(shuō)法了。
太多的交互動(dòng)效就不一一列舉了，趕緊收入囊中吧！
通過(guò)了解得知“皮玩”是荔枝App旗下控股產(chǎn)品，同樣也在入局陌生人社交領(lǐng)域。但值得注意的是該產(chǎn)品上線1個(gè)月，內(nèi)部框架及UI界面已相對(duì)完整，卡片、插圖、動(dòng)效、圖標(biāo)、以及一些趣味設(shè)計(jì)都已上線，應(yīng)該是一個(gè)成熟團(tuán)隊(duì)孵化的項(xiàng)目，上線前的測(cè)試應(yīng)該沒(méi)少下功夫，才能在產(chǎn)品初期做的如此完善。logo采用漸變黃底+吐舌頭表情相結(jié)合，搞怪趣味要用嘴說(shuō)話這樣的印象。定位：更好玩的語(yǔ)音社交算說(shuō)得過(guò)去 。
初次體驗(yàn)，第一感受就是采用貼紙風(fēng)的設(shè)計(jì)元素，icon與元素都具有較強(qiáng)的設(shè)計(jì)感，飽和度較低的配色加上白色描邊，就如產(chǎn)品說(shuō)的“玩一下、皮一下”相呼應(yīng)，產(chǎn)品的整體顏色采用漸變黃和漸變綠，配色很大膽，同時(shí)體現(xiàn)出該產(chǎn)品用戶所代表的具有興趣多元化、喜歡嘗鮮這樣一個(gè)群體。同時(shí)產(chǎn)品也是想通過(guò)這種設(shè)計(jì)吸引用戶使用。
產(chǎn)品中處處都能看到微動(dòng)效，使靜態(tài)的畫面變得活潑許多，這種做法也是為了給用戶營(yíng)造一種活躍的氛圍，增加平臺(tái)活躍度。
咔咔是陌陌孵化的一款社交產(chǎn)品，最近發(fā)現(xiàn)一些大廠旗下產(chǎn)品都在獨(dú)立運(yùn)營(yíng)，目的也是為了和主產(chǎn)品脫離關(guān)系，防止激烈競(jìng)爭(zhēng)導(dǎo)致產(chǎn)品停止運(yùn)營(yíng)。年前很火的“啫喱”想必就是吃虧在這方面?；貧w正題，首頁(yè)是以視頻為主圖片為輔的瀑布流形式呈現(xiàn)，停到某一位置則直接循環(huán)播放該視頻，排版方式極具新穎，當(dāng)體驗(yàn)下來(lái)眼球左右移動(dòng)總是會(huì)打斷我信息的獲取，有點(diǎn)強(qiáng)制引導(dǎo)用戶看大圖視頻內(nèi)容的感受。點(diǎn)開則可以與對(duì)方進(jìn)行互動(dòng)點(diǎn)贊評(píng)論。
看看模塊，采用類似“探探”卡片交互左滑不喜歡右滑喜歡來(lái)讓用戶進(jìn)行操作，但與“探探”不同的是此互動(dòng)是開放的，用戶選擇滿意的動(dòng)態(tài)內(nèi)容添加到卡片后，陌生人可看到展示內(nèi)容，并且她被多少人喜歡都會(huì)展示出來(lái)，相當(dāng)于是個(gè)人名片，有種抖音+探探的味道。并不具有一對(duì)一的個(gè)人隱私性，這是與探探最直接的區(qū)別。
看看模塊中，“打招呼”是與對(duì)方建立私聊的唯一方式，如果該用戶已關(guān)注但未打招呼，把卡片劃走，那再也不能與對(duì)方建立私聊，除非對(duì)方通過(guò)“看看”模塊與你打招呼。這個(gè)產(chǎn)品細(xì)節(jié)很容易因?yàn)橛脩舨焕斫饣蛘呤只蜔o(wú)法與上個(gè)用戶進(jìn)行“打招呼”私信，且私信功能僅在觸發(fā)“打招呼”后才能交流，入口少、且不易理解，不知道是產(chǎn)品經(jīng)理的有意為之還是被遺漏掉的地方。
消息頁(yè)的添加入口，用折疊手法展示，降低頻繁跳頁(yè)的割裂感，同時(shí)縮起時(shí)也不會(huì)占用消息列表。
消息列表是通過(guò)“打招呼”保存下的私密消息，聊天形式極具特色，黑色背景加上紅紫漸變列表有種夜店嗨皮的即視感觀，這里就不過(guò)多評(píng)價(jià)，大家領(lǐng)悟吧。
設(shè)計(jì)中還值得關(guān)注一點(diǎn)，就是個(gè)人主頁(yè)中的個(gè)性標(biāo)簽，我羅列出22個(gè)，當(dāng)用戶發(fā)表三個(gè)同類動(dòng)態(tài)即可點(diǎn)亮一個(gè)標(biāo)簽，此標(biāo)簽也會(huì)代替文字描述承載動(dòng)態(tài)內(nèi)容的作用，用戶選擇已點(diǎn)亮 的icon即展示對(duì)應(yīng)標(biāo)簽內(nèi)容了，相當(dāng)于動(dòng)態(tài)中的標(biāo)簽分類，但前提發(fā)表動(dòng)態(tài)時(shí)選擇對(duì)應(yīng)你標(biāo)簽，不然發(fā)表后的動(dòng)態(tài)不能二次修改。這種通過(guò)標(biāo)簽點(diǎn)亮的功能也是為了讓用戶UGC內(nèi)容更加多元化，同時(shí)也想通過(guò)標(biāo)簽來(lái)吸引用戶多多發(fā)動(dòng)態(tài)的。創(chuàng)意點(diǎn)是好的，但是否能達(dá)到好的效果，還是要拭目以待。
相比其他產(chǎn)品，咔咔是我一直關(guān)注的產(chǎn)品，同時(shí)也是特別喜歡的產(chǎn)品之一，所以我分享給你們。
設(shè)計(jì)師要有發(fā)現(xiàn)美的眼睛。美不僅是視覺，還有好的體驗(yàn)流程。不要讓用戶思考，這是每個(gè)設(shè)計(jì)師所追求的。
認(rèn)真記錄產(chǎn)品細(xì)節(jié)，了解背后的思考，也是不斷提升自己邏輯思維和表達(dá)能力的一種方式。
本期產(chǎn)品細(xì)節(jié)分析結(jié)束，點(diǎn)擊原文鏈接查看更多，我們下期再見！
作者：碳水Sir；公眾號(hào)：草蓉三石
作者：碳水sir
鏈接：https://www.zcool.com.cn/article/ZMTQwMzM4OA==.html
來(lái)源：站酷
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
在講開源設(shè)計(jì)前，我們或許可以先講講開源一詞是指什么。
開源全稱開放源代碼，開源軟件最大的特點(diǎn)是開放，也就是任何人都可以得到軟件的源代碼，加以修改學(xué)習(xí)，甚至重新發(fā)放，當(dāng)然是在版權(quán)限制范圍之內(nèi)。雖然開源一詞最初是為軟件開發(fā)而創(chuàng)造的，但現(xiàn)如今開源所涉及的領(lǐng)域也極其廣闊，并不只是包括軟件領(lǐng)域，如醫(yī)藥領(lǐng)域的藥物開發(fā)開源、文化領(lǐng)域的書籍到期開源等等所以開源設(shè)計(jì)已包含了更廣泛的含義，它包括了由任何人或者團(tuán)隊(duì)自由共享、協(xié)作的設(shè)計(jì)方案、項(xiàng)目、產(chǎn)品。
我們來(lái)看幾個(gè)大型開源的設(shè)計(jì)了解一下~
Ant Design
阿里的開源系統(tǒng)后臺(tái)組件庫(kù)
https://ant.design
百度推出的開源圖表
https://echarts.apache.org/
全球知名圖片開源平臺(tái)
https://unsplash.com
免費(fèi)（大部分是）：開源設(shè)計(jì)的一個(gè)關(guān)鍵要素是它們通常（但不總是?。┟赓M(fèi)。這是一個(gè)重要因素，因?yàn)殚]源設(shè)計(jì)通常需要花費(fèi)不菲的價(jià)格或者冒著侵犯版權(quán)的風(fēng)險(xiǎn)去使用。
思想碰撞：更多的設(shè)計(jì)師或者創(chuàng)意愛好者共同為一個(gè)創(chuàng)意提出自己的見解和再設(shè)計(jì)。
設(shè)計(jì)開源領(lǐng)域廣闊：設(shè)計(jì)開源領(lǐng)域也幾乎涵蓋了所有的設(shè)計(jì)和創(chuàng)意領(lǐng)域如平面設(shè)計(jì)、三維設(shè)計(jì)、用戶體驗(yàn)設(shè)計(jì)、環(huán)境設(shè)計(jì)、建筑設(shè)計(jì)、服裝設(shè)計(jì)、插畫、動(dòng)畫設(shè)計(jì)等等
但是許多人可能會(huì)有一個(gè)疑問(wèn)，開源設(shè)計(jì)和以往的素材網(wǎng)站或者源文件售賣網(wǎng)站有什么區(qū)別呢？
在我看來(lái)，開源網(wǎng)站與傳統(tǒng)售賣設(shè)計(jì)資源的網(wǎng)站最大的區(qū)別是開放與共建，以figma的社區(qū)為例，作者發(fā)布作品后，任何人都可以對(duì)其作品進(jìn)行redesign甚至remix，這極大的提高了設(shè)計(jì)師的興趣，每個(gè)人都希望自己的作品能被他人看到，也希望自己的創(chuàng)意能與他人的創(chuàng)意進(jìn)行更好的結(jié)合，這是一個(gè)多么美好的場(chǎng)景。而傳統(tǒng)網(wǎng)站只是冷冰冰的展示文件售賣資源，缺少了設(shè)計(jì)中的靈魂。
那說(shuō)了這么多，開源設(shè)計(jì)到底有哪些優(yōu)勢(shì)呢？
提升設(shè)計(jì)效率：設(shè)計(jì)師不應(yīng)花費(fèi)時(shí)間去解決別人已經(jīng)解決的問(wèn)題，比如當(dāng)我設(shè)計(jì)一個(gè)新項(xiàng)目時(shí)，無(wú)需從零開始設(shè)計(jì)系統(tǒng)組件，可以直接使用Ant Design、Ant Mobile Design等現(xiàn)有組件庫(kù)。
增加學(xué)習(xí)機(jī)會(huì)：通過(guò)開源社區(qū)，設(shè)計(jì)人員可以從其他人所做的項(xiàng)目中學(xué)習(xí)，并與專業(yè)人員交流經(jīng)驗(yàn)。
提高設(shè)計(jì)質(zhì)量：設(shè)計(jì)師自己看本人作品時(shí)，往往是身在其中不知如何下手，而將作品發(fā)布到更廣泛的社區(qū)有助于設(shè)計(jì)師獲得有價(jià)值的反饋以改進(jìn)他們的作品。
提升品牌價(jià)值：對(duì)設(shè)計(jì)開源后，公司品牌能在某些領(lǐng)域內(nèi)獲得傳播，提升品牌價(jià)值。并且在招募人才時(shí)也能成為有吸引力的一項(xiàng)條件。
提升個(gè)人價(jià)值：一個(gè)設(shè)計(jì)師想要提升個(gè)人價(jià)值和影響力，可以用開源作品來(lái)在行業(yè)內(nèi)獲得一定口碑，甚至直接將用戶流量轉(zhuǎn)化為訂單，或許是更簡(jiǎn)單且容易的事情。
從這些優(yōu)勢(shì)中不難發(fā)現(xiàn)，在開源生態(tài)中，我們的作品不再是一座孤島，通過(guò)互聯(lián)網(wǎng)，我們的作品可以和任何人進(jìn)行鏈接并且產(chǎn)生共鳴，提升品牌和個(gè)人的價(jià)值，所以每個(gè)人都值得感受開源的美好。
但開源的同時(shí)不可避免的會(huì)帶來(lái)許多新的問(wèn)題和挑戰(zhàn)，讓我們一起來(lái)看一下。
知識(shí)產(chǎn)權(quán)問(wèn)題：在開源社區(qū)中，設(shè)計(jì)師可能不清楚其創(chuàng)作的知識(shí)產(chǎn)權(quán)。因此，他們可能會(huì)不自知地侵犯其他設(shè)計(jì)師的知識(shí)產(chǎn)權(quán)。
設(shè)計(jì)門檻問(wèn)題：設(shè)計(jì)開源意味著設(shè)計(jì)師的門檻變低，任何人都可以隨意使用開源的設(shè)計(jì)項(xiàng)目，導(dǎo)致設(shè)計(jì)師不再愿意花心血?jiǎng)?chuàng)作。
設(shè)計(jì)師競(jìng)爭(zhēng)力下降：開源設(shè)計(jì)意味著普通的設(shè)計(jì)內(nèi)容已不需要單獨(dú)的設(shè)計(jì)師來(lái)完成，頂尖設(shè)計(jì)師的機(jī)會(huì)會(huì)更多，而普通設(shè)計(jì)師的競(jìng)爭(zhēng)力會(huì)明顯下降。
隨著這些挑戰(zhàn)的來(lái)臨，如何更好的面對(duì)設(shè)計(jì)領(lǐng)域的開源是值得深思的問(wèn)題，既要保護(hù)設(shè)計(jì)師的自身利益，也要讓設(shè)計(jì)行業(yè)在開放、共享的環(huán)境下?lián)肀ё兏铮栽谖磥?lái)的道路上，我們每個(gè)人都可以嘗試用自身的方法去探索未來(lái)，讓每個(gè)人都能成為時(shí)代浪潮中的一朵浪花。
微信鍵盤發(fā)布啦！擁有12億用戶的移動(dòng)端巨無(wú)霸微信發(fā)布微信鍵盤了！就在本周一，預(yù)熱近兩年的微信鍵盤終于發(fā)布，這款微信之父張小龍口中的——不搜集任何隱私的輸入法工具，總算揭開了他的神秘面紗。廖爾摩斯第一時(shí)間全面體驗(yàn)了微信鍵盤，通過(guò)三天的使用，我也成了微信鍵盤的腦殘粉，這篇接近3600字的拆解，將會(huì)告訴你，這個(gè)地主家的小兒子，為什么又帥有才！
作為一款工具類產(chǎn)品，需要更注重產(chǎn)品的用戶使用體驗(yàn)，所以此次產(chǎn)品拆解主要基于尼爾森十大可用性原則和常見的設(shè)計(jì)基礎(chǔ)理論，比如格式塔原則、費(fèi)茨定律等。我將會(huì)分為基礎(chǔ)功能、個(gè)性化功能和個(gè)人隱私三個(gè)部分進(jìn)行拆解。
1. 基礎(chǔ)功能
1.1 鍵盤管理
鍵盤是輸入法最基礎(chǔ)的功能，根據(jù)每個(gè)用戶不同的操作習(xí)慣，微信鍵盤為用戶提供六種類型的鍵盤，分別是九宮格、全鍵盤、筆畫鍵盤、手寫鍵盤、五筆鍵盤和雙拼鍵盤。在五筆鍵盤和雙拼鍵盤中，還為用戶提供了多種偏好設(shè)置，比如86五筆方案、98五筆方案等。
設(shè)計(jì)思考
相比行業(yè)頭部老大哥搜狗輸入法，微信鍵盤的類型相對(duì)還比較單薄，比如像搜狗輸入法還支持生僻字鍵盤、拍照轉(zhuǎn)文字等特色功能，不過(guò)作為一個(gè)V1.0.0版本，這也遵循了如今產(chǎn)品設(shè)計(jì)的主流設(shè)計(jì)模式，小步快跑，快速迭代。
1.2 鍵盤輸入框
「輸入框」是用戶實(shí)際操作和使用的功能，這是最基礎(chǔ)、最重要的功能。微信鍵盤的輸入框界面風(fēng)格非常簡(jiǎn)潔，和IOS默認(rèn)鍵盤風(fēng)格相近，目前僅有一款默認(rèn)皮膚。
1.2.1 長(zhǎng)按技巧
長(zhǎng)按「拼音鍵」，可選擇更多相關(guān)字符，比如數(shù)字、大小寫等。其中長(zhǎng)按「JKL」拼音鍵，可切換至「單手模式」；長(zhǎng)按「中英文」鍵，可切換至「手寫模式」，非常方便。
1.2.2 智能刪除復(fù)原
這個(gè)小技巧使用起來(lái)特別方便，在我們刪除一段文字的時(shí)候，經(jīng)常會(huì)出現(xiàn)誤刪的情況，微信鍵盤設(shè)計(jì)了一個(gè)非常巧妙的功能，按住「刪除鍵」左拉可以刪除文字，往右則可以把刪除的文字復(fù)原，提高了產(chǎn)品體驗(yàn)的容錯(cuò)性。
1.2.3 上滑輸入數(shù)字符號(hào)
這個(gè)功能需要在系統(tǒng)設(shè)置開啟，在鍵盤輸入的時(shí)候，只需要上滑「拼音鍵」，就能直接把拼音鍵對(duì)應(yīng)的數(shù)字拖到輸入框，節(jié)省切換數(shù)字鍵盤的操作步驟。
1.2.4 特殊符號(hào)
「特殊符號(hào)」不僅包含了常見的10種類型，橫排26鍵的設(shè)計(jì)更能讓用戶直觀地找到自己需要的字符，使用起來(lái)體驗(yàn)非常友好。相比搜狗輸入法超過(guò)20種的符號(hào)類型，微信鍵盤簡(jiǎn)潔的設(shè)計(jì)為用戶提供了更高效的選擇，帶來(lái)了更友好的體驗(yàn)。
設(shè)計(jì)思考
少即是多。相比搜狗輸入法的大而全，在特殊符號(hào)這個(gè)細(xì)節(jié)的設(shè)計(jì)，微信鍵盤讓我愛不釋手。首先應(yīng)用了7±2效應(yīng)，在用戶的短期記憶里，降低記憶負(fù)荷。其次也應(yīng)用了席克定律，減少用戶的選擇，降低消耗的時(shí)間成本，從而提升用戶體驗(yàn)。
1.3 偏好設(shè)置
1.3.1 語(yǔ)音轉(zhuǎn)文字
從識(shí)別語(yǔ)言觀看，微信鍵盤支持普通話、粵語(yǔ)、英語(yǔ)、四川話和上海話，筆者親自體驗(yàn)一番，發(fā)現(xiàn)識(shí)別準(zhǔn)確率還挺高的（貴陽(yáng)話，和四川話接近，超過(guò)80%準(zhǔn)確率）。
1.3.2 聲音和觸感
「聲音和觸感」指的是用戶使用鍵盤按鍵的聲音和觸感。這里有一個(gè)非常貼心的設(shè)計(jì)，當(dāng)用戶手機(jī)靜音的時(shí)候，打開聲音開關(guān)按鈕會(huì)提醒用戶當(dāng)前處于靜音模式，無(wú)法聽到按鍵聲音。這就是尼爾森十大原則的防錯(cuò)原則，在用戶出現(xiàn)操作錯(cuò)誤之前，通過(guò)設(shè)計(jì)提示提前避免，你可以想象如果沒(méi)有這樣的提示語(yǔ)，如果你的手機(jī)不小心靜音了，你就會(huì)懊惱為啥鍵盤沒(méi)有聲音，這個(gè)軟件是不是出問(wèn)題了（筆者親身經(jīng)歷）。
1.3.3 顯示設(shè)置
微信鍵盤支持用戶可設(shè)置鍵盤候選字的大小，這里也有一個(gè)非常貼心的設(shè)計(jì)，當(dāng)用戶調(diào)整字體大小以后，如果想要恢復(fù)默認(rèn)大小，只需要把滑動(dòng)組件拖動(dòng)到已經(jīng)標(biāo)記的默認(rèn)起點(diǎn)就可以了，這應(yīng)用了尼爾森十大原則的易取原則，用戶無(wú)需記住默認(rèn)大小設(shè)置，如果想恢復(fù)，拖動(dòng)標(biāo)記的起點(diǎn)即可。
1.3.4 模糊拼音及其他
「模糊拼音」主要針對(duì)拼音基礎(chǔ)欠缺的用戶，提供模糊的拼音設(shè)置，從而提高輸入效率。其次微信鍵盤還提供「首字母自動(dòng)大小寫」、「雙擊空格輸入句號(hào)」和「智能添加空格」等偏好設(shè)置，用戶可根據(jù)自己的操作習(xí)慣進(jìn)行設(shè)置，獲取更便捷的體驗(yàn)。
2. 個(gè)性化功能
個(gè)性化功能主要指微信鍵盤最特色的「拼寫Plus」功能，這也是微信鍵盤發(fā)布以后給用戶最大的驚喜。
2.1 智能推薦
「智能推薦」是微信結(jié)合自己強(qiáng)大的生態(tài)設(shè)計(jì)的一個(gè)功能，在用戶輸入文字的時(shí)候，系統(tǒng)會(huì)自動(dòng)判斷文字的類型，比如輸入一本書的名字，系統(tǒng)就會(huì)提示是否需要向好友發(fā)送這本書籍。從內(nèi)容類型看，包含了音樂(lè)、視頻、讀書、小程序、視頻號(hào)和公眾號(hào)。這個(gè)功能在用戶的聊天場(chǎng)景中，實(shí)在太方便了，比如作者過(guò)去要給好友分享自己的公眾號(hào)，還需要去公眾號(hào)搜索、轉(zhuǎn)發(fā)，如今只需要輸入「設(shè)計(jì)大偵探」的名字，就可以向好友直接發(fā)送，減少了數(shù)步操作路徑，極大提升了溝通效率。
2.2 表情推薦
表情是微信聊天場(chǎng)景中必不可少的一個(gè)元素，甚至有很多用戶特別喜歡收藏表情，它可以用于各種聊天場(chǎng)景，活躍聊天的氛圍。微信鍵盤的表情推薦，通過(guò)用戶輸入的詞語(yǔ)，可以自動(dòng)識(shí)別可能需要發(fā)送的表情，無(wú)需用戶收藏，就可以為用戶自動(dòng)生成。這個(gè)功能非常贊，特別像筆者這樣從不收藏表情的用戶，當(dāng)突然需要輸入一個(gè)表情活躍一下氣氛的時(shí)候，我只需要輸入一個(gè)「大家好」，微信鍵盤就能為我提供數(shù)十種表情，滿足我的需求。
2.3 智能拼寫
「智能拼寫」是指當(dāng)用戶輸入某個(gè)詞語(yǔ)時(shí)候，系統(tǒng)為用戶精準(zhǔn)匹配候選詞，提高輸入效率。筆者嘗試了輸入「梅西」，幾乎可以根據(jù)智能匹配輸入一段完整的文字。而微信生態(tài)更為恐怖的是，它會(huì)自動(dòng)結(jié)合當(dāng)前的話題標(biāo)簽，用戶可直接跳轉(zhuǎn)至話題的視頻號(hào)動(dòng)態(tài)，一鍵查看更多信息，讓用戶徹徹底底對(duì)微信生態(tài)的服務(wù)上癮。
2.4 拼寫檢查
「拼寫檢查」是指系統(tǒng)會(huì)根據(jù)用戶在輸入文字的時(shí)候及時(shí)發(fā)現(xiàn)錯(cuò)別字，一鍵精準(zhǔn)改錯(cuò)。這個(gè)功能設(shè)計(jì)得非常貼心，能讓用戶及時(shí)看到書寫錯(cuò)誤，降低因錯(cuò)別字帶來(lái)的煩惱。
2.5 常用語(yǔ)
過(guò)去在微信聊天的時(shí)候，為了提高輸入效率，我會(huì)把很多反復(fù)發(fā)送的文字復(fù)制到備忘錄或微信收藏，這能提升我一定的溝通效率。但相比微信鍵盤的常用語(yǔ)功能，我以后就會(huì)直接放棄之前的兩個(gè)形式了。這個(gè)功能實(shí)在太方便了，比如每一次粉絲添加我的時(shí)候，我都會(huì)需要介紹一下我們公眾號(hào)的內(nèi)容，現(xiàn)在我只需要輸入前3個(gè)字，這段話就可以直接出來(lái)了，極大提升我的溝通效率。
2.6 單手模式
「單手模式」是指用戶可根據(jù)自己的慣用手或場(chǎng)景設(shè)置輸入模式，前面我有提到過(guò)，長(zhǎng)按「JKL」拼音鍵，可切換至單手模式。
2.7 手寫找字
「手寫找字」是一個(gè)支持同時(shí)手寫多字的輸入模式，這個(gè)功能對(duì)于我們父輩一代的用戶特別適用，他們多數(shù)人還未習(xí)慣用拼音拼寫，更喜歡用手寫的形式去輸入，而支持寫多字的模式可以極大提升拼寫效率。
2.8 小結(jié)
什么是以場(chǎng)景為中心的設(shè)計(jì)，微信鍵盤的設(shè)計(jì)團(tuán)隊(duì)告訴我們，這就是以場(chǎng)景為中心的設(shè)計(jì)。過(guò)去設(shè)計(jì)者總是在思考如何去定義人們使用的系統(tǒng)和應(yīng)用程序，而“以場(chǎng)景為中心”的概念，則強(qiáng)調(diào)要以人的需求為中心，系統(tǒng)和應(yīng)用程序要去幫助人們滿足他們的需求。看看微信鍵盤設(shè)計(jì)團(tuán)隊(duì)結(jié)合如此多真實(shí)場(chǎng)景的設(shè)計(jì)，可見設(shè)計(jì)師真的需要具備場(chǎng)景思維，才能設(shè)計(jì)出讓用戶尖叫的體驗(yàn)。
3. 個(gè)人隱私
3.1 清空個(gè)人詞典
微信鍵盤提供了「清空個(gè)人詞典」的功能，這有點(diǎn)不可思議。不過(guò)微信鍵盤的創(chuàng)立之初，微信之父張小龍就說(shuō)過(guò)，微信將上線屬于自己的專屬輸入法，其目的并不是為了搶奪輸入法市場(chǎng)，而是為了更好的保護(hù)用戶的隱私。不過(guò)該功能大家要謹(jǐn)慎使用，一旦清空，你所累積的個(gè)人詞匯就會(huì)清空，將會(huì)影響你的輸入體驗(yàn)。
3.2 幫助反饋
針對(duì)微信鍵盤使用的技巧和常見問(wèn)題，微信鍵盤也設(shè)計(jì)了幫助反饋文檔，為用戶解決使用過(guò)程中的困惑。很多產(chǎn)品設(shè)計(jì)師或許覺得這樣的模塊可有可無(wú)，但這其實(shí)這就是尼爾森十大原則的人性化幫助原則，通過(guò)幫助文檔為用戶解決軟件使用困惑。
3.3 隱私與權(quán)限
“我們非常重視你的隱私安全。我們謹(jǐn)遵最小、必要原則，僅依《微信鍵盤隱私政策》獲取你使用微信鍵盤的功能所需的你的信息，不會(huì)額外獲得你的其他信息”。這是隱私與權(quán)限頁(yè)面的一句話，足以見得微信鍵盤的定位如上文所言，只做一款單純的輸入法軟件，不侵犯用戶的隱私。
作為一個(gè)才上線發(fā)布V1.0.0版本的輸入法產(chǎn)品，微信鍵盤真的給了我太大的驚喜。
從產(chǎn)品的易用性來(lái)看，無(wú)論是交互，還是界面，都嚴(yán)格遵循了尼爾森十大原則的標(biāo)準(zhǔn)。這個(gè)產(chǎn)品設(shè)計(jì)中最基礎(chǔ)的設(shè)計(jì)理論模型，事實(shí)上，太多的工具類產(chǎn)品都沒(méi)有遵循它的設(shè)計(jì)原則，我們常常說(shuō)一款工具難用、不好用、設(shè)計(jì)不好，就是這些操作細(xì)節(jié)沒(méi)有考慮進(jìn)去。而微信鍵盤，在我目前的使用操作過(guò)程中，暫時(shí)沒(méi)有，易用性非常高。
從產(chǎn)品的創(chuàng)新性來(lái)看，微信鍵盤不僅滿足了一個(gè)鍵盤輸入工具的基礎(chǔ)功能，而且結(jié)合了自身強(qiáng)大的生態(tài)環(huán)境設(shè)計(jì)了「拼寫Plus」這樣非常創(chuàng)新的功能。它幫助我實(shí)實(shí)在在地提升溝通效率，比如一鍵推送我的公眾號(hào)、和粉絲溝通的常用語(yǔ)等等，甚至破天荒的可以直接在聊天輸入框分享我喜歡的歌曲、書籍、電影、視頻號(hào)等，換做以前真的不敢想象原來(lái)這些功能可以通過(guò)一個(gè)輸入法軟件實(shí)現(xiàn)。
我已經(jīng)徹底成為微信鍵盤的腦殘粉了，即便某狗的輸入法顯示我已累計(jì)輸入超過(guò)4百萬(wàn)字，但微信鍵盤給我使用的尖叫感，真的讓我不可思議，就像那洶涌的潮水，一波又一波襲來(lái)，讓我尖叫！
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。
什么是“有駕”
【有駕】是百度旗下的汽車信息與服務(wù)平臺(tái)，累計(jì)用戶超5.3億，致力于為用戶提供真實(shí)、可靠的看選買車服務(wù)，以及為車企和經(jīng)銷商提供從品牌到效果的一站式互聯(lián)網(wǎng)營(yíng)銷解決方案。
現(xiàn)狀分析
有駕品牌在孵化初期，重點(diǎn)是在用戶詞建立品牌感知。所以我們提取“有駕“的字形做為品牌符號(hào)，減少歧義，強(qiáng)化用戶的感知。
但是隨著品牌持續(xù)運(yùn)營(yíng)進(jìn)入新的階段，我們發(fā)現(xiàn)現(xiàn)有的設(shè)計(jì)無(wú)法滿足后續(xù)的運(yùn)營(yíng)訴求了，主要體現(xiàn)在：
品牌logo：不能體現(xiàn)汽車的行業(yè)屬性，缺乏成體系的品牌符號(hào)和VI體系，色彩上也不夠符合時(shí)下潮流的年輕配色體系。
品牌活動(dòng)：品牌關(guān)聯(lián)度弱，活動(dòng)維度單一。
項(xiàng)目概述
因此，我們重新梳理有駕的品牌定位與調(diào)性，借助本次品牌升級(jí)，打造有駕差異化風(fēng)格，形成獨(dú)有的視覺印記。
因?yàn)橛脩魧?duì)于舊的logo已有一定的認(rèn)知。所以此次改版的目標(biāo)在保持固有用戶認(rèn)知，在原有基礎(chǔ)上進(jìn)行品牌標(biāo)識(shí)的探索及應(yīng)用，以強(qiáng)化品牌感知，提升品牌的競(jìng)爭(zhēng)力，整合業(yè)務(wù)資源做心智觸達(dá)。
前期分析
前期我們對(duì)汽車垂類的競(jìng)品進(jìn)行了一輪調(diào)研，并且結(jié)合有駕的用戶群里，尋找有駕品牌的差異點(diǎn)。
有駕用戶群體年輕化為主，普遍具有高學(xué)歷，集中在新一線二線城市。
通過(guò)以上在用戶、行業(yè)及行業(yè)趨勢(shì)等多唯獨(dú)的信息搜集后，我們確定了有駕品牌設(shè)計(jì)的四個(gè)核心關(guān)鍵詞：年輕、科技、未來(lái)、專業(yè)。
建立體系
在明確設(shè)計(jì)方向后，我們梳理了線上線下的所有品牌觸點(diǎn)，結(jié)合前期的調(diào)研結(jié)論，匯總出了有駕設(shè)計(jì)系統(tǒng)的完整框架，以確保品牌設(shè)計(jì)的完整性和靈活適用性。
設(shè)計(jì)落地
基于前期分析洞察結(jié)論，我們?cè)诶^承圓形和車形的基礎(chǔ)上，對(duì)品牌符號(hào)與icon進(jìn)行了大量的方案探索。從圖形、質(zhì)感等方面切入，簡(jiǎn)化圖形形態(tài)，嘗試不同的形態(tài)呈現(xiàn)的視覺感受和氣質(zhì)。最終確定了全新品牌logo方案。
相對(duì)于升級(jí)前，新版的logo加入汽車元素，解決升級(jí)前l(fā)ogo的行業(yè)屬性不明確的問(wèn)題，讓產(chǎn)品app的行業(yè)屬性更加直觀。同時(shí)增加品牌符號(hào)做為底紋，輔以有駕的圓形符號(hào)成為品牌核心的一部分。強(qiáng)化有駕的品牌基因。
符號(hào)提煉
確定品牌logo后，為了確保品牌能夠更好的拓展應(yīng)用，進(jìn)行了品牌符號(hào)的提煉。并為了延續(xù)之前的品牌調(diào)性。所以輔助圖形延續(xù)了之前的圓環(huán)造型，造型偏向輪胎；在不破壞原有型的基礎(chǔ)上，加入一些折角的質(zhì)感的變化，使圖形變化更加豐富，更有識(shí)別度。
設(shè)計(jì)語(yǔ)言
為了更好的觸達(dá)到各業(yè)務(wù)場(chǎng)景，所以我們對(duì)視覺風(fēng)格進(jìn)行了探索和拓展。分別以淺色與深色作為主要探索方向，以適配不同的落地場(chǎng)景。結(jié)合有駕的年輕化，科技感的設(shè)計(jì)目標(biāo)，探索出以下三種質(zhì)感呈現(xiàn)：
符號(hào)拓展
在提取的形狀基礎(chǔ)上進(jìn)行變形，增加折疊細(xì)節(jié)。在大事件活動(dòng)，海報(bào)等場(chǎng)景使用，增加品牌關(guān)聯(lián)度。
設(shè)計(jì)字體
結(jié)合全新的品牌定位，我們也優(yōu)化了有駕的品牌字體，從細(xì)節(jié)出透出有駕的品牌感知。
品牌手冊(cè)
新的品牌需要一套更全面的品牌系統(tǒng)來(lái)滿足不同場(chǎng)景下的業(yè)務(wù)拓展需求。
目前我們也對(duì)現(xiàn)有的品牌手冊(cè)進(jìn)行拓展和完善，同步到業(yè)務(wù)方，以便更好的保證各業(yè)務(wù)場(chǎng)景觸點(diǎn)下品牌的認(rèn)知和統(tǒng)一，達(dá)到提質(zhì)增效的目的。
品牌落地
除了對(duì)品牌對(duì)角度的塑造和升級(jí)，我們更積極的把品牌滲透到活動(dòng)、欄目包裝、大事件運(yùn)營(yíng)、品牌海報(bào)等各維度場(chǎng)景中，讓有駕品牌形象更加立體多元。
結(jié)語(yǔ)
目前有駕品牌升級(jí)已經(jīng)取得階段性成果，沉淀出更加完善的品牌資產(chǎn)，不僅提升設(shè)計(jì)效率保證全鏈路的品牌曝光，也為業(yè)務(wù)規(guī)?；蛳禄A(chǔ)。之后我們也將不斷完善和擴(kuò)充品牌資產(chǎn)，將設(shè)計(jì)成果不斷落地到業(yè)務(wù)中，細(xì)化業(yè)務(wù)目標(biāo)并與設(shè)計(jì)目標(biāo)緊密結(jié)合，多維度助力業(yè)務(wù)的高速發(fā)展。
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
前言：
1886年，由卡爾·本茨發(fā)明的第一輛汽車距今已經(jīng)有130多年了，汽車座艙的發(fā)展已經(jīng)來(lái)到了一個(gè)新的階段，現(xiàn)階段我們稱其為智能座艙。它不僅有著先進(jìn)的數(shù)字化儀表中控大屏，還有流媒體后視鏡、抬頭顯示、智能空調(diào)、智能氛圍燈等功能，看得見的看不見的地方無(wú)不凸顯著科技進(jìn)步帶來(lái)的變化。
作為HMI設(shè)計(jì)師，在這個(gè)領(lǐng)域也工作了許久，對(duì)于智能座艙、HMI的設(shè)計(jì)有了些見解和思考，本文試圖通過(guò)總結(jié)實(shí)車座艙、工作經(jīng)驗(yàn)、設(shè)計(jì)來(lái)展望未來(lái)的HMI設(shè)計(jì)趨勢(shì)，以及嘗試分析作為HMI設(shè)計(jì)師我們應(yīng)該如何在設(shè)計(jì)這一領(lǐng)域去趕上智能汽車發(fā)展的風(fēng)口。希望這些想法能讓剛?cè)胄谢蛘呦肴胄械脑O(shè)計(jì)師同學(xué)們對(duì)于HMI設(shè)計(jì)有一個(gè)幫助。
一、時(shí)代變革下的智能座艙——“第三空間”
二、科技發(fā)展帶來(lái)的設(shè)計(jì)需求改變
三、用戶體驗(yàn)帶來(lái)更高的設(shè)計(jì)要求
四、情感需求引領(lǐng)新的設(shè)計(jì)方向
五、總結(jié)
隨著自動(dòng)駕駛等技術(shù)的進(jìn)步，智能座艙最后將圍繞座艙電子、座艙內(nèi)飾全面升級(jí)到移動(dòng)的“第三空間”，將信息、娛樂(lè)、互聯(lián)等功能進(jìn)行全面融合，為消費(fèi)者提供更便捷的體驗(yàn)。汽車將不再是代步工具，用戶在車內(nèi)即可實(shí)現(xiàn)娛樂(lè)和辦公，汽車有望進(jìn)化成為家庭、辦公場(chǎng)所之外的“第三空間”。
盡管也有人認(rèn)為汽車只是個(gè)代步工具，但更智能化更數(shù)字化的智能座艙就是大勢(shì)所趨，各家車企八仙過(guò)海各顯神通，不停進(jìn)行車輛的智能化升級(jí)，提升智能座艙的體驗(yàn)，軟件定義汽車，這是行業(yè)的共識(shí)，許多互聯(lián)網(wǎng)公司也加入了這場(chǎng)戰(zhàn)爭(zhēng)。
在這樣的背景下，作為設(shè)計(jì)師的角度，看著智能座艙的智能化在不斷提升，我們對(duì)于HMI設(shè)計(jì)有了些思考。我們認(rèn)為會(huì)有這幾個(gè)方面帶來(lái)HMI設(shè)計(jì)需求或要求的的變化：
硬件技術(shù)的革新帶來(lái)體驗(yàn)形式的改變，而完善的設(shè)計(jì)升華用戶對(duì)于新科技的體驗(yàn)。在“未來(lái)”還沒(méi)有到來(lái)的時(shí)候，發(fā)揮設(shè)計(jì)的主觀能動(dòng)性能，能讓現(xiàn)在成為更好的現(xiàn)在。好的視覺體驗(yàn)不應(yīng)只是數(shù)字化的體驗(yàn)，硬件能夠給予視覺更加完整，更加豐富的體驗(yàn)感受。智能座艙科技能力不斷提高對(duì)設(shè)計(jì)有了不一樣的需求。作為設(shè)計(jì)師，關(guān)注科技和車機(jī)硬件技術(shù)的進(jìn)步能夠拓寬我們的視野，延展設(shè)計(jì)的畫卷。
傳統(tǒng)的HMI由中控系統(tǒng)，屏幕，?向盤控制等模塊組成，受限于應(yīng)?場(chǎng)景?多只滿?于?駛功能，強(qiáng)調(diào)的只有?和?的關(guān)系，但隨著??駕駛解放了?的雙?，?和?的關(guān)系將被重新思考定義。
1、通過(guò)設(shè)計(jì)提升自動(dòng)駕駛的體驗(yàn)，增強(qiáng)用戶的使用信心：
自動(dòng)駕駛模式下，通過(guò)攝像頭特、毫?波雷達(dá)、超聲波雷達(dá)等掃描記錄下當(dāng)前?輛所處的環(huán)境信息，將路況信息和道路周圍環(huán)境車輛等信息進(jìn)行可視化呈現(xiàn)在屏幕上。在這個(gè)過(guò)程中，除了硬件的可靠性能否掃描出周圍環(huán)境車輛物體之外，可視化的視覺設(shè)計(jì)也會(huì)影響到用戶的信心。
交互層面，需要有更多自動(dòng)駕駛可視化圖像的交互思考和創(chuàng)新，例如當(dāng)開啟自動(dòng)駕駛的車輛在一個(gè)復(fù)雜的十字路口等待紅綠燈是，周圍復(fù)雜的情況會(huì)讓用戶恐慌，特斯拉的fsd就會(huì)在停下等紅綠燈時(shí)，抬高視角，這種方式可以通過(guò)屏幕的可視化信息觀察到更多路況車輛信息，從而讓用戶對(duì)機(jī)器產(chǎn)生信任感。
視覺層面上，一般來(lái)說(shuō)識(shí)別度比較重要，能更直觀的展示模型可視化信息就好，但是可視化信息的表現(xiàn)形式可以作為視覺設(shè)計(jì)的重點(diǎn)，可以是線性模型，也可以是白模等等，要去契合車機(jī)的主題、顏色、概念，又要達(dá)到可視化的要求。
2、不同的主題模式以及新的視覺風(fēng)格：
作為決策者的汽車用戶當(dāng)然需要更多的主題顏色或主題風(fēng)格選擇，他們不再簡(jiǎn)單要求能用就行，不僅僅是更好用的交互，對(duì)視覺設(shè)計(jì)當(dāng)然也有了新的要求。
一般來(lái)說(shuō)，現(xiàn)在的車機(jī)系統(tǒng)最少都要有一套黑白模式，分別匹配白天黑夜的的駕駛場(chǎng)景；有的更是需要在越野、城市、長(zhǎng)途情況下有不同的視覺主題界面；或者是運(yùn)動(dòng)和沉浸駕駛有不同的界面風(fēng)格，這些根據(jù)需求都是需要去考慮的，如何匹配視覺設(shè)計(jì)。最常見的黑白模式來(lái)說(shuō)，在設(shè)計(jì)其中一套的過(guò)程中，就要去考慮如何適配成另一套，比如白色模式下的卡片投影，在黑色模式下如何顯示，如果不顯示投影如何去區(qū)分卡片。
設(shè)計(jì)的視覺風(fēng)格的趨勢(shì)不是一成不變的，我們認(rèn)為他的發(fā)展是螺旋式上升的，手機(jī)的UI最開始的擬物風(fēng)格滿滿的向著扁平化發(fā)展，但扁平化后大家又開始追求擬物，后面就誕生了輕擬物風(fēng)格和2.5d等風(fēng)格，現(xiàn)在又流行簡(jiǎn)約3d風(fēng)格。以前由于車載芯片性能等問(wèn)題，隨著車載芯片、屏幕性能的不斷發(fā)展，未來(lái)的HMI設(shè)計(jì)風(fēng)格絕對(duì)不會(huì)一塵不變，他同樣也會(huì)追求不同的設(shè)計(jì)風(fēng)格，輕擬物、簡(jiǎn)約3d圖標(biāo)甚至3d界面的交互都會(huì)不斷產(chǎn)生甚至已經(jīng)產(chǎn)生，也要求設(shè)計(jì)師去了解和掌握更多的設(shè)計(jì)風(fēng)格。
電動(dòng)汽車行業(yè)飛速發(fā)展,智能AI和人際互聯(lián)等人車交互概念也跟著興起,對(duì)于中控臺(tái)的需求和功能復(fù)雜度也跟著越發(fā)精細(xì)起來(lái)，全液晶顯示和HUD已經(jīng)成了基本操作，炫酷、科技感爆棚的HMI設(shè)計(jì)成為標(biāo)配。
1、越來(lái)的大的車載屏幕：
燃油車時(shí)代評(píng)價(jià)一輛車不可避免的會(huì)討論汽車三大件：發(fā)動(dòng)機(jī)、底盤和變速箱。但是智能座艙時(shí)代，不少人戲稱新的三大件是：彩電、冰箱和沙發(fā)。雖然是戲稱，但是我們也可以看出來(lái)大屏幕車機(jī)等提升座艙體驗(yàn)的設(shè)備越來(lái)越成為用戶購(gòu)買汽車的一個(gè)指標(biāo)。當(dāng)然也有人不這么認(rèn)為，但是市場(chǎng)是很誠(chéng)實(shí)的，大屏幕的車機(jī)就是更受歡迎，筆者曾問(wèn)過(guò)一個(gè)剛畢業(yè)幾年準(zhǔn)備買自己人生中第一輛車的朋友，你買車會(huì)在意車的中控屏大小嗎？他的回答是：當(dāng)然會(huì)，大就是好。
可以看出，作為HMI設(shè)計(jì)師，面對(duì)的情況就是越來(lái)越大的屏幕尺寸和分辨率以及越來(lái)越多屏幕數(shù)量。這也給了設(shè)計(jì)師更多的發(fā)揮空間。交互上可以有更多的交互形式，同時(shí)也有了更高的視覺要求，需要有場(chǎng)景、有主題、有氛圍等等等。作為座艙內(nèi)最顯眼的屏幕，也不簡(jiǎn)單是呈現(xiàn)功能那么簡(jiǎn)單，它也成為汽車內(nèi)飾的一部分，除了車內(nèi)的氛圍燈，屏幕內(nèi)也需要呈現(xiàn)更多的設(shè)計(jì)美感。
2、虛擬現(xiàn)實(shí)技術(shù)的發(fā)展：
雖然前文提到了駕駛員不再是單單駕駛者，但是首先駕駛這一需求是不會(huì)消失的，其次且隨著自動(dòng)駕駛的發(fā)展，用戶也希望能通過(guò)虛擬現(xiàn)實(shí)技術(shù)看到更多的信息來(lái)幫助自己完成抉擇決策。未來(lái)虛擬現(xiàn)實(shí)增強(qiáng)技術(shù)將在安全駕駛方面扮演著更為重要的角色。虛擬現(xiàn)實(shí)增強(qiáng)技術(shù)對(duì)于用戶而言，具有很大的直觀性，通過(guò)結(jié)合現(xiàn)實(shí)路況信息，實(shí)時(shí)出現(xiàn)一些虛擬箭頭來(lái)直觀地引導(dǎo)我們前進(jìn)，從而避免在駕駛中出現(xiàn)開過(guò)路口和分散駕駛員注意力的情況。
其實(shí)目前大面積應(yīng)用的hud也算是虛擬現(xiàn)實(shí)技術(shù)的一種，AR-hud早已經(jīng)成為了現(xiàn)在智能汽車的標(biāo)配，未來(lái)幾年，我認(rèn)為會(huì)有越來(lái)越的的用戶擺脫低頭看儀表的習(xí)慣，hud可以幫助駕駛者更便捷更安全的獲取駕駛、車輛、車道等信息。
我們都知道hud這一技術(shù)最早是作用于軍用戰(zhàn)斗機(jī)的，隨著技術(shù)的進(jìn)步虛擬現(xiàn)實(shí)技術(shù)會(huì)不斷下放到民用汽車上，所以作為設(shè)計(jì)師對(duì)這方面的技術(shù)也需要有更多的了解，如何運(yùn)用在汽車上，設(shè)計(jì)出更加符合汽車操作和行駛邏輯的虛擬現(xiàn)實(shí)技術(shù)的視覺信息。
另一個(gè)方面就是虛擬成像，科幻電影中的虛擬成像來(lái)進(jìn)行互動(dòng)和對(duì)話或許也會(huì)成為未來(lái)的HMI設(shè)計(jì)趨勢(shì)，但這可能要很久以后才能實(shí)現(xiàn)了，或許同元宇宙一樣久-_- !!!
以用戶更能理解、更能接受的方式展現(xiàn)全新的智能化座艙，提升操作的舒適性和高效：用更簡(jiǎn)單的方式傳達(dá)更直觀的信息。這是我們?cè)谟脩趔w驗(yàn)基礎(chǔ)上做設(shè)計(jì)需要做到的。
用戶對(duì)于智能座艙的操作不熟悉，產(chǎn)生不信任感，我們需要以設(shè)計(jì)為連接點(diǎn)，和用戶溝通?？萍紳M足人的基本需求，藝術(shù)升華體驗(yàn)。在科技飛速進(jìn)步的當(dāng)下，科技研發(fā)固然關(guān)鍵，以眼睛為窗戶讓用戶體驗(yàn)到科技的進(jìn)步同樣不可缺少，幫助用戶用視覺感受未來(lái)、提高體驗(yàn)是作為設(shè)計(jì)價(jià)值的最高追求。
·沉浸式的體驗(yàn)感
當(dāng)車輛從工具變?yōu)橐粋€(gè)能夠讓人沉浸和享受的空間，在原有的交通屬性之外增強(qiáng)智能座艙的空間的娛樂(lè)屬性。當(dāng)在車內(nèi)等待或者不想下車在車內(nèi)躺一會(huì)，小憩、k歌、電影等可能都是會(huì)干的事，露營(yíng)、閑聊等也可以是智能汽車提供的環(huán)境。所以我們需要將有限的畫面變成無(wú)限的遐想空間。
1、契合功能的氛圍設(shè)計(jì)：
不要好奇為什么有人為什么會(huì)在車上睡覺，會(huì)在車上看電影，但是這個(gè)需求是一定存在的，作為“第三空間”，這是智能座艙應(yīng)該要?jiǎng)偃蔚哪芰Α?
設(shè)計(jì)師需要做的就是打造契合這些場(chǎng)景下的氛圍感，通過(guò)氛圍燈音效可以打造出一個(gè)適合觀影、聊天的氛圍，前文提到屏幕也是車輛內(nèi)飾的一部分，也需要通過(guò)視覺畫面、動(dòng)效去一起營(yíng)造這個(gè)可以沉浸的氛圍。
2、視覺設(shè)計(jì)的畫面感：
當(dāng)科技滿足了基本需求后，我們需要更出色視覺設(shè)計(jì)來(lái)升華用戶的視覺體驗(yàn)。屏幕作為一幅畫框呈現(xiàn)我們想要的畫面，我們認(rèn)為HMI的界面設(shè)計(jì)會(huì)更多的趨向于整體的畫面感以及場(chǎng)景化，通過(guò)打造一個(gè)屏幕內(nèi)的場(chǎng)景空間，在服務(wù)和交互體驗(yàn)上突破創(chuàng)新，給用戶體驗(yàn)智能座艙的沉浸式體驗(yàn)空間。
目前已經(jīng)有不少汽車的都已經(jīng)用場(chǎng)景化的UI來(lái)上到自己的中控儀表上。場(chǎng)景主題的HMI已經(jīng)不只是單單的概念無(wú)法落地，虛幻引擎技術(shù)的加入也能讓更多的三維場(chǎng)景能夠落地到實(shí)車上。
·信息內(nèi)容需化繁為簡(jiǎn)
智能座艙的一個(gè)很大的特點(diǎn)就是幾乎將所有車內(nèi)功能按鍵、報(bào)警都搬進(jìn)了屏幕內(nèi)，那么幾乎所有的信息都要通過(guò)屏幕獲取，所有的功能都需要通過(guò)屏幕點(diǎn)擊操作完成，但是當(dāng)所有的內(nèi)容信息功能都堆積在一起時(shí)，任誰(shuí)看著都會(huì)產(chǎn)生信息焦慮。
通過(guò)設(shè)計(jì)去凸顯重要消息和重要功能是解決問(wèn)題的重要方法。許多汽車中控屏都將空調(diào)和座椅的快捷操作加入到了屏幕的底部dock欄，因?yàn)榭照{(diào)是使用頻率十分高的功能。交互層面的設(shè)計(jì)需要做到簡(jiǎn)化常用功能的使用層級(jí)步驟，視覺設(shè)計(jì)需要做到讓重要功能顯眼易操作。
·一觸即動(dòng)的反饋
我相信所有人都會(huì)認(rèn)為如果車機(jī)使用起來(lái)如果不流暢，體驗(yàn)會(huì)很糟糕，特別是如果極其卡頓，會(huì)不愿意使用，這也是許多人駕駛車輛的時(shí)候?qū)幵阜胖蟮闹锌仄敛挥茫ビ檬謾C(jī)導(dǎo)航的一個(gè)重要原因。受制于車載芯片的性能和屏幕的質(zhì)量，過(guò)去確實(shí)這種卡頓是沒(méi)有辦法解決的。但是這些隨著芯片性能和技術(shù)能力的提升，或許芯片已經(jīng)不是造成車輛卡頓的罪魁禍?zhǔn)住?
如果車機(jī)上的動(dòng)效做的不夠流暢舒適，也會(huì)產(chǎn)生“卡頓”感，同樣是對(duì)用戶體驗(yàn)的破壞。所以一定要做好動(dòng)效反饋，掌握好動(dòng)效節(jié)奏，讓用戶感受到一觸即動(dòng)舒適感，是可以大大提高用戶體驗(yàn)的。關(guān)于具體的動(dòng)效設(shè)計(jì)受篇幅影響就不展開了，我認(rèn)為這一塊車機(jī)與手機(jī)和pad上的動(dòng)效體驗(yàn)一致，蘋果靠著極其出色絲滑流暢的動(dòng)效設(shè)計(jì)讓人使用起來(lái)體驗(yàn)感十分舒適。界面中的元素彼此關(guān)聯(lián)，而非獨(dú)立存在。好的動(dòng)效設(shè)計(jì)是在界面中某一個(gè)元素發(fā)生變化時(shí)，與之相關(guān)聯(lián)的元素也會(huì)產(chǎn)生邏輯上合理的變化。動(dòng)效不是獨(dú)立存在的，而是彼此關(guān)聯(lián)著的。界面是由元素所組成的整體，所以當(dāng)界面中的某一些元素發(fā)生變化時(shí)，周圍的環(huán)境也會(huì)受到影響。
動(dòng)效設(shè)計(jì)像交互設(shè)計(jì)、視覺設(shè)計(jì)一樣已經(jīng)成為用戶體驗(yàn)的一個(gè)重要組成部分。一款具備舒適動(dòng)效標(biāo)準(zhǔn)的車機(jī)系統(tǒng)能給車主帶來(lái)更好的客戶體驗(yàn)。當(dāng)然，做好同開發(fā)的對(duì)接也很重要哦?。?！
當(dāng)科技水平很高且生活中處處是科技的產(chǎn)品，人類就會(huì)越加渴望高情感的環(huán)境。科技本身并不是冰冷的，它帶有溫度、靈感、和情感；科技也不是孤立、靜止的，它在不斷地尋求自身的發(fā)展并拓展與人類的關(guān)系。我們需要通過(guò)設(shè)計(jì)讓科技與用戶完成情感上的交流，讓其更具有藝術(shù)感和親和力，讓車機(jī)從“孤島”成為烏托邦。
·是助手更是伙伴
語(yǔ)音助手通過(guò)智能對(duì)話與即時(shí)問(wèn)答的智能交互，實(shí)現(xiàn)幫忙用戶解決問(wèn)題，而智能語(yǔ)音助手在智能座艙中的地位越來(lái)越受到重視。在功能的基礎(chǔ)上，如果智能語(yǔ)言助手能夠跟有溫度有情感，用戶也能夠更信任系統(tǒng)，擁有更好的使用體驗(yàn)。
如何讓語(yǔ)言成為助手和伙伴呢，我們認(rèn)為如果只是冰冷的vui光效反饋，是做不到溫度和感情的，可能我們需要一個(gè)語(yǔ)言形象。當(dāng)用戶喚起語(yǔ)言是，會(huì)有一個(gè)具體的形象出現(xiàn)在屏幕上或屏幕外，讓用戶產(chǎn)生與系統(tǒng)對(duì)話的感覺，產(chǎn)生愿意與其對(duì)話的意愿，建立情感觸點(diǎn)；另一方面，也可以打造一個(gè)提高汽車品牌產(chǎn)品力點(diǎn)IP形象。
所以語(yǔ)音形象的設(shè)計(jì)，我們認(rèn)為也是HMI設(shè)計(jì)師需要考慮和思考的，需要設(shè)計(jì)出契合品牌的IP形象，來(lái)成為用戶的專屬語(yǔ)音助手和伙伴。他or她需要有豐富的表情、豐富的肢體動(dòng)作，甚至有情緒來(lái)與用戶進(jìn)行互動(dòng)反饋，從而達(dá)到提升用戶體驗(yàn)的目的。
如何設(shè)計(jì)出一個(gè)有溫度有情感的語(yǔ)音助手大家可以翻翻之前發(fā)的文章《車載智能助手設(shè)計(jì)：智能座艙的合作伙伴》，希望能對(duì)大家有所幫助?。?！
·無(wú)微不至的細(xì)節(jié)設(shè)計(jì)
博大而深沉的情懷讓人贊賞，但微小而細(xì)膩的情感讓人感動(dòng)。總有人能夠被某個(gè)看似平凡的細(xì)節(jié)深深打動(dòng)，這便是細(xì)節(jié)設(shè)計(jì)的價(jià)值，我們精準(zhǔn)的去定位用戶群體，探索用戶的情感需求，當(dāng)然希望能夠做出打能夠做出打動(dòng)人心的細(xì)節(jié)設(shè)計(jì)。除了下面幾個(gè)點(diǎn)當(dāng)然還有更多的細(xì)節(jié)設(shè)計(jì)，就需要在設(shè)計(jì)過(guò)程中去慢慢體會(huì)和發(fā)現(xiàn)了了。
1、多模態(tài)交互方式：
人機(jī)的交互方式早就已經(jīng)不再是單單的觸屏操控，理想L9的后排屏幕，通過(guò)手勢(shì)或者語(yǔ)音都可以進(jìn)行操作，將手放在屏幕前半米外的位置挪動(dòng)，屏幕就會(huì)有光標(biāo)跟著手移動(dòng)，握拳就是點(diǎn)擊確認(rèn)，盡管這種交互方式目前來(lái)看還有瑕疵，但是作為設(shè)計(jì)師看到的應(yīng)該是在車上，會(huì)有更多更自然的多模態(tài)交互方式出現(xiàn)，可不僅僅只是手勢(shì)，通過(guò)文字、語(yǔ)音、視覺、動(dòng)作、環(huán)境等多種方式進(jìn)行人機(jī)交互，充分模擬人與人之間的交互方式，這不只是個(gè)噱頭，而是實(shí)打?qū)嵉捏w驗(yàn)設(shè)計(jì)。語(yǔ)音不就是一個(gè)典型的多模態(tài)交互的方式嗎。我們相信會(huì)有更多更自然交互方式，讓人既自然更加自然，做到“無(wú)感”的舒適。
2、情感化設(shè)計(jì)：
前文說(shuō)到語(yǔ)言助手的設(shè)計(jì)需要情感，但情感化設(shè)計(jì)是不僅僅體現(xiàn)在語(yǔ)音上，其實(shí)情感化設(shè)計(jì)是共通的，這是一種設(shè)計(jì)思維，這種思維可以體現(xiàn)在很多設(shè)計(jì)方面，比如，我們?cè)谝曈X設(shè)計(jì)上也可以去傳遞感情。而我們認(rèn)為，未來(lái)的HMI設(shè)計(jì)在很多地方都需要去考慮到用戶群體的情感共鳴。下面這個(gè)例子，重型卡車的儀表設(shè)計(jì)，鋼鐵元素是賴以生存的車，“門”是向往的家。依托大卡車司機(jī)在慢慢長(zhǎng)路上對(duì)家的思念和向往，用“門”的元素去撬動(dòng)這種情緒，以情感作為窗口，去引起卡車司機(jī)的共鳴。
HMI設(shè)計(jì)當(dāng)然不僅僅只有這些，還有很多，我們?cè)噲D總結(jié)一些關(guān)于HMI設(shè)計(jì)師需要去思考去了解的東西。新能源汽車的快速發(fā)展，同時(shí)也帶著智能座艙有了更高的需求，隨著這些因素，智能座艙對(duì)設(shè)計(jì)的要求無(wú)疑會(huì)越來(lái)越高。作為HMI設(shè)計(jì)師也需要對(duì)技術(shù)帶來(lái)的革新變化有敏銳的觀察能力并思考；同時(shí)也要有充足的知識(shí)體系和思考發(fā)掘能力去完成提高用戶體驗(yàn)的設(shè)計(jì)；同時(shí)也要有代入式的情感去進(jìn)行情感化的設(shè)計(jì).... 等等等等。這當(dāng)然也不是一朝一夕的事情，也需要我們?cè)O(shè)計(jì)從業(yè)者伴隨著快速發(fā)展的汽車這個(gè)行業(yè)一同去進(jìn)步。共勉?。?！
作者：EPUX 來(lái)源：站酷
藍(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)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(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.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
作者：博博 來(lái)源：大作
藍(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)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(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.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
作者：博博 來(lái)源：大作
藍(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)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(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.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
作者：博博 來(lái)源：大作
藍(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)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(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.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
作者：YoueSir 來(lái)源：站酷
藍(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)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(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.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.yvirxh.cn
