// 寫在前面
端到端導(dǎo)流是指在產(chǎn)品矩陣體系內(nèi)引導(dǎo)優(yōu)質(zhì)產(chǎn)品的用戶使用另外一款產(chǎn)品，帶來使用量的提升，從而實(shí)現(xiàn)用戶規(guī)模提升的一種增長(zhǎng)手段。隨業(yè)務(wù)快速增長(zhǎng)，有駕從百度汽車頻道衍伸出了有駕小程序、M站、PC站以及APP等多緯度的產(chǎn)品矩陣，依托各端流量實(shí)現(xiàn)矩陣產(chǎn)品間的導(dǎo)流，逐步積累用戶規(guī)模，是有駕目前獲客渠道中占比最高的方式。本文將以有駕導(dǎo)流體驗(yàn)升級(jí)的項(xiàng)目為例，分享導(dǎo)流增長(zhǎng)探索的設(shè)計(jì)思路與實(shí)踐經(jīng)驗(yàn)。
// 為什么要做導(dǎo)流
導(dǎo)流的目的
對(duì)于業(yè)務(wù)本身而言，隨著移動(dòng)互聯(lián)網(wǎng)流量紅利期的結(jié)束，獲取新用戶的成本越來越高，不管是新產(chǎn)品還是成熟型產(chǎn)品，都需要通過導(dǎo)流的手段來持續(xù)擴(kuò)充新用戶。其次，對(duì)于有駕產(chǎn)品生態(tài)而言，需要各端產(chǎn)品間的相互聯(lián)動(dòng)，協(xié)同發(fā)揮優(yōu)勢(shì)，實(shí)現(xiàn)流量?jī)r(jià)值最大化。
導(dǎo)流的優(yōu)勢(shì)
成本低，相較于投放、活動(dòng)等渠道流量獲取方式，矩陣導(dǎo)流成本低；
高意向，用戶購車意向明確更容易實(shí)現(xiàn)商業(yè)轉(zhuǎn)化；
可共享，用戶數(shù)據(jù)及行為關(guān)聯(lián)互通。
// 如何做好導(dǎo)流設(shè)計(jì)
1.問題分析
通過梳理核心場(chǎng)景的4種導(dǎo)流條，發(fā)現(xiàn)各個(gè)場(chǎng)景導(dǎo)流形式各異，用戶缺乏統(tǒng)一認(rèn)知，導(dǎo)流引導(dǎo)語單一內(nèi)容吸引力弱。在用戶在瀏覽頁面時(shí)，點(diǎn)擊功能入口或想要繼續(xù)查看更多內(nèi)容，需要下載APP才能繼續(xù)阻礙用戶瀏覽：
缺乏統(tǒng)一認(rèn)知：視覺表達(dá)形式不成體系，用戶感知不夠；
內(nèi)容吸引力弱：內(nèi)容單一缺乏吸引力，用戶沒有點(diǎn)擊欲望；
阻礙用戶瀏覽：打斷用戶正常使用功能，影響用戶體驗(yàn)。
從導(dǎo)流鏈路的用戶行為來看，整個(gè)流程下載路徑過長(zhǎng)，發(fā)現(xiàn)用戶流失較大的轉(zhuǎn)化點(diǎn)：
從小程序落地頁到下載頁：在進(jìn)入小程序?yàn)g覽頁面時(shí)，用戶沒有注意到導(dǎo)流條就滑走了；
點(diǎn)擊導(dǎo)流條進(jìn)入下載頁：點(diǎn)擊導(dǎo)流條會(huì)先調(diào)起導(dǎo)流彈窗，點(diǎn)擊確認(rèn)后再進(jìn)入到下載頁，用戶未選擇下載就退出了。
2.明確設(shè)計(jì)方向
針對(duì)導(dǎo)流現(xiàn)狀缺乏統(tǒng)一認(rèn)知，內(nèi)容吸引力弱、阻礙用戶瀏覽、下載路徑過長(zhǎng)的問題，我們搭建了一個(gè)完整的導(dǎo)流鏈路圖，根據(jù)用戶增長(zhǎng)模型，把用戶生命周期各節(jié)點(diǎn)的用戶行為與產(chǎn)品觸點(diǎn)一一羅列出來，找到增長(zhǎng)路徑的設(shè)計(jì)機(jī)會(huì)點(diǎn)。
通過以上的問題分析，如何建立用戶和產(chǎn)品的鏈接，保障友好的體驗(yàn)，是本次導(dǎo)流升級(jí)要解決的問題。根據(jù)用戶關(guān)鍵行為，我們可以將整個(gè)導(dǎo)流鏈路拆分為3個(gè)階段來挖掘主要機(jī)會(huì)點(diǎn)：
下載前：興趣激發(fā)導(dǎo)流吸引，建立用戶穩(wěn)定認(rèn)知；
下載中：強(qiáng)化用戶轉(zhuǎn)化動(dòng)機(jī)，刺激用戶完成下載；
下載后：保障還原體驗(yàn)暢通，提升首次使用體驗(yàn)。
下面將分別介紹導(dǎo)流下載前階段的設(shè)計(jì)落地實(shí)踐，以及下載中、下載后階段的延伸設(shè)計(jì)思考。
// 下載前
1.強(qiáng)化觸點(diǎn)吸引
是否能成功引起用戶注意，是轉(zhuǎn)化開始的第一步，統(tǒng)一的視覺風(fēng)格和滿足用戶訴求的內(nèi)容，有利于增強(qiáng)導(dǎo)流條的吸引力。
1）收斂導(dǎo)流條類型
針對(duì)【阻礙用戶瀏覽】打斷用戶正常使用功能、用戶沒有跳轉(zhuǎn)預(yù)期的體驗(yàn)問題，下線了阻斷式和截?cái)嗍絻煞N體驗(yàn)不友好的導(dǎo)流類型，將原來4種導(dǎo)流類型收斂為2種，僅保留通用導(dǎo)流條和功能延展導(dǎo)流條，基于這2種導(dǎo)流形態(tài)進(jìn)行深入的設(shè)計(jì)探索。
2）建立通用視覺標(biāo)準(zhǔn)
針對(duì)【缺乏統(tǒng)一認(rèn)知】視覺表達(dá)形式不成體系、用戶感知不夠的視覺問題，建立了通用導(dǎo)流條標(biāo)準(zhǔn)化規(guī)范。統(tǒng)一視覺形態(tài)，優(yōu)化為頁面內(nèi)通欄嵌入式，同時(shí)融入品牌色強(qiáng)化用戶感知，根據(jù)頁面布局制定了不同的展示規(guī)則。
上線后，內(nèi)嵌導(dǎo)流條在展現(xiàn)受限的情況下，導(dǎo)流轉(zhuǎn)化數(shù)據(jù)與改版前基本持平，為了進(jìn)一步提升導(dǎo)流的點(diǎn)擊效果，開始探索場(chǎng)景化定制提轉(zhuǎn)的設(shè)計(jì)方向。
3）定制場(chǎng)景化內(nèi)容
針對(duì)【內(nèi)容吸引力弱】?jī)?nèi)容單一缺乏吸引力、用戶沒有點(diǎn)擊欲望的內(nèi)容問題，在通用標(biāo)準(zhǔn)化形態(tài)的基礎(chǔ)上，根據(jù)不同場(chǎng)景用戶訴求點(diǎn)，豐富導(dǎo)流內(nèi)容。分別從內(nèi)容定制、按鈕文案優(yōu)化、以及氛圍強(qiáng)化3個(gè)方向驗(yàn)證對(duì)轉(zhuǎn)化的影響。
內(nèi)容定制：豐富導(dǎo)流利益點(diǎn)、場(chǎng)景化內(nèi)容更能激發(fā)用戶興趣，促進(jìn)轉(zhuǎn)化達(dá)成；
按鈕文案：轉(zhuǎn)化按鈕文案導(dǎo)向性明確、內(nèi)容與導(dǎo)流利益點(diǎn)匹配，可以助力按鈕轉(zhuǎn)化提升；
氛圍強(qiáng)化：導(dǎo)流樣式上適度弱化氛圍、樣式更傾向于原生功能，有助于提升導(dǎo)流條點(diǎn)擊。
2.拓展場(chǎng)景擴(kuò)量
復(fù)利通用標(biāo)準(zhǔn)導(dǎo)流條的成功經(jīng)驗(yàn)，應(yīng)用到功能延展類導(dǎo)流條中繼續(xù)驗(yàn)證有效性，從產(chǎn)品價(jià)值點(diǎn)出發(fā)，挖掘高流量場(chǎng)景的機(jī)會(huì)點(diǎn)從而帶來轉(zhuǎn)化增量。
1）價(jià)值傳遞
根據(jù)小程序和APP兩端各自的不同點(diǎn)，分別從功能差異及體驗(yàn)差異兩個(gè)方向進(jìn)行優(yōu)化。
APP特有功能：APP完善的功能體驗(yàn)可以更好滿足用戶訴求，例如參配瀏覽場(chǎng)景下，引導(dǎo)用戶體驗(yàn)搜索及橫屏查看的高頻功能，對(duì)于導(dǎo)流轉(zhuǎn)化有正向幫助；
各端體驗(yàn)差異：小程序和APP兩端體驗(yàn)存在差異，例如圖片瀏覽場(chǎng)景下，APP清晰流暢的瀏覽體驗(yàn)及放大全屏查看圖片的交互體驗(yàn)，能夠刺激用戶轉(zhuǎn)化。
2）價(jià)值延續(xù)
當(dāng)用戶完成核心內(nèi)容消費(fèi)后，是否可以引導(dǎo)用戶去APP繼續(xù)瀏覽更多相關(guān)內(nèi)容，進(jìn)而引導(dǎo)用戶下載呢？
服務(wù)透?jìng)?/strong>：平臺(tái)服務(wù)內(nèi)容傳遞，例如在內(nèi)容落地頁文末增加品牌廣告導(dǎo)流條，幫助用戶建立品牌認(rèn)知；
相關(guān)推薦：引導(dǎo)相關(guān)內(nèi)容消費(fèi)，例如在文章或視頻頁增加相關(guān)推薦導(dǎo)流條，引導(dǎo)用戶瀏覽更多相似內(nèi)容。
// 下載中
當(dāng)用戶通過導(dǎo)流條進(jìn)入到下載流程時(shí)，還有哪些手段可以刺激用戶激活減少流失呢？
強(qiáng)化下載動(dòng)機(jī)：下載頁前置APP落地頁內(nèi)容，例如將通用下載頁優(yōu)化為場(chǎng)景化下載頁，給用戶超前產(chǎn)品體驗(yàn)吸引轉(zhuǎn)化；
減少用戶流失：縮短鏈路簡(jiǎn)化流程，例如可在下載中間頁完成應(yīng)用下載，同時(shí)退出下載頁時(shí)增加挽留。
// 下載后
當(dāng)用戶在應(yīng)用商店下載完成后，我們還能做哪些提升首次啟動(dòng)APP的體驗(yàn)?zāi)兀?
還原鏈路暢通：提升場(chǎng)景還原成功率，減少頻繁提示信息干擾；
建立用戶心智：引導(dǎo)新用戶探索功能，根據(jù)用戶興趣推薦適合的內(nèi)容。
以上內(nèi)容是下載中和下載后階段導(dǎo)流優(yōu)化方向的一些延伸設(shè)計(jì)思考，為大家提供可以繼續(xù)探索的方向。
// 寫在最后
總結(jié)一下本篇文章關(guān)于導(dǎo)流的體驗(yàn)設(shè)計(jì)要點(diǎn)：
全鏈路洞察，對(duì)導(dǎo)流鏈路進(jìn)行拆解，通過盤點(diǎn)導(dǎo)流鏈路的用戶行為，明確每個(gè)節(jié)點(diǎn)的設(shè)計(jì)方向；
降低廣告干擾性，減少用戶瀏覽過程中的阻斷感，適度弱化廣告氛圍；
用戶的視角引導(dǎo)，讓用戶專注于產(chǎn)品本身傳遞的價(jià)值，引領(lǐng)用戶完成對(duì)產(chǎn)品的探索從而完成下載激活。
作者：百度MEUX
來源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
什么是“有駕”
【有駕】是百度旗下的汽車信息與服務(wù)平臺(tái)，累計(jì)用戶超5.3億，致力于為用戶提供真實(shí)、可靠的看選買車服務(wù)，以及為車企和經(jīng)銷商提供從品牌到效果的一站式互聯(lián)網(wǎng)營銷解決方案。
現(xiàn)狀分析
有駕品牌在孵化初期，重點(diǎn)是在用戶詞建立品牌感知。所以我們提取“有駕“的字形做為品牌符號(hào)，減少歧義，強(qiáng)化用戶的感知。
但是隨著品牌持續(xù)運(yùn)營進(jìn)入新的階段，我們發(fā)現(xiàn)現(xiàn)有的設(shè)計(jì)無法滿足后續(xù)的運(yùn)營訴求了，主要體現(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é)歷，集中在新一線二線城市。
通過以上在用戶、行業(yè)及行業(yè)趨勢(shì)等多唯獨(dú)的信息搜集后，我們確定了有駕品牌設(shè)計(jì)的四個(gè)核心關(guān)鍵詞：年輕、科技、未來、專業(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è)屬性不明確的問題，讓產(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ì)語言
為了更好的觸達(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)來滿足不同場(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)營、品牌海報(bào)等各維度場(chǎng)景中，讓有駕品牌形象更加立體多元。
結(jié)語
目前有駕品牌升級(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ì)公司，為期望卓越的國內(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ì)公司
一年一度，天貓雙十一全球狂歡節(jié)，如約而至！
從2015年開始，我們每年都會(huì)在雙十一期間，將雙十一品牌設(shè)計(jì)的完整思路分享給大家，這已經(jīng)成為雙十一設(shè)計(jì)團(tuán)隊(duì)的傳統(tǒng)。不為別的，各位同仁辛苦一年，想跟大家就著新鮮出爐的設(shè)計(jì)嘮嘮嗑。
每逢雙十一logo出街，都會(huì)有熱心的朋友幫我們解讀，也有人問我們?yōu)樯恫桓銈€(gè)官方發(fā)布？各位朋友，您現(xiàn)在看到的就是官方發(fā)布的內(nèi)容，它不只有l(wèi)ogo，而是從頭到尾一個(gè)完整的故事。
2019天貓雙十一主logo
2019天貓雙十一主logo多語言版本
今年是雙十一的第十一年，當(dāng)我們接到這個(gè)任務(wù)的時(shí)候，就有機(jī)靈的同學(xué)提議：“我們用6個(gè)1吧，111111，61兒童節(jié)！”、“讓我們回歸購物的純真快樂！”。
“哈哈哈哈哈哈…”魔性的笑聲在整個(gè)會(huì)議室回蕩，看來往年撓破頭也解不開的難題，就這么解開了？故事當(dāng)然不會(huì)這么簡(jiǎn)單，我們還沒有往這個(gè)方向嘗試就被否了。
其一，雙十一是一個(gè)深入人心的認(rèn)知，這四個(gè)一已經(jīng)成為了超級(jí)符號(hào)，是我們寶貴的品牌資產(chǎn)，而六個(gè)一不但不能幫我們強(qiáng)化認(rèn)知價(jià)值，反而會(huì)增加認(rèn)知成本。
其二，六個(gè)一是一個(gè)純視覺的創(chuàng)意，他很難支撐起我們要傳達(dá)的消費(fèi)者價(jià)值，也很難建立起情感連接。
我們應(yīng)該從哪兒入手？
回歸到設(shè)計(jì)的本質(zhì)來思考，我們認(rèn)為，設(shè)計(jì)的本質(zhì)是將一個(gè)想法或者觀點(diǎn)巧妙的表達(dá)給目標(biāo)對(duì)象，表達(dá)的過程中，形式只是手段，重點(diǎn)在于我們要表達(dá)什么。
我們集合了阿里各事業(yè)部的設(shè)計(jì)師代表，讓大家回歸到一個(gè)普通消費(fèi)者的狀態(tài)，一起聊一聊各自的雙十一故事，把這些故事提煉出來，就是消費(fèi)者對(duì)于雙十一普遍真實(shí)的認(rèn)知。在全年最便宜的一天，無論湊熱鬧也好，跟風(fēng)也好，貪便宜也好，好像不買點(diǎn)什么總感覺錯(cuò)過了什么。在這一天，“購物”毫無疑問成為頭等重要的事情。
阿里巴巴經(jīng)濟(jì)體設(shè)計(jì)師共創(chuàng)
那么我們要對(duì)消費(fèi)者表達(dá)“購物”嗎，講我們多么便宜，貨品多么豐富，多么物美價(jià)廉？這些是消費(fèi)者早就形成的認(rèn)知，是我們不用表達(dá)大家都知道的事，它看起來并不是一個(gè)想法和觀點(diǎn)。
還是購物，但肯定不是教大家怎么購物，作為消費(fèi)者，購物能給我們帶來什么？
有人說，購物能讓我們吃飽穿暖，讓我們出行方便，讓我們安居無憂。
如果這些你都有，你為什么還要購物？
因?yàn)槊總€(gè)人都向往更好的生活！
為了更好的生活，我們需要通過物品的改善帶來心理的滿足感。當(dāng)然也有人會(huì)會(huì)說，滿足感也可以通過其他的方式獲取，比如關(guān)愛他人、親近自然、學(xué)習(xí)、修行、冥想等等，我們非常認(rèn)同，更好的生活當(dāng)然不僅僅只有購物。但我們當(dāng)下探討的范疇僅僅只是“購物”以及“購物”能帶來的滿足感，對(duì)這種滿足感的期待，是每一個(gè)消費(fèi)行為的動(dòng)因。比如你想要買一件新衣服的時(shí)候，其實(shí)你已經(jīng)在期待穿上這件新衣服的樣子，你在挑選一件禮物的時(shí)候，已經(jīng)在期待他人收到這件禮物時(shí)的反應(yīng)……
雙十一，全年最便宜的一天，無疑讓你的期待，變得“更值得”期待，所以“更值得”讓大家買得更多。
但，這些洞察還只是幫我們理清了消費(fèi)行為背后的共性規(guī)律，實(shí)際上，細(xì)分到每個(gè)消費(fèi)者，因?yàn)樯矸萁巧罘绞降牟煌?，?dòng)因各自不同，還不能簡(jiǎn)單的用向往更好的生活來概括，因?yàn)樗橄?，聽上去?duì)，但每個(gè)消費(fèi)者更關(guān)心的是我的需求是不是被滿足，而對(duì)于雙十一來講，我們就是要打造屬于每一人的雙十一，而不僅僅只是購物，這樣它才具有節(jié)日的文化屬性。
所以，我們開始探尋真實(shí)的消費(fèi)者故事，尋找那些通過物品讓生活變得更好的故事，這些真實(shí)的故事，給了我們很大的感觸。我們發(fā)現(xiàn)，購物行為下，其實(shí)還隱藏了每一個(gè)消費(fèi)者內(nèi)心更深層的需求，它是一個(gè)個(gè)藏在心底的愿望，正是這些不同人的愿望，成就了每一個(gè)平凡人鮮活的人生。我們想要幫助他們實(shí)現(xiàn)自己的愿望。在雙十一當(dāng)天，幫助每個(gè)消費(fèi)者“愿望11實(shí)現(xiàn)”！這才是雙十一更應(yīng)該滿足的消費(fèi)者需求，它不僅僅是購物，而是通過物品價(jià)值上升到情感價(jià)值，這樣的品牌，才真正能夠讓人感受到溫度。在傾聽這些故事的時(shí)候，我們的阿里女神被感動(dòng)了，她主動(dòng)要求幫我們寫一首歌，她想把她的感動(dòng)通過音樂的方式記錄下來，配合我們精選出來的11個(gè)故事，講給大家聽。
“l(fā)ogo出來了？”低沉而沙啞的聲音，把我們從自我陶醉中喚醒，我們找到了想要表達(dá)什么，但和怎么表達(dá)之間還隔著上百個(gè)logo方案。
于是，我們開始了一輪又一輪的打磨，打磨的的重點(diǎn)放在了如何表達(dá)“愿望11實(shí)現(xiàn)”這一主題，這個(gè)過程中，有兩個(gè)大方向上的分歧：
一個(gè)大方向是表現(xiàn)“愿望”，因?yàn)樗容^有畫面感，也比較容易表達(dá)。
另一個(gè)大方向是表現(xiàn)“實(shí)現(xiàn)”，因?yàn)樗菍?duì)結(jié)果的描述，更符合消費(fèi)者對(duì)結(jié)果的預(yù)期。
在糾結(jié)掙扎過后，我們選擇了把兩個(gè)方向融合，劇情貌似又回到了熟悉的設(shè)計(jì)故事，“把這兩個(gè)方案融合一下！”我相信做設(shè)計(jì)的朋友，一定反復(fù)聽過這句話，沒聽過的朋友，那說明你做設(shè)計(jì)還不久，我保證在你今后的職業(yè)生涯里，這句話一定會(huì)反復(fù)出現(xiàn)。（一個(gè)會(huì)心的微笑）
融合說起來容易，這么抽象的文字怎么轉(zhuǎn)換成圖形表達(dá)，同時(shí)還要和貓頭+11.11融合，為什么要和貓頭+11.11融合呢，因?yàn)檫@是我們重要的品牌形象資產(chǎn)，從2015年開始，貓頭+11.11的組合就固定下來了，這意味著logo的80%的主體已經(jīng)固定，我們的難點(diǎn)就在于在這20%的區(qū)域里，如何既要表達(dá)主題，還能做出和往年不一樣的感覺。我敢向你保證，雙十一的logo是所有l(wèi)ogo里最難的，沒有之一，至少是我十幾年職業(yè)生涯里最硬的茬。
“愿望、實(shí)現(xiàn)、貓頭、11.11”這幾個(gè)詞反復(fù)在腦海里縈繞，經(jīng)驗(yàn)告訴我們，當(dāng)面對(duì)如此復(fù)雜的局面，我們應(yīng)該從里面跳出來，換個(gè)視角看問題，換什么視角？當(dāng)然還是再次回到消費(fèi)者視角，消費(fèi)者愿望實(shí)現(xiàn)時(shí)是一種什么樣的狀態(tài)？是愿望實(shí)現(xiàn)時(shí)的滿足？好像還差點(diǎn)意思，愿望平時(shí)也能實(shí)現(xiàn)，和在雙十一實(shí)現(xiàn)愿望有什么不同？
我們認(rèn)為，它應(yīng)該是超越你期待的表達(dá)，從愿望實(shí)現(xiàn)時(shí)的滿足，升級(jí)到愿望實(shí)現(xiàn)時(shí)的驚喜！這才是狂歡節(jié)該有的味道。當(dāng)然，驚喜也有很多種它還不夠有體感，如何找準(zhǔn)驚喜體感？
答案是感同身受。于是我們開始了場(chǎng)景模擬，模擬消費(fèi)者逛雙十一的場(chǎng)景。
當(dāng)我們來到雙十一的時(shí)候：“咦！今年好像真的不一樣！”
繼續(xù)探索的時(shí)候：“呀！找了好久的idou同款原來在這里！”
準(zhǔn)備下單的時(shí)候：“喔！真的很便宜！”
收到快遞的時(shí)候：“哇?。。?！”
聽上去有點(diǎn)夸張，但這確實(shí)是我們想要營造給消費(fèi)者的驚喜，當(dāng)人感到超越期待的驚喜時(shí)，會(huì)不自覺的放大瞳孔、張開嘴巴脫口而出。這是人類共通的體感，是不用解釋就有的共鳴。這讓我們瞬間被點(diǎn)亮了，“驚喜到脫口而出！”我們一下子找到了核心創(chuàng)意。
通過反復(fù)嘗試，我們發(fā)現(xiàn)氣泡形的表達(dá)，不僅能成為承載所有消費(fèi)者愿望的想法框，同時(shí)也能成為表達(dá)愿望實(shí)現(xiàn)時(shí)驚喜到脫口而出的對(duì)話框，把這個(gè)氣泡形和貓頭+11.11結(jié)合，這就是我們今年雙十一主logo的原由，這個(gè)logo和以往雙十一的logo最大的不同在于，它更像是一個(gè)容器，容納不同人不同的個(gè)性化表達(dá)。它一改之前一直端著的狀態(tài)，以一種更加親民，更加個(gè)人化的方式呈現(xiàn)給大家。
當(dāng)然，作為容器，我們還要把核心創(chuàng)意延展到線上線下各個(gè)場(chǎng)景。
雙十一定制禮盒
走向全球的雙十一
過去幾年，我們向大家介紹過天貓雙11的主風(fēng)格的來龍去脈，一定會(huì)在創(chuàng)新的基礎(chǔ)上，保持一貫的傳承。所以今年波普藝術(shù)的主基調(diào)還是會(huì)延續(xù)下去，問題又回到了我們?nèi)绾卧诓ㄆ账囆g(shù)這個(gè)大的基調(diào)下面，通過老元素的新組合，創(chuàng)造出全新的視覺感受。相比符號(hào)，視覺風(fēng)格更容易表現(xiàn)“驚喜到脫口而出！”這個(gè)idea，它可以通過形色質(zhì)構(gòu)全方位的表達(dá)。當(dāng)一個(gè)人“驚喜到脫口而出！”的時(shí)候，快樂的氣場(chǎng)圍繞在他周圍，這些無形的從中心向四周放散的表現(xiàn)，看上去很像是圓形聲波，同時(shí)它還能根據(jù)不同人的狀態(tài)做動(dòng)態(tài)變化，這就形成了一種設(shè)計(jì)語言，一種能用固定的形式做出千變?nèi)f化的效果的語言。
當(dāng)我們把它和波普藝術(shù)的主基調(diào)結(jié)合的時(shí)候，就形成了今年雙十一獨(dú)特的視覺語言，再通過形色質(zhì)構(gòu)的拆解，應(yīng)用到各個(gè)場(chǎng)景。
裝置應(yīng)用
天貓雙十一發(fā)布會(huì)現(xiàn)場(chǎng)應(yīng)用
天貓雙十一開幕盛典現(xiàn)場(chǎng)應(yīng)用
天貓雙十一許愿貓
天貓雙十一，助你愿望11實(shí)現(xiàn)！
現(xiàn)在參與阿里巴巴設(shè)計(jì)官方微博@AlibabaDesign 的雙十一話題互動(dòng)，就有阿里設(shè)計(jì)限量周邊好禮相贈(zèng)！這個(gè)雙十一，我們一起讓愿望11實(shí)現(xiàn)～
作者：阿里巴巴設(shè)計(jì)藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
數(shù)據(jù)大屏的設(shè)計(jì)，并非是傳統(tǒng)意義上的設(shè)計(jì)師或產(chǎn)品經(jīng)理就能完成的。它需要將藝術(shù)家、科學(xué)家與企業(yè)家的能力集于一身，需要擁有對(duì)動(dòng)態(tài)數(shù)據(jù)的把握能力、對(duì)產(chǎn)業(yè)經(jīng)濟(jì)與供應(yīng)鏈的結(jié)構(gòu)方法、對(duì)社會(huì)議題的捕捉與構(gòu)造，以及宏觀的視野和細(xì)致入微的匠人用心?？梢暬尡涞臄?shù)據(jù)產(chǎn)生溫度。
數(shù)據(jù)大屏是一個(gè)凝聚情緒的超級(jí)機(jī)器。
數(shù)據(jù)大屏不講述傳奇，它就是傳奇本身。
在這塊巨幕上，數(shù)據(jù)是公開透明的，它的變化在實(shí)時(shí)的體現(xiàn)著每一筆消費(fèi)的數(shù)字。每個(gè)人都能看到，也會(huì)被傳遞到全世界每個(gè)角落。雙11所帶來的巨大能量與共振，我們需要一塊巨大的屏幕來承載這份共情——這并不是一則新聞播報(bào)、一條統(tǒng)計(jì)數(shù)據(jù)，抑或一張圖表就可以完成的。在這樣一個(gè)狂歡的日子里，手機(jī)、個(gè)人電腦、電視機(jī)這些面向個(gè)人的設(shè)備，全都需要融入到這個(gè)巨型的超級(jí)情緒機(jī)器之中。
從宣傳與商業(yè)作戰(zhàn)的角度講，數(shù)據(jù)大屏需要兼顧故事性和震撼性兩重特點(diǎn)。通過故事腳本與內(nèi)容框架的設(shè)計(jì)，讓觀眾層層抽絲撥繭，從表層的情緒，看到內(nèi)核的戰(zhàn)略。
2019數(shù)據(jù)大屏的內(nèi)容框架大致分為三個(gè)層次。
情緒層：GMV的節(jié)節(jié)攀升滿足了媒體不斷推升的情緒高潮。在日益蕭條的國際環(huán)境中，中國的經(jīng)濟(jì)仍能屢創(chuàng)新高，每一位在雙11買買買的中國人背后是一種愛國主義與中國信心的體現(xiàn)。
業(yè)務(wù)層：阿里的自我表達(dá)。阿里經(jīng)濟(jì)體在城市中繼續(xù)深化的服務(wù)我們的消費(fèi)者，數(shù)據(jù)成為城市可持續(xù)發(fā)展的新資源；而商業(yè)操作系統(tǒng)隨著數(shù)字經(jīng)濟(jì)時(shí)代的到來，開始系統(tǒng)的服務(wù)我們的品牌與商家，在新的時(shí)代續(xù)寫“讓天下沒有難做的生意”。
戰(zhàn)略層：企業(yè)與國家發(fā)展同行。阿里的改變，反射了社會(huì)關(guān)系和社會(huì)結(jié)構(gòu)。點(diǎn)擊購物車就能買到全世界的東西，而對(duì)于國內(nèi)市場(chǎng)，精準(zhǔn)的人群定位、產(chǎn)業(yè)帶的建設(shè)都讓拉動(dòng)內(nèi)需變成一個(gè)大眾都能參與的事情。
依據(jù)數(shù)據(jù)表現(xiàn)，雙11當(dāng)天的情緒高潮會(huì)集中0點(diǎn)和24點(diǎn)前后。24小時(shí)內(nèi)，情緒的跌宕起伏，媒體向世界專遞著這種情緒?，F(xiàn)場(chǎng)，根據(jù)數(shù)據(jù)和情緒的變化，我們開始導(dǎo)演數(shù)據(jù)大屏在不同的時(shí)間段出現(xiàn)的鏡頭：GMV的彎道超車緊張窒息，晚飯過后是觀看城市夜經(jīng)濟(jì)的最佳時(shí)機(jī)，還有“買遍全球的購物車”、“小鎮(zhèn)青年”等進(jìn)20個(gè)鏡頭。
為什么是彎道超車？
大航海時(shí)代是貿(mào)易全球化的開端，也是當(dāng)代中國繼續(xù)擴(kuò)大開放，用一帶一路、進(jìn)博會(huì)等等新模式，承接人類當(dāng)今世界發(fā)展的新格局所在?；ヂ?lián)網(wǎng)與移動(dòng)互聯(lián)時(shí)代的到來，讓中國得以彎道超車占據(jù)世界領(lǐng)先地位，而隨之到來的數(shù)字經(jīng)濟(jì)時(shí)代正式開始了人類歷史上的新商業(yè)文明。馬老師說：打造新商業(yè)文明的時(shí)機(jī)已經(jīng)到來。數(shù)字時(shí)代是我們面臨的最大機(jī)遇，這個(gè)新時(shí)代最大的風(fēng)險(xiǎn)就是錯(cuò)失機(jī)會(huì)。
我們將這個(gè)核心理念融入GMV大屏的設(shè)計(jì)，正如逍遙子所說的那樣“消費(fèi)不是商業(yè)的終點(diǎn)，通過消費(fèi)者來提升生產(chǎn)端生產(chǎn)契機(jī)，優(yōu)化生產(chǎn)決策?！睘榇耍覀儗?dǎo)演了新商業(yè)文明的數(shù)據(jù)大戲：GMV屏中的賽道，3個(gè)鏡頭穿越了大航海時(shí)代、互聯(lián)網(wǎng)時(shí)代，數(shù)字經(jīng)濟(jì)時(shí)代彎道超車的新商業(yè)文明，快進(jìn)了商業(yè)文明的發(fā)展。
11.11當(dāng)天的數(shù)據(jù)也被融入其中，賽道上奔跑著餓了么、盒馬配送線和菜鳥的物流線，空中飄散的氣泡是實(shí)時(shí)產(chǎn)生的交易熱力。
△2019雙11數(shù)據(jù)大屏-GMV彎道超車&3個(gè)視角切換
2019年，即使是在國際經(jīng)濟(jì)大環(huán)境衰退的今天，阿里的雙11仍舊創(chuàng)造了新的商業(yè)奇跡：2684億人民幣的GMV的背后，是中國人為了家庭與自己而歡樂剁手，也是中國消費(fèi)者面對(duì)全球大環(huán)境下對(duì)中國的強(qiáng)大信心。從2009年的電商大促，到11年后的全球狂歡節(jié)，阿里伴隨著中國經(jīng)濟(jì)海洋的形成而不斷掀起巨浪。李克強(qiáng)總理就曾經(jīng)用雙11的銷售數(shù)據(jù)，來解答那些對(duì)中國經(jīng)濟(jì)感到不解的人們，讓他們瞬間懂得中國經(jīng)濟(jì)是汪洋大海。
△2019雙11數(shù)據(jù)大屏-歷年GMV增速
2. 全球化：買遍全球的購物車
中國經(jīng)濟(jì)與中國消費(fèi)者的貢獻(xiàn)，是對(duì)全球經(jīng)濟(jì)的貢獻(xiàn)。消費(fèi)者購物車?yán)锊刂篮蒙畹脑妇?，打開了世界消費(fèi)的新空間。天貓國際把來自全球78個(gè)國家和地區(qū)的品牌和商品帶進(jìn)中國，滿足消費(fèi)者的品質(zhì)消費(fèi)需求。買遍全球的購物車，更為世界經(jīng)濟(jì)增長(zhǎng)貢獻(xiàn)拉動(dòng)力。越來越多國際品牌青睞中國市場(chǎng)，通過天貓國際滿足中國消費(fèi)者的需求。
△2019雙11數(shù)據(jù)大屏-全球化
隨著政策的推動(dòng)，全國經(jīng)濟(jì)進(jìn)入夜生活消費(fèi)時(shí)代，大量的城市開始準(zhǔn)備成為一座座不夜城。在這個(gè)新的消費(fèi)增長(zhǎng)領(lǐng)域，新商品、新商機(jī)、新消費(fèi)模式、新空間與新玩法都層出不窮。在未來，理解夜晚的中國，或許比理解白天的中國更為重要。
△2019雙11數(shù)據(jù)大屏-杭州經(jīng)濟(jì)體服務(wù)網(wǎng)絡(luò)
△2019雙11數(shù)據(jù)大屏-天貓商超網(wǎng)絡(luò)
△2019雙11數(shù)據(jù)大屏-杭州城市夜生活
14億的中國人口、巨大的地域差異與文化差異意味著，每一種類型的消費(fèi)人群都是海量的，都擁有現(xiàn)有經(jīng)濟(jì)理論所無法囊括的巨大潛力。小鎮(zhèn)青年、銀發(fā)一族、95后作為新消費(fèi)崛起的代表族群，正悄悄改變著社會(huì)的消費(fèi)結(jié)構(gòu)。通過數(shù)據(jù)我們清晰看到：族群的喜好千差萬別，數(shù)字化的新消費(fèi)使得商家能針對(duì)消費(fèi)者需求創(chuàng)造新供給。
△2019雙11數(shù)據(jù)大屏-新人群，新消費(fèi)
天貓創(chuàng)造的價(jià)值是真正支持品牌的數(shù)字化轉(zhuǎn)型，不僅僅贏得今天的業(yè)務(wù)，更在于決勝未來。國潮席卷而來，智能商業(yè)魅力無限，全球供應(yīng)鏈在動(dòng)蕩與智能化中全面轉(zhuǎn)身。全方位重構(gòu)產(chǎn)品創(chuàng)新、品牌建設(shè)，強(qiáng)化天貓與品牌之間的合作，這便是我們想在雙11這天展現(xiàn)的萬里品牌江山畫卷。
△2019雙11數(shù)據(jù)大屏-品牌榜
當(dāng)GMV越來越逼近2684億人民幣時(shí)，炸裂感給每個(gè)人的沖擊是：中國又誕生了一個(gè)新的奇跡！即使在全球經(jīng)濟(jì)放緩的今天，中國人民對(duì)于天貓雙11全球狂歡節(jié)的熱情絲毫不減。在這背后，是數(shù)字經(jīng)濟(jì)時(shí)代下的阿里巴巴，向新商業(yè)文明邁進(jìn)了一大步。
作者：阿里巴巴設(shè)計(jì)藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
可視化圖表是提升信息傳遞效率的一種有效方法，特別是在B端平臺(tái)中經(jīng)常遇到對(duì)統(tǒng)計(jì)的數(shù)據(jù)分析總結(jié)的呈現(xiàn)。我們?cè)O(shè)計(jì)師在設(shè)計(jì)圖表的過程中，如果沒有系統(tǒng)的可視化知識(shí)，會(huì)出現(xiàn)設(shè)計(jì)的圖表雖然美觀但圖表不能很好的反應(yīng)數(shù)據(jù)的情況。那么，在復(fù)雜的數(shù)據(jù)關(guān)系中如何設(shè)計(jì)和選用圖表，如何在好看的同時(shí)提升信息傳達(dá)效率，看完這篇文章希望對(duì)你的設(shè)計(jì)過程有所幫助。
// 為什么要數(shù)據(jù)可視化
數(shù)據(jù)可視化就是用圖表來表示數(shù)據(jù)信息，它所傳達(dá)的信息包括你所拿到的數(shù)據(jù)源和你分析后的結(jié)果，再通過圖形強(qiáng)化用戶的理解和記憶。能讓用戶簡(jiǎn)潔明了的獲取更多的信息，是我們可視化的最終目的。
舉個(gè)例子，同樣一組數(shù)據(jù)，用表格的形式呈現(xiàn)是很難有所洞察的；如果將各個(gè)地區(qū)維度的數(shù)據(jù)聚合以柱圖形式呈現(xiàn)，很容易就能看出各個(gè)地區(qū)間數(shù)據(jù)的差異，并從中洞察規(guī)律
關(guān)于如何設(shè)計(jì)好數(shù)據(jù)可視化圖表，這邊總結(jié)了三個(gè)步驟：選擇適合的圖表，強(qiáng)化視覺層次，圖表響應(yīng)式適配。
一、選擇適合的圖表
數(shù)據(jù)可視化的圖表種類繁多，當(dāng)我們真的開始作圖，往往會(huì)遇到一個(gè)困境：有這么多類型，要如何選擇正確的圖表呢？首要依據(jù)是考慮所要傳達(dá)的信息意圖，即所要制作的圖表它的任務(wù)是什么，再通過分析數(shù)據(jù)關(guān)系來選擇表達(dá)方式；第二層意圖是圖表傳達(dá)內(nèi)容，這時(shí)候我們就需要根據(jù)數(shù)據(jù)的特征去突出和強(qiáng)化。
1. 分析數(shù)據(jù)關(guān)系
根據(jù)數(shù)據(jù)分析的方式來看，每一種圖表都對(duì)應(yīng)了一種數(shù)據(jù)關(guān)系。從數(shù)據(jù)的維度出發(fā)弄清呈現(xiàn)結(jié)構(gòu)，再結(jié)合數(shù)據(jù)關(guān)系作出選擇。了解圖表的可能知道，一般圖表的數(shù)據(jù)關(guān)系有構(gòu)成、比較、分布，以商業(yè)數(shù)據(jù)為例，常見的還有流轉(zhuǎn)關(guān)系。
構(gòu)成關(guān)系
構(gòu)成關(guān)系的圖表表達(dá)的是部分和整體的關(guān)系，用于分析總體和各部分的占比比例，構(gòu)成關(guān)系一般局部元素加起來為總數(shù)。如果只是想對(duì)比個(gè)別組成部分的大小，也可以使用比較關(guān)系的圖表。
常用圖表：餅/環(huán)圖、堆疊圖、面積圖等，如涉及到層級(jí)結(jié)構(gòu)，還會(huì)用矩形樹圖或旭日?qǐng)D等特殊結(jié)構(gòu)圖表。
關(guān)鍵詞：“占比、比例、百分比”
比較關(guān)系
比較關(guān)系是基礎(chǔ)分析中常用的一種圖表類型。在一定的取值范圍內(nèi)，通過對(duì)兩個(gè)或兩個(gè)以上的指標(biāo)分析，可以直觀的看到變化和差距。對(duì)比分析包括趨勢(shì)對(duì)比和分類對(duì)比兩種形式，趨勢(shì)對(duì)比用于表示一段時(shí)間內(nèi)數(shù)據(jù)的變化，分類對(duì)比用于比較數(shù)據(jù)規(guī)模。
常用圖表：趨勢(shì)對(duì)比常用圖表有折線圖、散點(diǎn)圖等；分類對(duì)比常用條形圖、柱狀圖、氣泡圖等。
關(guān)鍵詞：“增減、升降、漲跌、波動(dòng)”
分布關(guān)系
利用空間分區(qū)來展示數(shù)據(jù)之間的分布關(guān)系，常用于體現(xiàn)兩個(gè)或以上數(shù)據(jù)的相關(guān)性。
常用圖表：散點(diǎn)圖、熱力圖、雷達(dá)圖等
關(guān)鍵詞：“隨著……而變化、A/B之間的相關(guān)性、交/并集”等
關(guān)聯(lián)與流轉(zhuǎn)
流轉(zhuǎn)關(guān)系是B端數(shù)據(jù)常用的一種關(guān)系，它可以動(dòng)態(tài)的體現(xiàn)相關(guān)路徑下對(duì)象之間的關(guān)系、狀態(tài)、數(shù)據(jù)量的流轉(zhuǎn)變化等，以面積或顏色深淺展示了多個(gè)狀態(tài)或?qū)ο笾g的流動(dòng)量或流動(dòng)強(qiáng)度。
常用圖表：關(guān)系圖、?；鶊D、漏斗圖、進(jìn)度圖等
關(guān)鍵詞：“流程步驟、留存、轉(zhuǎn)化、關(guān)系”
2. 分析數(shù)據(jù)特征
按數(shù)據(jù)關(guān)系和分析目的選擇好圖表類型后，第二步是根據(jù)數(shù)據(jù)特征選擇更加適合的展示方式。從數(shù)據(jù)分析的角度常見數(shù)據(jù)特征有：變量特征、維度特征、層級(jí)特征、流程特征。
變量特征
分辨一個(gè)指標(biāo)通常有兩類特征，按變量值是否連續(xù)可分為連續(xù)數(shù)據(jù)與離散數(shù)據(jù)兩種。連續(xù)數(shù)據(jù)通常會(huì)統(tǒng)計(jì)一組數(shù)據(jù)的變化趨勢(shì)，離散數(shù)據(jù)通常統(tǒng)計(jì)各分類下數(shù)量的變化。
維度特征
多維度分析需要將多個(gè)變量在同一平面上直觀的表示，可以選擇使用極坐標(biāo)系去展示多個(gè)維度變量。如果希望對(duì)比多組數(shù)據(jù)，可使用不同顏色進(jìn)行分類
層級(jí)特征
多層級(jí)數(shù)據(jù)由多個(gè)部分構(gòu)成一個(gè)整體，又稱樹形結(jié)構(gòu)數(shù)據(jù)。除了用結(jié)構(gòu)樹圖表表現(xiàn)以外，還可以考慮以下兩種圖表類型：
例如：上圖顯示了市場(chǎng)銷售額的來源結(jié)構(gòu)。長(zhǎng)方形的大小取決于各國家的平均銷售額，通過色調(diào)來區(qū)分不同類型，顏色的深淺代表分類下的子集，面積體現(xiàn)銷售占比。對(duì)比一般結(jié)構(gòu)樹圖表，它的優(yōu)勢(shì)在于可以有效利用空間。
流程特征
流轉(zhuǎn)關(guān)系是表達(dá)數(shù)據(jù)轉(zhuǎn)化流程的重要類型，不僅包含統(tǒng)計(jì)意義上的數(shù)據(jù)總和，同時(shí)還表達(dá)了信息流轉(zhuǎn)的路徑；其中?；鶊D和漏斗圖都可以表達(dá)路徑中流量的變化，不同的是?；鶊D重點(diǎn)強(qiáng)調(diào)流量的強(qiáng)度和走向，漏斗圖更加注重突出轉(zhuǎn)化率和效果，根據(jù)不同的表達(dá)目的選用。
二、強(qiáng)化視覺層次
選擇合適的圖表后，在信息傳達(dá)上也需要正確的表達(dá)，展示形式美觀的同時(shí)能夠清晰的體現(xiàn)數(shù)據(jù)特點(diǎn)。
1. 強(qiáng)化數(shù)據(jù)特性
使用圖表正確的表達(dá)信息，需要設(shè)計(jì)師在強(qiáng)化數(shù)據(jù)特性的同時(shí)避免偏差
2. 色彩視覺傳達(dá)
除了在設(shè)計(jì)構(gòu)圖上優(yōu)化以外，顏色的選擇也是圖表重要的的信息表達(dá)元素。顏色會(huì)影響我們對(duì)數(shù)據(jù)的感知，錯(cuò)誤的取色會(huì)讓信息讀取產(chǎn)生誤解。我們可以通過不同的分析目的設(shè)置意圖色板，精確傳達(dá)信息同時(shí)后續(xù)的項(xiàng)目在選用時(shí)也可以達(dá)到用色的統(tǒng)一。
我們?cè)谥暗奈恼吕镉薪榻B過圖表的取色模型，通過調(diào)整顏色HSL值的區(qū)間，可以得到以下三種意圖色板：
那么我們要怎么樣去使用這些色板呢？下面幾個(gè)案例將帶你了解其中的差異。
定性型：使用色調(diào)來進(jìn)行分類
數(shù)據(jù)內(nèi)在沒有順序差別時(shí)，建議使用色調(diào)值（H）進(jìn)行區(qū)分；如定義國家、行業(yè)等類型。如果希望圖表看起來更加專業(yè)，以下有幾項(xiàng)分類色板的小建議：
定量型：使用深淺色板強(qiáng)調(diào)內(nèi)在順序
如果在同一個(gè)分類下包含子類別，或者數(shù)據(jù)本身具有排名屬性，那么建議使用連續(xù)色板來突出他們內(nèi)在的順序，使圖表更加易讀。
三、圖表中的響應(yīng)式設(shè)計(jì)
B端圖表可視化的數(shù)據(jù)一般是在網(wǎng)頁或移動(dòng)端上動(dòng)態(tài)顯示。不同于平面展示或匯報(bào)，在基礎(chǔ)設(shè)計(jì)完成后還需要考慮到圖表展示的環(huán)境，根據(jù)不同端去適配顯示效果，以適應(yīng)各種復(fù)雜情況。而動(dòng)態(tài)顯示帶來的交互特性也讓數(shù)據(jù)展示有了更多的可能性。
1. 布局框架適配
在網(wǎng)頁端顯示時(shí)，有時(shí)候同一個(gè)圖表需要考慮不同容器下的適配方式。根據(jù)數(shù)據(jù)相關(guān)性變化元素的適應(yīng)形態(tài)，將非必要的的元素轉(zhuǎn)化或隱藏，保留重要的圖形元素去適應(yīng)當(dāng)前空間；元素隱藏后使用懸浮交互來保證信息的展示，保持圖表的可讀性同時(shí)也避免產(chǎn)生元素的重疊。
如案例中的圖表，在不同尺寸下通過改變和隱藏圖表元素，以達(dá)到適配當(dāng)前空間的效果。
2. 圖表元素適配
要適配移動(dòng)端，網(wǎng)頁端橫向延展的顯示方式需要適應(yīng)移動(dòng)端縱向空間的顯示。除了呈現(xiàn)角度的改變外，還需要考慮手機(jī)屏幕的尺寸和圖表元素的適配性，去兼容相關(guān)的交互操作。
3. 極值適配
因B端平臺(tái)的特性，我們無法預(yù)知客戶傳入的數(shù)據(jù)量，可能會(huì)遇到因數(shù)據(jù)量過多，造成圖表顯示不佳，數(shù)據(jù)讀取困難等問題。這種情況下，提前考慮數(shù)據(jù)極限場(chǎng)景，通過交互的形式變化的方式讓用戶獲取完整信息，提升理解同時(shí)信息展示更靈活。
還有懸浮放大、點(diǎn)擊下鉆、聯(lián)動(dòng)圖表等交互行為可以組成更加豐富的圖表。因篇幅原因，在這篇文章就不做深入講解了，以后可獨(dú)立介紹。
// 結(jié)語
數(shù)據(jù)可視化在B端設(shè)計(jì)場(chǎng)景中發(fā)揮著重要作用。設(shè)計(jì)師在表達(dá)數(shù)據(jù)之美的同時(shí)更加準(zhǔn)確，才能更直觀地向用戶傳達(dá)數(shù)據(jù)的價(jià)值。使業(yè)務(wù)人員能夠從復(fù)雜的業(yè)務(wù)數(shù)據(jù)中快速、直接地找到重要數(shù)據(jù)，確保用戶能夠更好的接收信息，才是可視化的關(guān)鍵。
* 以上圖表中均為虛擬數(shù)據(jù)，僅作為案例參考
感謝閱讀，以上內(nèi)容均由百度MEUX團(tuán)隊(duì)原創(chuàng)設(shè)計(jì)，以及百度MEUX版權(quán)所有，轉(zhuǎn)載請(qǐng)注明出處，違者必究，謝謝您的合作。申請(qǐng)轉(zhuǎn)載授權(quán)后臺(tái)回復(fù)【轉(zhuǎn)載】。也歡迎加入MEUX,視覺/交互/運(yùn)營設(shè)計(jì)師，可投簡(jiǎn)歷至MEUX@BAIDU.COM (注明信息獲取來源如：站酷）
關(guān)于我們：
MEUX,百度移動(dòng)生態(tài)用戶體驗(yàn)設(shè)計(jì)中心，負(fù)責(zé)百度移動(dòng)生態(tài)體系的用戶/商業(yè)產(chǎn)品的全鏈路體驗(yàn)設(shè)計(jì)。服務(wù)的產(chǎn)品包括百度APP、百度搜索、百度百科、百度貼吧、百度商業(yè)產(chǎn)品等。MEUX以「簡(jiǎn)單極致」為設(shè)計(jì)理念，創(chuàng)造極致用戶體驗(yàn)的同時(shí)賦能商業(yè)，推動(dòng)設(shè)計(jì)行業(yè)的價(jià)值和影響力，讓生活因設(shè)計(jì)而更美好。
博學(xué)多聞，不同凡響。
博聞美育，是一款致力于提升用戶文化素養(yǎng)的產(chǎn)品。研發(fā)團(tuán)隊(duì)以“長(zhǎng)見識(shí)，會(huì)思考，懂審美”作為核心理念，設(shè)計(jì)出《中國故事》《四方采風(fēng)》《高端文學(xué)》等的系列課程。
面對(duì)一個(gè)真正落實(shí)人文素養(yǎng)的全新課程產(chǎn)品，我們作為視覺設(shè)計(jì)師，首先希望的就是為用戶打造出最美的課堂，使用戶在高品質(zhì)的美學(xué)場(chǎng)景中能沉浸式體驗(yàn)到學(xué)習(xí)的樂趣。當(dāng)然，我們同樣希望探尋如何通過設(shè)計(jì)幫助青少年在使用產(chǎn)品時(shí)養(yǎng)成高審美意識(shí)，加強(qiáng)文化自信。
在此次對(duì)博聞產(chǎn)品的視覺品牌設(shè)計(jì)中，設(shè)計(jì)團(tuán)隊(duì)探尋了如何將視覺設(shè)計(jì)體驗(yàn)與課程教學(xué)更好的結(jié)合，以下為我們的設(shè)計(jì)過程以及設(shè)計(jì)成果。
首先，我們通過對(duì)產(chǎn)品特性的分析，明確了此次視覺品牌探索的主要設(shè)計(jì)目標(biāo) —— 重新定義什么是提升學(xué)習(xí)體驗(yàn)的人文素養(yǎng)產(chǎn)品，從用戶視角轉(zhuǎn)變?yōu)閰⑴c者，更加沉浸于課堂。
基于對(duì)設(shè)計(jì)目標(biāo)的進(jìn)一步探索，我們提煉出了提升學(xué)習(xí)體驗(yàn)的三種核心理念：
近年來，國潮文化與傳統(tǒng)藝術(shù)在青少年群體中“走紅”，成為青年對(duì)話傳統(tǒng)的方式。體現(xiàn)了青少年對(duì)中華優(yōu)秀傳統(tǒng)文化的價(jià)值認(rèn)同和情感認(rèn)同。我們希望在青少年養(yǎng)成審美與內(nèi)在的關(guān)鍵階段，也盡到自己的一份小小的努力。
在保留傳統(tǒng)藝術(shù)精華的基礎(chǔ)上，我們尋求視覺上的創(chuàng)新，突破設(shè)計(jì)的思維慣性，使用戶可以通過現(xiàn)代的視覺表達(dá)形式與經(jīng)典文化產(chǎn)生共鳴，傳達(dá)國風(fēng)之美，多角度喚起青少年用戶對(duì)于傳統(tǒng)經(jīng)典的文化價(jià)值和藝術(shù)價(jià)值的理解。
我們希望將國風(fēng)之美呈現(xiàn)在用戶面前，將有道博聞系列課程全面包裝成能夠讓學(xué)生身臨其境的國風(fēng)互動(dòng)課堂，豐富用戶的心智，發(fā)揮產(chǎn)品的雙重價(jià)值。
確立核心理念后，我們將中國傳統(tǒng)藝術(shù)中的精髓進(jìn)一步提煉，最終選擇了以下關(guān)鍵詞作為視覺設(shè)計(jì)的表現(xiàn)點(diǎn)：
接下來，我們基于各個(gè)關(guān)鍵詞對(duì)具體方案展開探索
容納承載，歷史淵源。
為了確保博聞三個(gè)系列的課程（《中國故事》《四方采風(fēng)》《高端文學(xué)》）在品牌視覺設(shè)計(jì)上能夠更好的進(jìn)行拓展應(yīng)用、傳播差異化、與用戶情感共鳴。我們結(jié)合了三個(gè)系列課程的特點(diǎn)與對(duì)傳統(tǒng)文化的研究，分別為各個(gè)課程建立了代表性的元素作為超級(jí)符號(hào)，加強(qiáng)用戶的記憶點(diǎn)：
① 中國故事 —— 講述中華經(jīng)典
中國故事系列課程會(huì)通過詩、詞、歌、賦、散文、小說全類型文學(xué)作品，講述中華經(jīng)典。玉璽作為皇帝的玉印，是至高權(quán)力的象征，在各朝各代中見證了各色各樣的傳奇故事。因此選用【玉璽】作為中國故事的符號(hào)圖形。
四方采風(fēng)系列課程首次“走出屏幕”，采用文化直播結(jié)合外景采拍的形式，在歷史文化名城中講述各地的風(fēng)土人情。使用【中國古建筑】作為這一系列課程的超級(jí)符號(hào)，見證和反映了各地社會(huì)的發(fā)展和歷史變遷。
高端文學(xué)系列課程將帶領(lǐng)用戶學(xué)習(xí)重磅文學(xué)作品，該系列選用【卷軸】作為代表符號(hào)，卷軸不僅承載了國人對(duì)中國繪畫、書法的認(rèn)識(shí)，更是寫入了古人的思想與信念。
在確認(rèn)好三個(gè)系列的代表符號(hào)后，我們將構(gòu)圖一分為二，左邊作為系列的重點(diǎn)信息區(qū)域，右邊作為符號(hào)以及視覺表現(xiàn)區(qū)域。
濃墨淡彩，總相宜。
在視覺品牌的色彩方面，我們從古代寫意的濃墨重彩中，提取出了富有中國氣質(zhì)的一抹顏料。
歷史厚重的「紅」，風(fēng)光寫意的「綠」，靜心閱讀的「藍(lán)」代表了三個(gè)系列課程各自獨(dú)有的氣質(zhì)。
剛?cè)岵?jì)，行云流水。
我們依據(jù)行楷的筆畫特點(diǎn)，設(shè)計(jì)了三個(gè)系列的第一識(shí)別字體?！感锌菇橛诳瑫c行書之間，比端正的楷書多一分活潑自由，又比隨性的行書多一份端莊。我們?cè)诖诵锌撵`活中增添一抹穩(wěn)重，剛?cè)岵?jì)，恰到好處。
第二識(shí)別字體的設(shè)計(jì)靈感來源于印章。「印章」的歷史可以追溯到戰(zhàn)國，至今仍在生活中廣泛應(yīng)用，古人鑿銅刻玉，力艱功深，我們希望這種信念依舊可以傳承在青少年的品格中。受到印章印面形式的啟發(fā)，設(shè)計(jì)了第二識(shí)別字體。文字采用現(xiàn)代字體為基礎(chǔ)，增加辨識(shí)性。
清新淡雅，水天一色。
國畫，以其永恒的藝術(shù)魅力穿越時(shí)空。國畫的繪制講求布局、造型、運(yùn)筆、賦彩，不拘泥于自然物象的再現(xiàn)，強(qiáng)調(diào)主觀意境的創(chuàng)造，是中華民族傳統(tǒng)文化的瑰寶。我們借鑒了國畫中工筆畫的「留白」構(gòu)圖理念，并添加水墨畫中的「墨韻」作為細(xì)節(jié)補(bǔ)充，創(chuàng)作了既符合現(xiàn)代視覺風(fēng)格，又不失古韻的插畫；
最終，我們將提煉出的「符號(hào)」「色彩」「書法」「國畫」這四個(gè)關(guān)鍵詞融合在系列課程之中。
除了設(shè)計(jì)課程產(chǎn)品常規(guī)的講義以及線上頁面，為了進(jìn)一步提升用戶的沉浸式學(xué)習(xí)體驗(yàn)，有道博聞獨(dú)創(chuàng)了「手賬本」這一教輔材料，并且隨課程附贈(zèng)可以使用戶進(jìn)一步體驗(yàn)傳統(tǒng)藝術(shù)魅力的「國風(fēng)禮盒」。
「手賬本」可以幫助用戶將課上的知識(shí)融會(huì)貫通，并收入「手抄報(bào)」「旅行MAP」「作家名片」「思維導(dǎo)圖」等模塊，讓用戶深度參與到【輸入-加工-輸出】的產(chǎn)品結(jié)構(gòu)中，使用戶充分吸收課堂知識(shí)、加入自己的思考理解，并最終輸出觀點(diǎn)和總結(jié)。【聽-想-做】循環(huán)，鞏固知識(shí)印象。我們最終會(huì)收集用戶的優(yōu)秀作品，并集結(jié)成刊，出版成冊(cè)，進(jìn)一步提升用戶的參與度，增強(qiáng)他們的學(xué)習(xí)熱情。
在手賬本的視覺設(shè)計(jì)中，我們根據(jù)課程內(nèi)容繪制了精美插圖，考慮到用戶書寫的便捷性，設(shè)計(jì)了古風(fēng)的書寫外框，力求用戶可以時(shí)時(shí)刻刻沉浸在充滿國風(fēng)之美的課堂中，使視覺設(shè)計(jì)與教學(xué)內(nèi)容完美融合。
「國風(fēng)禮盒」將“長(zhǎng)見識(shí)，會(huì)思考，懂審美”的概念植入到禮盒的選品和包裝中。封面設(shè)計(jì)我們選用了「時(shí)空穿梭」的概念，通過時(shí)空隧道，串聯(lián)古今，大開眼界。禮品內(nèi)容里，充分尊重用戶的喜好，最終選取了「國畫顏料」「手繪扇子」「國風(fēng)筆記本」「考古盲盒」。每一份禮品，都充滿著我們對(duì)它的嚴(yán)格要求和對(duì)用戶參與的期待。
“古老的種子，它生命的胚芽蘊(yùn)藏于內(nèi)部，只是需要在新時(shí)代的土壤里播種?！?nbsp; ——泰戈?duì)?/em>
中華傳統(tǒng)文化正是一顆充滿驚喜和生機(jī)的種子，靜待著我們的細(xì)心發(fā)掘。我們會(huì)繼續(xù)探索，用設(shè)計(jì)在新時(shí)代中傳承優(yōu)秀傳統(tǒng)文化。讓傳統(tǒng)藝術(shù)擁抱青少年，讓東方美學(xué)成為青少年心中最引以為豪的文化。
本次有道博聞項(xiàng)目的設(shè)計(jì)過程中，我們牢記以用戶為中心的理念，做與課程產(chǎn)品融合的設(shè)計(jì)，最終收獲了一份寶貴的經(jīng)驗(yàn)，也獲得了用戶的一致好評(píng)和贊許。未來，設(shè)計(jì)團(tuán)隊(duì)也會(huì)堅(jiān)持做以用戶為中心的產(chǎn)品，傳達(dá)設(shè)計(jì)的力量。
相信種子，相信力量。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會(huì)分享國內(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)系。
作者： 有道LCT設(shè)計(jì)團(tuán)隊(duì) 來源：站酷
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(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ì)公司
顏色可以在很大程度上影響一件設(shè)計(jì)作品的調(diào)性和美觀性，要想抓準(zhǔn)一件設(shè)計(jì)作品的調(diào)性，選擇一個(gè)合適的色彩搭配組合尤為關(guān)鍵，為此，蔥爺花兩天時(shí)間整理了19大設(shè)計(jì)調(diào)性，多達(dá)160種配色方案，趕緊收藏起來以備不時(shí)之需吧。
1. 高端
視覺調(diào)性高端的色彩，通常具有明度低、飽和度低、顏色數(shù)量少等特點(diǎn)，所以很多高端的設(shè)計(jì)都會(huì)以深色作為背景色，因?yàn)樯钌@低調(diào)、更具神秘感，所以給人的感覺更高貴。然后以亞金色、銀色、桔紅色、白色等作為輔助色。
2.科技
想要表現(xiàn)科技感，色彩的整體調(diào)性通常會(huì)偏冷色系，明暗對(duì)比要強(qiáng)，且通常會(huì)使用漸變色。比如以深藍(lán)色到藍(lán)色的漸變作為背景色，然后用高飽和度、高亮度的青色和紫色作為輔助色，這時(shí)這些輔助色就會(huì)非常的跳躍，具有一種發(fā)光的效果。
3.時(shí)尚
其實(shí)所有調(diào)性的配色都應(yīng)該要盡量時(shí)尚一點(diǎn)，即使是想表現(xiàn)復(fù)古，也不能太土，所以這里所說的時(shí)尚特指偏向年輕、潮流的時(shí)尚。這種色彩通常具有飽和度高、明度適中、色相對(duì)比較大等特點(diǎn)。蔥爺這里概括了兩類，一類是以純色作為背景，這種色彩比較適合于品牌設(shè)計(jì)、網(wǎng)頁設(shè)計(jì)、畫冊(cè)設(shè)計(jì)等；一類是以漸變色作為背景，這種色彩比較適合于電商設(shè)計(jì)、廣告設(shè)計(jì)等。
4.酷炫
酷炫是指那種視覺效果特別張揚(yáng)、甚至是極具個(gè)性的色彩搭配，比如近幾年比較火的蒸汽波風(fēng)格、酸性風(fēng)格、賽博朋克風(fēng)格、故障風(fēng)格，其色彩就屬于酷炫類的。該類設(shè)計(jì)通常也是以深色作為背景，圖片元素會(huì)使用高飽和度且對(duì)比很強(qiáng)的漸變色，色彩相對(duì)較多。
5.好吃
即讓人感覺很有食欲的色彩搭配，這種色彩通常以暖色為主，比如紅色、橙色、黃色。飽和度較高、明度較低的組合方式通常用于餐飲行業(yè)；而飽和度較低、明度較高的色彩組合通常用于甜點(diǎn)、飲料等行業(yè)。
6.夏天
目前正值火熱的夏季，所以蔥爺專門整理了一些適合表現(xiàn)夏季的好看色彩，該類色彩通常會(huì)以藍(lán)色、青色、綠色這種冷色系最為主要顏色，然后以黃色或紅色、白色作為輔助色，這種色彩組合會(huì)給人清涼、快樂的感覺。
7.清新
小清新的視覺感受為輕松、柔和、淡雅，要達(dá)到這樣的效果，顏色的明度通常是比較高的，飽和度偏低，常用的顏色有淺青色、淺綠色、淺黃色、粉紅色等，在奶茶、女性護(hù)膚品的相關(guān)設(shè)計(jì)中比較常見。
8.快樂
快樂是張揚(yáng)的、是活潑的，所以快樂的色彩飽和度較高、明度不會(huì)太低、色彩的種類會(huì)比較多，通常也是以暖色為主，但是會(huì)搭配冷色一起使用。黃色具有很強(qiáng)的快樂、陽光屬性，所以想要表達(dá)快樂，黃色通常是少不了的。
9.可愛
跟兒童、年輕女性相關(guān)的設(shè)計(jì)，通常需要表現(xiàn)出可愛的調(diào)性，這類色彩通常是用冷色和暖色相互組合，顏色的明度同樣不會(huì)太低，否則會(huì)有壓抑的感覺，另外飽和度也不要過高，飽和度稍低一點(diǎn)效果會(huì)更柔和一些。
10.健康
想到健康我們立馬就會(huì)想藍(lán)天白云、青山、綠色的草地和樹葉，還有黃色的小野花等等，所以藍(lán)色、綠色、青色、黃色、白色都是常用于表現(xiàn)健康的色彩，紅色也可以偶爾作為點(diǎn)綴色加進(jìn)來。由于健康的調(diào)性也是要給人一種舒適、輕松的感覺，所以整體的顏色明度不要太低。
11.運(yùn)動(dòng)
要想讓色彩動(dòng)起來，對(duì)比一定要強(qiáng)，可以是色相對(duì)比、也可以是明度對(duì)比和飽和度對(duì)比。橙色和黃色是兩個(gè)很具活力的的顏色，所以常用于表現(xiàn)運(yùn)動(dòng)的設(shè)計(jì)里。
12.科幻
這是一些科幻電影、機(jī)動(dòng)游戲的海報(bào)設(shè)計(jì)常用的色彩搭配組合，給人的視覺感受是穩(wěn)重而大氣，科技感和神秘感并存，所以背景色通常也比較暗，喜歡用青色和黃色這種比較亮的顏色作為點(diǎn)綴。
13.喜慶
在設(shè)計(jì)節(jié)日海報(bào)或促銷海報(bào)時(shí)，通常需要表現(xiàn)出喜慶的調(diào)性，有些設(shè)計(jì)師會(huì)局限在大紅色、黃色、和橙色里，這樣搭配出來的色彩容易土，而想要解決這個(gè)問題，一方面可以加入冷色搭配使用，另一方面顏色的飽和度和亮度也不要過高。
14.復(fù)古
這類色彩的特點(diǎn)是顏色的飽和度會(huì)相對(duì)低一點(diǎn)，而且大多數(shù)情況下，整體的明度通常也不會(huì)太高，常用類比色搭配和對(duì)比色搭配。
15.中國風(fēng)
具有中國風(fēng)特色的顏色和色彩組合有很多，蔥爺這里僅列舉了8個(gè)組合。這類色彩同樣飽和度不會(huì)達(dá)到最高，有點(diǎn)復(fù)古和充滿文化氣息的感覺。胭脂（暗紅色）、緗色（中黃）、紺青（深藍(lán)色）、黛（褐色）等是中國風(fēng)常用的顏色。
16.夢(mèng)幻
夢(mèng)幻具有奇妙和神秘的感覺，好像在黑暗中找到了一點(diǎn)曙光，奇遇了驚喜一般，所以大多數(shù)情況下，背景色會(huì)使用從深色到亮色的漸變。顏色相對(duì)會(huì)比較豐富，而且以漸變色居多。
17.女性
女性是溫柔的，是感性的，所以該類色彩組合通常為類比色，偶爾會(huì)用一點(diǎn)對(duì)比色作為點(diǎn)綴，以增加畫面的活潑氣息，顏色的明度和飽和度都不能太低，當(dāng)然飽和度最好也不要過高，粉色、紫色是常用于表現(xiàn)女性的色彩。
18.優(yōu)雅
優(yōu)雅可以理解為低調(diào)、高級(jí)、溫和、安靜，所以這類色彩的對(duì)比通常不會(huì)太強(qiáng)，飽和度也會(huì)比較低，整體的色彩調(diào)性會(huì)偏中性，常用卡其色、麻色，還有單色組合及類比色組合。
19.經(jīng)典色彩組合
除了以上十八大調(diào)性，蔥爺還給大家推薦一些經(jīng)典的配色，很難把它們具體歸為哪一類，但是我們?cè)谧龊芏嘣O(shè)計(jì)時(shí)，用上這種配色總能得到不錯(cuò)的效果，比如紅黃黑、紅白藍(lán)、黃綠黑、等等，在很多平面海報(bào)設(shè)計(jì)中經(jīng)常能看到。
以上所列舉的色彩組合，矩形色塊為背景色，圓形色塊為畫面中圖片元素或文字使用的顏色。根據(jù)需要可以把其中的某些純色轉(zhuǎn)變?yōu)閱紊珴u變，或者也可以把某些單色漸變轉(zhuǎn)化為純色。另外，在不包含黑白灰的色彩組合里，仍可以根據(jù)需要自行加入黑白灰，比如用于填充文字的顏色。
當(dāng)然，能體現(xiàn)以上這些調(diào)性的顏色還有很多，大家可以自行補(bǔ)充，建立起自己的色庫。
標(biāo)題排版在畫冊(cè)設(shè)計(jì)中有著很關(guān)鍵的作用，標(biāo)題排得好可以讓整個(gè)版面的氣質(zhì)提升不少，反之亦然，而很多設(shè)計(jì)師在排畫冊(cè)的標(biāo)題時(shí)，通常都是單純選擇一個(gè)筆畫較粗的字體，把字號(hào)拉大與正文對(duì)齊，這種標(biāo)題的排版太過常規(guī)，容易導(dǎo)致整個(gè)版面缺乏設(shè)計(jì)感，比如下圖。
其實(shí)畫冊(cè)的標(biāo)題也能排出許多新意，本篇文章，蔥爺來給大家分享幾個(gè)可以給畫冊(cè)設(shè)計(jì)加分的標(biāo)題排版技巧。
01.描邊字錯(cuò)位組合
上圖是某院校招生畫冊(cè)的“學(xué)院簡(jiǎn)介”排版，由于太過講究對(duì)齊，缺少變化，所以顯得不夠靈活，我們可以把標(biāo)題的中英文詞匯拆開進(jìn)行錯(cuò)位排版，錯(cuò)位時(shí)要注意左右的平衡，另外，三行錯(cuò)位比起兩行錯(cuò)位的變化會(huì)更豐富一些。
單純只是做錯(cuò)位處理，效果并不怎么好，因?yàn)闆]有層級(jí)關(guān)系，所以可以再加上字號(hào)大小的變化，突出重點(diǎn)詞匯，弱化次要詞匯。
這樣層級(jí)豐富多了，但是眾多很粗很黑的字體擠在一起略顯壓抑，把其中部分詞匯改成描邊后，整體就變得更透氣、更有設(shè)計(jì)感一些了，注意描邊要細(xì)一點(diǎn)，以避免描邊的筆畫重疊在一起影響識(shí)別性和美觀性。
標(biāo)題排好以后，再根據(jù)標(biāo)題調(diào)整一下內(nèi)文、頁眉、頁碼的排版，內(nèi)文通常會(huì)對(duì)齊標(biāo)題中的某個(gè)字詞，但一邊對(duì)齊就好，不需要兩端都對(duì)齊，頁眉、頁碼可以作為裝飾來排版，填充一點(diǎn)顏色可以讓版面變得更活躍。
02.彩色標(biāo)題疊加灰色圖片
還是拿前面的那個(gè)案例舉例，把學(xué)校圖片換成一張沒有去底的矩形照片，然后把它處理成黑白色照，移動(dòng)至版面上方，標(biāo)題使用藍(lán)色壓住圖片的左上角，這時(shí)標(biāo)題就不是孤立的幾行文字了，而是與圖片形成了一個(gè)整體，這種排版方式在網(wǎng)頁設(shè)計(jì)中比較常見，用于畫冊(cè)的標(biāo)題排版，效果也是很不錯(cuò)的。
圖片做出血處理顯得更大氣，左下角的頁碼與標(biāo)題左對(duì)齊，可以加強(qiáng)版面的整體性和關(guān)聯(lián)性。
3.手寫體搭配黑體
同一個(gè)標(biāo)題我們通常只會(huì)使用一種字體（不包括英文），但有時(shí)候也可以試試用兩種字體搭配來使用，比如手寫字體搭配無襯線字體，這兩種字體在風(fēng)格上完全不一樣，對(duì)比非常強(qiáng)烈，能夠給版面帶來新意。
由于該中文標(biāo)題過于簡(jiǎn)短，所以搭配上英文會(huì)更豐富一些。
正文刻意與標(biāo)題進(jìn)行了錯(cuò)位排版，當(dāng)然，同時(shí)也保持著某些對(duì)齊關(guān)系，圖片的排版同樣如此，與正文錯(cuò)位，但與標(biāo)題左對(duì)齊，整個(gè)版面既靈活又很有序，符合學(xué)校畫冊(cè)的調(diào)性。
04.文字疊加色塊
加色塊是標(biāo)題設(shè)計(jì)中常用的手法，但如果只是用一個(gè)色塊把標(biāo)題包住，那么效果是比較普通的，很容易像促銷折頁的做法。所以我們可以只把色塊作為標(biāo)題的一個(gè)裝飾元素，用一個(gè)小小的色塊放在標(biāo)題后面，使其視覺上更豐富、更突出。
圖片的刻意錯(cuò)位很關(guān)鍵，如果圖片與正文兩端對(duì)齊，那么英文標(biāo)題、正文、圖片、頁碼都是沿著一條直線對(duì)齊的，整個(gè)版面就會(huì)變得生硬很多。
文字加色塊還有另一種效果也不錯(cuò)，即把文字色塊合并在一起做成補(bǔ)丁效果，首先把文字錯(cuò)位排版，然后分別給每一行文字加一個(gè)色塊把文字框住，色塊與色塊上下相連。
搭配上序號(hào)和英文標(biāo)題，豐富標(biāo)題的對(duì)比關(guān)系，使其更美觀、更有設(shè)計(jì)感，色塊可以根據(jù)需求適當(dāng)超出文字的長(zhǎng)度。
正文的排版我做了一點(diǎn)改變，把第一段單獨(dú)拿出來作為引文使用，剛好這段文字在內(nèi)容上也正好是起到提前說明的作用，這樣處理后這個(gè)版面也變得有了一些新意，標(biāo)題十分顯目。
05.手寫體跨版
在畫冊(cè)設(shè)計(jì)對(duì)于有些版面，可以排得大氣一點(diǎn)，比如把原本可以1P排完的內(nèi)容排成一個(gè)跨P，這時(shí)標(biāo)題也可以拉大跨版排列，這種做法可以加強(qiáng)文字的大小對(duì)比，也會(huì)有更多留白空間。
為什么用手寫體呢？宋體和黑體不行嗎？其實(shí)也可以，不過由于漢字的筆畫比較復(fù)雜，宋體和黑體又比較方正，所以拉太大排列時(shí)會(huì)顯得不夠靈活，如果是英文則會(huì)好一些，所以在排版的時(shí)候我還做了了傾斜與裁剪處理，并且搭配了英文進(jìn)行錯(cuò)位排版，不然會(huì)顯得過于單調(diào)。
06.標(biāo)題與正文左右排版
在豎版的畫冊(cè)中，我們通常喜歡把標(biāo)題排在正文的上方，而如果把標(biāo)題與正文左右擺放，那么又會(huì)有種不一樣的感覺。
但不要把標(biāo)題與正文水平對(duì)齊，那樣的話標(biāo)題的空間就過小了，會(huì)顯得很壓抑，而是要把標(biāo)題放在正文的左上方，并保持某些對(duì)齊關(guān)系。
如果把這種排版方式看成是分欄網(wǎng)格，那么它屬于不對(duì)稱網(wǎng)格，即正文欄應(yīng)該比標(biāo)題欄更大一些，以保證有足夠大的空間排列正文內(nèi)容。標(biāo)題欄可以有大量留白，頁腳可以與標(biāo)題形成呼應(yīng)，豐富版面的細(xì)節(jié)。
07.扭曲標(biāo)題
這種標(biāo)題處理手法在海報(bào)設(shè)計(jì)中比較常見，其實(shí)國外很多畫冊(cè)也這么做，效果很酷，沖擊力很強(qiáng)。
用中文來做這種效果行不行呢？也可以，不過不適合太嚴(yán)肅的畫冊(cè)，用在設(shè)計(jì)類和時(shí)尚類的畫冊(cè)中會(huì)比較合適，比如前面列舉過的設(shè)計(jì)書籍的排版。
由于文字較多，所以進(jìn)行分行錯(cuò)位處理，然后在頂部菜單欄中選擇對(duì)象-封套扭曲-用網(wǎng)格建立，把網(wǎng)格參數(shù)設(shè)置為3行5列。
移動(dòng)網(wǎng)格的錨點(diǎn)使文字呈波浪形，如下圖。
拉拽錨點(diǎn)左右兩邊的手柄使波浪形變得柔和一點(diǎn)。
波浪效果做得差不多后，按快捷鍵E調(diào)出自由變換工具面板，并選擇自由扭曲工具，把標(biāo)題扭曲成如下效果。
再調(diào)整一下細(xì)節(jié)，然后把它放在版面中，把內(nèi)容篇章的序號(hào)處理成描邊樣式與標(biāo)題疊加在一起，可以起到裝飾的作用。
扭曲的標(biāo)題搭配上鮮艷一點(diǎn)的顏色，效果會(huì)更時(shí)尚，對(duì)于這種版面，正文也不要排得過于規(guī)矩，所以，我刻意把版面中的兩張圖片做了錯(cuò)位處理。
08.打散排列
通常我們會(huì)把標(biāo)題文字集中排放，但對(duì)于設(shè)計(jì)和時(shí)尚類畫冊(cè)，我們可以打破傳統(tǒng)的做法，把標(biāo)題做適當(dāng)?shù)姆稚⑴虐?，效果也很不錯(cuò)，當(dāng)然，標(biāo)題文字如果太少就不合適了。
另外，為了使標(biāo)題更特別 ，給文字加上下劃線效果會(huì)更好，并且下劃線可以根據(jù)需求適當(dāng)延長(zhǎng)，以加強(qiáng)這些分散文字的關(guān)聯(lián)性，甚至還可以加上英文做裝飾。
正文的排版與標(biāo)題文字左右兩端保持對(duì)齊。
設(shè)計(jì)是一個(gè)不斷嘗試、調(diào)整的過程，排標(biāo)題同樣也是如此。另外，標(biāo)題的排版固然是很重要的，但是想要整體效果得到比較大的改善，正文、圖片、頁眉、頁腳、頁碼的配合也很重要，永遠(yuǎn)要把整體的大效果擺在第一位。
隨著各大智能廠商對(duì)用戶行為數(shù)據(jù)的收集積累，拆分提煉出了不同場(chǎng)景下用戶的特定需求，相比以前的大而全臃腫的功能界面，現(xiàn)在的功能、信息更加精確，產(chǎn)品將不同場(chǎng)景下的解決方案為用戶提前準(zhǔn)備好，用戶只需要簡(jiǎn)單的選擇就好，更加人性便捷：
B&O音箱面向的人群是音樂發(fā)燒友，他們對(duì)音樂有獨(dú)到的理解，為了為用戶提供便捷合乎口味的音樂，B&O將歌曲類型與顏色情感相結(jié)合，分別是：黃色代表愉快的歌曲、紅色代表激情的歌曲、紫色代表憂郁的歌曲、藍(lán)色代表輕松的歌曲。用戶只需要選擇顏色就可以播放相應(yīng)風(fēng)格的音樂，給用戶濃烈的感性藝術(shù)氣息。
并且B&O將音樂播放場(chǎng)景做了細(xì)分：只收聽自己收藏的歌曲、收聽與自己品味相似的歌曲、隨便聽聽；這三個(gè)場(chǎng)景下的需求通過三層圓環(huán)來滿足：點(diǎn)擊外環(huán)區(qū)域播放全網(wǎng)歌曲、點(diǎn)擊中環(huán)區(qū)域播放與用戶收藏相似的歌曲、點(diǎn)擊內(nèi)環(huán)區(qū)域播放用戶收藏的歌曲。這種感性的操作方式省去了搜索歌曲的過程，極大的提高了便捷性。
我們先了解一下三星智能冰箱1.0的系統(tǒng)是什么樣的，首頁包含時(shí)間、天氣顯示、音樂播放、購物清單、備忘錄、相冊(cè)、留言板、設(shè)備控制，用戶在冰箱面板上什么都能做，整體感覺是一個(gè)臃腫的功能集合。
在2.0中，三星將用戶使用場(chǎng)景做了以下的細(xì)分：烹飪模式、日常模式、娛樂休閑模式、家庭管理模式；在烹飪場(chǎng)景下，為用戶展現(xiàn)菜譜，用戶可以專注的去研究飯菜制作方法；在日常場(chǎng)景下，為用戶提供日歷、照片墻、留言板、日程等日常生活相關(guān)信息；娛樂場(chǎng)景下，用戶可以在廚房一邊忙碌一邊聽音樂，還可以查看社交消息，所有的功能都是圍繞娛樂休閑；家庭管理場(chǎng)景下，全職媽媽可以一邊做著飯，一邊看著監(jiān)控屏幕上兒童房孩子的情況及全屋的安防情況，也可以控制家中的設(shè)備。
場(chǎng)景細(xì)分可以有重點(diǎn)的為用戶提供他們真正需要的服務(wù)，讓用戶感受到產(chǎn)品帶來的貼心感。
Orvibo根據(jù)用戶使用燈光的習(xí)慣，按照用戶對(duì)于光線的需求程度，將燈光使用場(chǎng)景分為：夜晚光線昏暗需要明亮的光照、白天光線充足不需要燈光、休閑時(shí)需要柔和些的光線、閱讀需要不刺眼但明亮的光線、起夜時(shí)微弱的輪廓照明即可。為用戶提供每種場(chǎng)景下的照明方案，準(zhǔn)確快速的滿足用戶不同的需求。
小米根據(jù)用戶對(duì)于空調(diào)各個(gè)功能的操作頻率，羅列出核心功能：開關(guān)、溫度調(diào)節(jié)、冷熱模式，界面中只體現(xiàn)這幾種種信息，將低頻功能隱藏起來，為視覺降噪，突出核心功能，提升了用戶操控效率。
針對(duì)那些上班中不方便看手機(jī)、穿好衣服正要出門、旅游到達(dá)當(dāng)?shù)鼐频晷枰匆谎厶鞖鉅顩r的場(chǎng)景，WOM提供了簡(jiǎn)潔直觀的設(shè)計(jì)方案，產(chǎn)品顯示區(qū)域只保留4種常見天氣類型，高亮的天氣icon代表當(dāng)前的天氣狀況，當(dāng)天氣將要發(fā)生變化時(shí)，相應(yīng)的天氣icon會(huì)閃爍。
此外，通過利用顏色來傳達(dá)不同的溫度，藍(lán)色代表0℃，白色代表10℃，黃色代表20℃，紅色代表30℃，在不需要手機(jī)的情況下為用戶提供了豐富的展現(xiàn)形式。
隨著手機(jī)的普及，家庭對(duì)于電視的需求已不完全是為了收看節(jié)目，往往一個(gè)禮拜也看不了幾回。三星基于這種情況為了延續(xù)電子屏幕的銷量，賦予了電視裝飾屬性，演變?yōu)榧冋故镜碾娮赢嬁?，用戶可以選擇各種風(fēng)格的肖像或風(fēng)景圖片進(jìn)行輪播展示，扮演藝術(shù)裝飾畫的角色，從而滿足用戶日常家庭裝飾需求。
在設(shè)計(jì)中融入圖片，將操作、狀態(tài)可視化，這些具象的形式可以讓用戶快速理解并操作，讓我們看看各大智能產(chǎn)品廠商是如何實(shí)施的：
大多數(shù)智能設(shè)備買回家后，需要用戶自己安裝，有的甚至牽扯到線路問題，Nest溫控器安裝界面采用與實(shí)物一致的模型元素，讓用戶有參照依據(jù)；通過零部件的運(yùn)動(dòng)告訴用戶安裝順序；通過放大細(xì)節(jié)，告訴用戶應(yīng)該選哪一個(gè)部件及如何鏈接。讓用戶有更好的參與感、成就感，還可以降低公司的人力安裝成本、客服成本。
小米智能家居電視背景運(yùn)用實(shí)物圖片，給用戶營造家庭的氛圍，設(shè)備卡片icon運(yùn)用半寫實(shí)風(fēng)格，和實(shí)際產(chǎn)品一一對(duì)應(yīng)，便于用戶快速查找設(shè)備；卡片底部體現(xiàn)設(shè)備狀態(tài)，精簡(jiǎn)的卡片信息使得設(shè)備的狀態(tài)更容易被用戶感知到。
三星、蘋果都運(yùn)用圖片作為系統(tǒng)的背景，可以很好的和用戶拉近距離，通過白色或磨砂卡片與背景做區(qū)分，三星的設(shè)備icon采用多彩漸變風(fēng)格，和它趨于年輕化、時(shí)尚個(gè)性的品牌戰(zhàn)略方向保持一致。
由于洗衣機(jī)、烤箱、冰箱的運(yùn)行模式和用戶想要洗的衣物類型、材質(zhì)、烹飪的食物類型、儲(chǔ)藏的食物類型有強(qiáng)關(guān)聯(lián)，Whirlpool運(yùn)用圖片作為模式背景，將功能和物品類型結(jié)合，用戶可以直觀感性的理解和區(qū)分各個(gè)功能，從而快速做出選擇。
Orvibo在大屏智能面板的設(shè)計(jì)上大量使用圖片元素，不僅可以區(qū)分各個(gè)功能模塊，還增添了內(nèi)容的豐富性，要知道智能面板的首屏和設(shè)備控制列表頁功能是不一樣的，它是用來承接并向用戶展示房間內(nèi)各個(gè)信息的，房間圖片作為背景烘托出家的氛圍，每個(gè)房間頁面的左上角顯示屋內(nèi)溫度、濕度、當(dāng)前開啟的設(shè)備類型及數(shù)量，很直觀的向用戶展示屋內(nèi)信息。
每個(gè)場(chǎng)景都用具體的圖片作為卡片背景，可以讓用戶預(yù)想到每個(gè)場(chǎng)景對(duì)應(yīng)的運(yùn)行效果。有的場(chǎng)景卡片中體現(xiàn)所屬房間信息，告訴用戶該場(chǎng)景只聯(lián)動(dòng)運(yùn)行特定區(qū)域的設(shè)備。
運(yùn)用圖片會(huì)有以下問題：1、找到能體現(xiàn)各個(gè)特定功能的圖片增加了人力成本；2、圖片的多樣性容易打破畫面的整體統(tǒng)一感。所以要結(jié)合公司的現(xiàn)狀克制的運(yùn)用圖片。
Amazon的監(jiān)控設(shè)備卡片背景外顯了房間內(nèi)的監(jiān)控畫面，用戶在設(shè)備列表界面就可以直觀的看到監(jiān)控區(qū)域的信息，強(qiáng)調(diào)了用戶關(guān)注的內(nèi)容，縮短了操作步長(zhǎng)。
通常，我們?cè)O(shè)置時(shí)間時(shí)，系統(tǒng)會(huì)給我彈出時(shí)間選擇控件，需要我們上下滑動(dòng)設(shè)置；Lenovo Smart Clock的做法是將時(shí)、分的設(shè)置具象成了時(shí)鐘實(shí)際運(yùn)行的圓形軌跡，與用戶對(duì)于時(shí)間的認(rèn)知保持一致，很貼心的設(shè)計(jì)，這種方式非常值得我們學(xué)習(xí)。
Google Nest Hub 將傳統(tǒng)的定時(shí)列表具象成了一個(gè)個(gè)正在倒計(jì)時(shí)的時(shí)鐘，用戶可以更直觀的每個(gè)定時(shí)的狀態(tài)。點(diǎn)擊某個(gè)定時(shí)卡片可以快速的進(jìn)行暫停或刪除操作。
小米空氣凈化器界面，每一檔空氣質(zhì)量值都對(duì)應(yīng)不同的顏色，并且將顏色延續(xù)到了其他操控按鈕，讓用戶對(duì)當(dāng)前空氣質(zhì)量有更強(qiáng)的感知；凈化器被關(guān)閉時(shí)，顯示區(qū)域、控制區(qū)域置灰，明確告知用戶設(shè)備狀態(tài)及可操作區(qū)域。
房屋面積大，會(huì)有很多的設(shè)備與多個(gè)網(wǎng)關(guān)連接，家中與網(wǎng)關(guān)連接的智能設(shè)備有時(shí)候會(huì)連接中斷，具體哪個(gè)設(shè)備與哪個(gè)網(wǎng)關(guān)中斷了不容易被查清。三星SmartThings將設(shè)備與網(wǎng)關(guān)的連接情況可視化，可以向用戶直觀的反映出哪個(gè)設(shè)備連接出了問題。
通過利用不同形式的手勢(shì)操控，讓用戶和產(chǎn)品的交互過程更新穎更便捷。要注意的是雖然手勢(shì)不需要操控物理按鍵，但手勢(shì)操控的形式要建立在用戶已有認(rèn)知習(xí)慣之上，請(qǐng)看以下案例：
最左邊的圖為行程信息截屏操作，目前截圖方式有幾個(gè)按鍵一起按下的，也有手機(jī)背面敲擊三下的，這些都需要與設(shè)備接觸，接觸交互的過程就需要花費(fèi)用戶更多的時(shí)間，LG通過雙手捏合截圖的形式體現(xiàn)現(xiàn)實(shí)中“抓取”的語義，用戶使用起來順其自然，瞬間就可以完成截圖的目標(biāo)。
中間的圖為應(yīng)用快速切換操作，用戶只需要對(duì)著屏幕做揮手動(dòng)作，就可以切換至下一個(gè)應(yīng)用，這個(gè)隔空操控的手勢(shì)核心使用場(chǎng)景是：當(dāng)你正在廚房，手上沾著面粉或其他東西時(shí)，需要操控手機(jī)又不想弄臟手機(jī)，那么隔空操作就可以解決這一痛點(diǎn)。
最右邊的圖為多媒體音量調(diào)節(jié)，只需要作出旋鈕的動(dòng)作，就可以實(shí)現(xiàn)音量的控制，是不是覺著很Cool。這種新的控制形式可以讓用戶加深對(duì)產(chǎn)品的印象。
在Google Nest Hub的音樂播放界面，當(dāng)你想開啟或暫停音樂播放，只需要手掌隔空朝著屏幕方向做按壓動(dòng)作，就可以快速觸發(fā)相應(yīng)功能，這種方式讓用戶會(huì)感覺很爽，自己就像有了魔力。
早上鬧鐘響起時(shí)，需要用戶選擇關(guān)閉鬧鐘還是稍后提醒，常見的情景是，用戶睜開眼伸手去點(diǎn)擊某個(gè)選項(xiàng)，會(huì)干擾想要接著睡的用戶。Google Nest Hub在此處增加了隔空操控手勢(shì)，用戶如果想關(guān)閉鬧鐘，只需要閉著眼，手掌朝著屏幕一揮手，就可以搞定了，有沒有被寵愛的感覺。
蘋果用戶如果想將手機(jī)上正在聽的歌曲通過HomePod播放，只需要將手機(jī)靠近HomePod，就可以輕松完成音樂投射，整個(gè)過程就像將一個(gè)容器的內(nèi)容倒入到另一個(gè)容器內(nèi)，既充滿趣味性又大大簡(jiǎn)化了音樂播放設(shè)備切換的過程。
通過設(shè)計(jì)語言為用戶提供更多的視覺風(fēng)格，甚至開放編輯權(quán)限讓用戶更自由的制定自己喜歡的形式，這些都可以滿足用戶的個(gè)性化需求及專屬感，請(qǐng)看以下案例：
Sony HUIS遙控器為用戶提供了最大限度的自主編輯權(quán)，用戶可以從后臺(tái)設(shè)定每個(gè)按鍵的形式及功能，也可以在屏幕中設(shè)置戶型圖，方便控制對(duì)應(yīng)的設(shè)備。
甚至可以繪制只有自己理解的專屬圖案，大大提升了專屬感。
用戶具有喜新厭舊的心理，三星智能冰箱為用戶提供了豐富的屏保：有沒有任何信息展示的抽象幾何藝術(shù)畫風(fēng)格、有配合溫度展示的春夏秋冬風(fēng)格、有簡(jiǎn)潔素雅的時(shí)間顯示風(fēng)格、還有照片背景墻風(fēng)格；兼顧了用戶日常裝飾和功能的需求。
Lenovo Smart Clock對(duì)于時(shí)鐘屏保為用戶提供了不同的風(fēng)格，涵蓋了大多數(shù)的人群風(fēng)格喜好：活潑跳躍、實(shí)用直觀、極簡(jiǎn)現(xiàn)代、抽象藝術(shù)、純文字、純數(shù)字等
甚至在同一種風(fēng)格中再細(xì)分為多種色彩搭配方案供用戶選擇?？梢哉f想盡辦法來滿足用戶的個(gè)性化需求。
這里的統(tǒng)一設(shè)計(jì)語言有兩個(gè)方面：一、同一個(gè)功能在不同的智能設(shè)備上布局要一致；二、同一類設(shè)備在APP中的功能布局要一致；操控邏輯統(tǒng)一指的是：產(chǎn)品中設(shè)備的操控方式要和用戶對(duì)實(shí)際設(shè)備的認(rèn)知一致。一致性可以降低學(xué)習(xí)成本，提升更穩(wěn)定的操控體驗(yàn)。請(qǐng)看以下案例：
Nest溫控器及ecobee溫控器在設(shè)備上的設(shè)計(jì)語言和App上的保持一致，方便用戶在多端設(shè)備上的無縫操控體驗(yàn)。移動(dòng)端與智能設(shè)備界面唯一不同的是，移動(dòng)端，同一層級(jí)上展示的功能入口更多，適合更復(fù)雜的操作；
在移動(dòng)端設(shè)置智能面板功能按鍵的界面中，Orvibo將按鍵列表做成與實(shí)物一致的樣式，便于用戶快速找到對(duì)應(yīng)的按鍵進(jìn)行設(shè)置，這是提升智能家居一致體驗(yàn)常見的方式。
在智能家居App中，由于功能種類繁多、內(nèi)容不確定等因素，承載它們的卡片在布局設(shè)計(jì)上面臨很大挑戰(zhàn)，需要兼容各種功能、還要保證卡片的整體一致性及合理的屏效比；在SmartThings智能家居控制系統(tǒng)中，三星對(duì)功能卡片進(jìn)行了統(tǒng)一的部署，卡片左上角為功能名稱，左下角為狀態(tài)信息，右下角區(qū)域?yàn)椴倏貐^(qū)，并且還考慮了只有功能控制沒有狀態(tài)、只有信息沒有功能控制情況下卡片的拓展形式。充分保證了操控的一致體驗(yàn)。
在調(diào)光燈的操作邏輯里有這么個(gè)問題：是將亮度值調(diào)至0%關(guān)閉燈光還是需要一個(gè)單獨(dú)的開關(guān)按鈕。看看Google是怎么做的，它將調(diào)光區(qū)域與燈的開關(guān)做了區(qū)分，也就是說亮度通過調(diào)光區(qū)域操作最低為1%，需要通過開關(guān)按鈕進(jìn)行關(guān)閉；這樣做的好處是操作邏輯明確，并且當(dāng)用戶在80%亮度下關(guān)閉燈光，下次開啟時(shí)還是80%的亮度，更加人性。
發(fā)表一下個(gè)人的心得，內(nèi)容是關(guān)于如何選擇正確的產(chǎn)品提升方法，目前網(wǎng)上各平臺(tái)的智能產(chǎn)品界面有很多，然而大多都是不落地的概念稿，里面的設(shè)計(jì)稿由于沒有具體場(chǎng)景及需求的約束，大多都無法解決公司實(shí)際項(xiàng)目中的問題，經(jīng)常瀏覽僅能提升個(gè)人審美。只有平時(shí)通過對(duì)各行業(yè)實(shí)際落地產(chǎn)品的搜集積累和分析，才能發(fā)現(xiàn)它們?cè)谔嵘a(chǎn)品體驗(yàn)道路上的共通點(diǎn)、差異點(diǎn)，從而為公司提供真正有價(jià)值的設(shè)計(jì)方案。
三星上一版本界面標(biāo)題選用細(xì)體字，頭部區(qū)域留白，卡片功能區(qū)域小，背景選用寫實(shí)簡(jiǎn)約照片，體現(xiàn)文藝感。
圓形的場(chǎng)景卡片與矩形的設(shè)備卡片形成對(duì)比，場(chǎng)景卡片與文字上下排列，更加凸顯場(chǎng)景圖片，但文字存在多行、單行顯示，這種表現(xiàn)方式會(huì)顯得凌亂。
設(shè)備卡片從上到下依次為圖標(biāo)、設(shè)備名、狀態(tài)。
新版本標(biāo)題選用粗體字，標(biāo)題區(qū)域更加緊湊，功能區(qū)域展示空間變大，背景使用抽線雙色漸變，更現(xiàn)代時(shí)尚。
功能卡片為統(tǒng)一圓角矩形，場(chǎng)景卡片圖文左右排布，底部白色卡片區(qū)域可以很好兼容多行、單行文字的情況。
設(shè)備卡片從上到下依次為圖標(biāo)、房間名、設(shè)備名、狀態(tài)。
底部新增Tab區(qū)域，細(xì)分為收藏、設(shè)備、生活、自動(dòng)化、菜單5個(gè)模塊。
風(fēng)格布局總結(jié)：新版本屏幕利用率更高，粗體字和抽象背景使得內(nèi)容更凸顯，底部的Tab提供了更多模塊入口，功能分類更合理。
舊版本只有一個(gè)首頁，功能都在此被分發(fā)，并且功能較為單一。
新版本增加收藏、設(shè)備、生活、自動(dòng)、更多模塊，對(duì)用戶使用場(chǎng)景做了細(xì)分。
界面頂部的房屋設(shè)置、添加、編輯為全局設(shè)計(jì)，不過在每個(gè)模塊中添加的內(nèi)容不同。
收藏作為用戶每次進(jìn)入App的第一屏，說明是用戶常用的重要功能，在收藏模塊中，可以添加的內(nèi)容最多，用戶在此頁面可以完成大多數(shù)常用操作。
設(shè)備模塊是全屋設(shè)備的合集，自動(dòng)模塊是場(chǎng)景、自動(dòng)化的合集。
生活模塊主要提供家庭安全監(jiān)控信息，還可接入其他服務(wù)，例如：智能家電監(jiān)控、智能烹飪服務(wù)。
新版本設(shè)備卡片主要由設(shè)備圖標(biāo)、房間名、設(shè)備名、狀態(tài)、控制區(qū)構(gòu)成；房間名域?yàn)轭A(yù)留區(qū)，保證在不同頁面下的統(tǒng)一性。
設(shè)備在離線狀態(tài)下，右上角會(huì)顯示離線圖標(biāo)，代替控制按鈕。
只有我們提前羅列出更多的頁面顯示情況，整合并預(yù)留可變區(qū)域，才能使頁面更統(tǒng)一。
收藏模塊分為3大區(qū)域，區(qū)域1為狀態(tài)通知區(qū)；區(qū)域2為收藏的場(chǎng)景區(qū)；區(qū)域3為收藏的服務(wù)或設(shè)備。這3個(gè)區(qū)域展示順序是固定的，可以選擇是否展示，無法改變展示順序。
因?yàn)槊總€(gè)區(qū)域的卡片尺寸是不一樣的，區(qū)域固定的好處是，可以保證顯示的統(tǒng)一性。否則大小卡片穿插顯示，還可能會(huì)空缺幾個(gè)，很影響美觀。并且操控邏輯也是固定的，用戶更容易理解。
點(diǎn)擊收藏模塊右上角添加，可批量選擇內(nèi)容快速添加收藏。
在非收藏頁，長(zhǎng)按卡片，可單獨(dú)添加收藏內(nèi)容。
在設(shè)備、場(chǎng)景等新建或編輯界面，可以選擇添加至收藏的選項(xiàng)。省去了后續(xù)的單獨(dú)添加動(dòng)作。
在收藏頁，長(zhǎng)按卡片，可以進(jìn)行單獨(dú)移除操作。
在收藏編輯頁面，可以批量快速移除移除。滿足了不同的用戶需求。
首次進(jìn)入，展示的是某個(gè)房間內(nèi)的設(shè)備，通過左右滑動(dòng)進(jìn)行切換房間，三星可能想為用戶提供模糊操作來提升效率，在房間少的情況下，這種方式比較好。當(dāng)房間多了，用戶會(huì)滑動(dòng)多次才能到目標(biāo)房間；當(dāng)然三星給出了針對(duì)精確選擇的方式，點(diǎn)擊左上角的房間入口，可以選擇、編輯房間。
房間多的情況下這2種方式都不是很好的解決方案。
這里要注意的是，三星把“沒有房間”也放進(jìn)房間列表，供用戶選擇?，F(xiàn)實(shí)中，有好多設(shè)備是不屬于任何房間或者用戶暫時(shí)不想放到某個(gè)房間，增加無房間選擇可以更靈活的滿足實(shí)際使用場(chǎng)景。
在房屋編輯頁面，可以添加房間，在這里三星已經(jīng)為用戶預(yù)設(shè)了很多房間類型選項(xiàng)，用戶只需要做選擇，很方便，即使沒有要的，還可以在列表底部選擇自定義。
在設(shè)備頁面，只能添加設(shè)備、燈光組、監(jiān)控組。
用戶可以通過關(guān)鍵詞搜索、掃碼、設(shè)備類型篩選、品牌篩選進(jìn)行設(shè)備添加。
很全，幾乎涵蓋了所有的添加方式。
在添加頁面，第一步要先填寫組的名稱、選擇所在房間，第二步選擇要合并的燈，添加完成跳轉(zhuǎn)至設(shè)備組詳情，方便立即調(diào)控。
設(shè)備控制頁面采用了模塊化的設(shè)計(jì)方式，控制區(qū)域均為列表形式，不同的設(shè)備只需要替換圖標(biāo)和文字及對(duì)應(yīng)的操控列表，降低新設(shè)備重新創(chuàng)作新界面的設(shè)計(jì)成本。
長(zhǎng)按設(shè)備卡片，選擇目標(biāo)房間，可完成單個(gè)設(shè)備轉(zhuǎn)移。
選擇設(shè)備頁面右上角的移動(dòng)方式，可以批量進(jìn)行設(shè)備的轉(zhuǎn)移。
自動(dòng)模塊包含場(chǎng)景、自動(dòng)化、第三方設(shè)備，它們不具備房間屬性；
點(diǎn)擊右上角的箭頭可以展開或收起對(duì)應(yīng)列表，方便查找內(nèi)容。
第一步，先填寫場(chǎng)景名稱、選擇圖標(biāo)、是否要添加到收藏；
第二步，選擇執(zhí)行的設(shè)備，可以根據(jù)設(shè)備名稱、房間名稱進(jìn)行快速定位，并且可以批量選擇設(shè)備；
第三步，設(shè)備添加成功后，根據(jù)需要，單獨(dú)對(duì)設(shè)備執(zhí)行狀態(tài)設(shè)置。
新建場(chǎng)景的邏輯是：先批量選擇要執(zhí)行的設(shè)備，再單獨(dú)設(shè)置執(zhí)行內(nèi)容。
這種方式的好處是，不易打斷用戶的設(shè)置思路，還可以減少操作步長(zhǎng)。
新建自動(dòng)化界面分為觸發(fā)條件、執(zhí)行內(nèi)容兩大塊；
初始狀態(tài)會(huì)為用戶提供使用描述，便于用戶操作。
可以通過時(shí)間的變化、設(shè)備狀態(tài)變化、位置變化、天氣變化、安防變化來觸發(fā)執(zhí)行命令。
將設(shè)備狀態(tài)變化作為觸發(fā)條件時(shí)，設(shè)置邏輯是，完成一個(gè)設(shè)備的設(shè)置才能設(shè)置下一個(gè)，不能批量選擇。為什么和新建場(chǎng)景的流程不一樣？可能是因?yàn)樵谠O(shè)置執(zhí)行條件時(shí)，用戶心智里認(rèn)為設(shè)備和狀態(tài)聯(lián)系更緊一些，并且條件種類不會(huì)太多。
當(dāng)添加了一個(gè)以上的設(shè)備作為觸發(fā)條件時(shí)，界面會(huì)顯示“同時(shí)滿足或滿足任何一個(gè)”的選項(xiàng)。
執(zhí)行內(nèi)容可以是控制設(shè)備、通知給用戶、運(yùn)行場(chǎng)景、改變安防模式。
可以批量選擇設(shè)備，并且可以設(shè)置執(zhí)行延遲時(shí)間、自動(dòng)復(fù)位，滿足用戶不同需求。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會(huì)分享國內(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)系。
作者：土木君 來源：站酷
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(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://www.yvirxh.cn