大家好，今天給大家?guī)淼氖桥渖韶浵盗兄谌冢?！超級干貨?。?

前兩期地址傳送門：

1）用我這套方法，配出來的顏色很難不高級！

2）我常用的3個配色方法，搞定專家級配色！

前面兩期，主要分享審美的培養(yǎng)與提升、配色的技巧與習(xí)慣。本篇更為實(shí)在，主要分析有哪些經(jīng)典的萬金油配色組合，滿足日常工作使用。

看完這篇文章，相信你對色彩的掌握，能更深一步~~干貨建議提前收藏！喜歡記得給咱們公眾號添加星標(biāo)喔~~

1）經(jīng)典搭配-黃配黑 

色板 顏色組合 

Yellow & Black

黃配黑的色系非常經(jīng)典耐看，普適度也很廣。我在公眾號里寫的一些文章，也經(jīng)常采用這套配色。

這套黃與黑的組合很適合一些生活、社區(qū)、人文、情感等場景進(jìn)行使用，情緒溫和。如果你的設(shè)計(jì)，會被頻繁的在這些場景里進(jìn)行使用，那么不妨使用一下這套黃黑配色試試看。

比如以下這些案例：

這里也給出我經(jīng)常使用的兩組黃黑色板，一組更為活潑鮮艷，更具娛樂化。一組更為內(nèi)斂，充滿文化氣息。

推薦組合色板①：

推薦組合色板②：

2）科技搭配-藍(lán)黑白 

色板 顏色組合 

Blue & Black

這套色彩就不多說了，藍(lán)色可以說是我非常喜歡的顏色之一了。從咱們公眾號的logo，還有日常發(fā)文的封面，相信大家就能感受到。

藍(lán)黑白搭配，可以說顏色是百看不膩，并且藍(lán)色色相偏冷，沒那么多情緒傾向，所以更能夠讓人心平氣和的閱讀信息，提升效率。因此也經(jīng)常被用到科技、數(shù)據(jù)、社交、工具等應(yīng)用場景。

比如以下幾組案例：

關(guān)于藍(lán)黑白，我也給大家推薦兩組我很喜歡的色號組合。一組更為明亮，顯得年輕活潑些，而另外一組則更加深沉商務(wù)，更為內(nèi)斂。

推薦組合色板③：

推薦組合色板④：

3）CP組合-紅藍(lán)配 

色板 顏色組合 

Red & Blue

這套顏色組合，在近幾年可以說是非常流行了。顏色比較淺的，有經(jīng)典的馬卡龍色組合，被廣泛運(yùn)用到年輕社交等工具場景。而顏色重點(diǎn)的，直播娛樂等秀場平臺，也都大量可見其身影。

紅藍(lán)搭配，顏色的相撞導(dǎo)致色彩充滿了熱情與朝氣，社交娛樂化產(chǎn)品的場景，非常適合這套色彩組合。

比如下面這些案例：

這里也給大家分享兩套紅藍(lán)搭配的色板，一套略顯溫柔，另外一套則熱情如火。

推薦組合色板⑤：

推薦組合色板⑥：

4）經(jīng)典國潮-赤金組合 

色板 顏色組合 

Yellow & Black

這幾年國潮風(fēng)格也越來越受到大眾所喜愛，而在國潮色彩的搭配中，赤色與金色的搭配。一方面紅色中國味特色濃厚，而搭配上高檔的金色，瞬間濃厚的精致國民畫風(fēng)，就出來了。

比如每年的集五福，就是非常經(jīng)典的赤金組合，精致的同時，還非常接地氣兒。

關(guān)于赤金，我也從潘通色里挑選出了一組很經(jīng)典高檔的色彩組合，色板色號也分享給大家。

推薦組合色板⑦：

推薦組合色板⑧：

5）尊顯高貴-黑金色 

色板 顏色組合 

Yellow & Black

黑金組合相比其它顏色更顯高貴，在很多知名的APP里面，也都是能看得到，比如淘寶的88vip，京東金融的小金庫。這套色彩組合往往代表著商務(wù)、尊貴，高級，既內(nèi)斂又隱蔽，通常被用到各類會員、金融等尊貴體系中。

比如以下這些案例

關(guān)于黑金里面的金色，也分為兩種，一種顏色更為純金，還有種偏向于玫瑰金，玫瑰金的色彩相對要更溫和一些，沒那么冰冷。這兩套色板，我都分享給大家啦~~

推薦組合色板⑨：

推薦組合色板⑩：

6）其它色彩組合 

色板 顏色組合資源下載 

Yellow & Black

除了我上面分享的這五套經(jīng)典配色，還有很多其它的色彩組合，也都非常優(yōu)秀好看，比如上次分享的這些：

這段時間的積累收集，又更新了下面這些新色板。

還有很多，就不一一展示了。方便大家收藏，我把這些色彩組合的圖片+色板文件，都進(jìn)行了打包，方便大家直接借鑒這些色彩。

文章來源：UI中國     作者：UX小學(xué)

藍(lán)藍(lán)設(shè)計(jì)( m.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ù)

疫情之下，很多零售商都開始經(jīng)營私域流量，私域流量+傳統(tǒng)零售的新模式似乎成為了保持市場增長的新藥方，私域流量也對零售業(yè)進(jìn)行了重新改造。本文將從三個方面對此展開分析，希望對你有幫助。

研究零售行業(yè)中的私域流量，有一個問題值得思考：是什么刺激了零售私域流量的發(fā)展？

今天，市場上移動互聯(lián)網(wǎng)的流量紅利消失，線下端人口紅利的消失。包括零售業(yè)在內(nèi)，大部分行業(yè)的市場性質(zhì)，已經(jīng)從增量市場過渡到了存量市場。

整個存量市場中，依賴過去傳統(tǒng)的獲客方式，獲客成本在不斷升級，導(dǎo)致商戶之間的競爭激烈。即便各個平臺之間沒有形成自己的流量壁壘，各個商圈中的區(qū)位沒有形成壟斷。成本的不斷升級，最終還是會刺激私域流量取代傳統(tǒng)的獲客，成為一種市場成交的新方式。

私域流量作為存量市場的產(chǎn)物，進(jìn)一步得到發(fā)展的趨勢非常明顯。

一部分原因是受到了零售商品的屬性影響，大部分的零售商品都是針對特定的用戶人群需求設(shè)計(jì)，服務(wù)定向人群為主。所以大部分的產(chǎn)品有針對性，買一次A商品和買十次A商品的人，大概率是同一批人。

因?yàn)檫@種情況，讓一個新客戶買一次產(chǎn)品的成本，是要比讓老客戶再多買一次產(chǎn)品的成本，高得多。

增量時期，大部分商家都沒注意老客戶的運(yùn)營，當(dāng)產(chǎn)品慢慢觸達(dá)到了市場邊際，積累了一定的市場體量后，下個階段更具有性價(jià)比的方向，就是前期一直被忽略了的定向人群的精細(xì)化運(yùn)維，可提升復(fù)購性。

零售行業(yè)中，傳統(tǒng)模式的消費(fèi)者和商戶的接觸，往往是離不開：人、場、貨的。同時一片區(qū)域內(nèi)的線下超市和商店，只能服務(wù)這塊區(qū)域的客流量，存在地域流量壁壘。

傳統(tǒng)零售，消費(fèi)者如果不去店鋪、超市里面，看不到商品的陳列，就可能不會買牛奶、買飲料，就沒辦法形成交易發(fā)生。所以傳統(tǒng)零售通過總代、分代、批發(fā)商，到零售商，開更多的線下店鋪，打通更多的線下代理渠道，實(shí)現(xiàn)獲客和成交。

但是私域流量+傳統(tǒng)零售的新模式，會讓市場重新審查傳統(tǒng)零售人貨場的模型。讓重點(diǎn)經(jīng)營的方向也會瞄準(zhǔn)老客戶線索的激活和運(yùn)營，讓老客戶復(fù)購和帶新。

私域流量對零售行業(yè)的一些影響

購物場景從線下（低頻率）轉(zhuǎn)到線上的可重復(fù)性。

私域流量模式內(nèi)，用戶和商戶之間的觸點(diǎn)發(fā)生了改變，從線下遷移到線上。實(shí)體場景代入了內(nèi)容場景，沒有實(shí)體店，照樣可以賣東西。

1. 零售行業(yè)的私域流量，朋友圈的內(nèi)容文案即終端，內(nèi)容營造的場景即門店

從一開始的人、場、貨模式，變成了一種可重復(fù)性的“叫賣”模式：一個消費(fèi)者在社群中、朋友圈、小程序看到了信息推送，正好刺激了購買欲望，就會產(chǎn)生交易。生意的本質(zhì)是人與人之間的供需鏈接。傳統(tǒng)零售和消費(fèi)者的“觸點(diǎn)”是線下店，私域流量+零售的模式的觸點(diǎn)是線上的方式。

類似企業(yè)微信這種線上的方式，就幫助商戶綁定了客戶線索。不僅是縮短了商戶和消費(fèi)者之間的距離，這中間還帶有社交屬性，幫助客戶更好地了解消費(fèi)者需求，做好用戶需求的細(xì)分。

這種邏輯我們叫做“觸點(diǎn)營銷”，和用戶做朋友，讓熟人關(guān)系變成賣貨的渠道。

觸點(diǎn)，是商戶和消費(fèi)者之間接觸點(diǎn)，通過接觸點(diǎn)傳遞信息和提供服務(wù)。（現(xiàn)在線上端習(xí)慣，用社群鏈接和服務(wù)消費(fèi)者）

比如現(xiàn)在熱門的社區(qū)團(tuán)購，是私域+傳統(tǒng)零售的典型模式。

原來小區(qū)小賣部的老板，觀察到小區(qū)的住戶每次都嫌棄買菜的時候，耗時長、不新鮮的問題，于是自己做團(tuán)長經(jīng)營私域流量，建立企業(yè)微信拉了一個買菜群，幫助小區(qū)住戶們“便捷買菜”

因?yàn)楦咏嚯x的服務(wù)住戶，老板還可以記錄自己老顧客的喜好，做好SCRM的標(biāo)簽處理：

1. 買菜的頻率
2. 買米的頻率
3. 買油鹽醬醋茶的頻率
4. 家里幾口人
5. 平時買什么類型的菜會多一點(diǎn)

一段時間之后，老板可以提前幾天進(jìn)行這些日用品貨物的銷售，給住戶發(fā)一條信息：“你好鄰居，今天的豬肉6折，剛從XX現(xiàn)宰的，你看要給你留一點(diǎn)嗎？”這就是利用企業(yè)微信這線上端的觸點(diǎn)聯(lián)系，建立可重復(fù)性的模式。

這是傳統(tǒng)零售很難做到的，因?yàn)閭鹘y(tǒng)零售沒辦法更近一步的接近消費(fèi)者，所以自己手里是拿不到相關(guān)的數(shù)據(jù)，于是只能把錢都用在優(yōu)質(zhì)廣告位、優(yōu)質(zhì)區(qū)域位上，搶占消費(fèi)者的視野。

那些年為了公域流量瘋狂燒錢的平臺：

2. 決策形式從重度決策轉(zhuǎn)為輕度決策

傳統(tǒng)零售場景中，消費(fèi)者買東西要么認(rèn)功能，要么認(rèn)牌子。但是私域模式的零售場景就不一樣，今天的消費(fèi)者情感消費(fèi)顆粒度比以前更細(xì)，決策情況在發(fā)生變化。

• 傳統(tǒng)零售的決策考慮是：功能消費(fèi)+品牌消費(fèi)。
• 新零售的決策考慮是：功能消費(fèi)+情感消費(fèi)+內(nèi)容消費(fèi)+服務(wù)消費(fèi)。

情感和服務(wù)因素，會使決策發(fā)生的更加快。你身邊的朋友和普通一個銷售，向你推薦同樣的一個物品，正常情況下，你選擇相信你朋友的概率是要大過于選擇銷售的。

還是用小區(qū)小賣部老板的例子，當(dāng)老板服務(wù)多幾次住戶的時候，老板和住戶之間的信任程度會慢慢上升。（情感消費(fèi)）

老板了解到消費(fèi)者的采購米的喜好，可以嘗試給他推薦同品類，但是高單價(jià)、味道好吃的大米。在有原來信任基礎(chǔ)的前提下，肯定是有部分消費(fèi)者愿意嘗試下，因?yàn)橄M(fèi)者追求“美味”的需求比較大眾化。

這種時候消費(fèi)者的決策程度會由重度決策轉(zhuǎn)向輕度決策，一句話概括就是：你辦事我放心。

私域流量中，客戶和商戶的聯(lián)系變得非常密切，人即流量，關(guān)系即渠道，熟人變熟客。雖然要成為好朋友這個門檻比較難，但是在消費(fèi)者的決策中，中間的情感因素會影響到消費(fèi)者的決策。讓決策變的更加的輕度。
重要的是，信息觸達(dá)的成本也降低了很多。據(jù)「加一私域」官方統(tǒng)計(jì)：以大眾客戶運(yùn)營每年發(fā)12次短信類比，同樣100萬私域客戶的群發(fā)觸達(dá)每年至少節(jié)省20多萬元營銷成本。再加上朋友圈運(yùn)營，每發(fā)送一條朋友圈價(jià)值3-5萬元（按騰訊朋友圈廣告1000人曝光 / 30 – 50元為例計(jì)算）

3. 消費(fèi)場景從消費(fèi)者找貨的模式，變成貨找消費(fèi)者

消費(fèi)者在對商品進(jìn)行購買決策的時候，有一個很大的通?。哼x擇困難癥。所以在傳統(tǒng)的零售中，商品的陳列擺放也成了一門學(xué)問。貴的、銷售額好的基本上都放在了展架的上面的位置。

同時很多的零售廠商為了博消費(fèi)者的眼球，各種商品的包裝也是非常講究的。

這樣做是為了讓商品，第一時間出現(xiàn)在消費(fèi)者的面前，提高成交轉(zhuǎn)化的概率。大部分的消費(fèi)因?yàn)橛羞x擇困難癥，往往第一眼被看到的商品，這些商品的成交率比較高，這就是商品的“C位”效應(yīng)。

在私域+零售的模式中，沒有了線下店鋪，內(nèi)容是私域中商品的唯一的展柜。通過內(nèi)容構(gòu)建一個消費(fèi)場景，實(shí)現(xiàn)“貨找人”模式。

像很多的微商的朋友圈內(nèi)容，就是構(gòu)建這樣的“貨找人”場景。朋友圈和社群中的場景，營造的是一種“即時成交”，通過內(nèi)容構(gòu)建一種“沖動型的消費(fèi)場景”，讓交易的發(fā)生短、平、快（時間短、速度快、產(chǎn)品平民化）

私域模式中“貨找人”，就要站在客戶視角，與人近，就會離增長更加近。私域流量模式不是要一下干件大事，而是做對一系列小事；要做對一系列的小事，就要不停的細(xì)分，挖細(xì)節(jié)，挖每一個和消費(fèi)者接觸的點(diǎn)。

文章來源：人人都是產(chǎn)品經(jīng)理  作者：陽俊Orlo

藍(lán)藍(lán)設(shè)計(jì)( m.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ù)

產(chǎn)品經(jīng)理日常工作中最常聽到的詞就是需求，而產(chǎn)品經(jīng)理的核心工作也就是把需求變成可使用的產(chǎn)品。那當(dāng)我們接到需求時，我們是如何把它轉(zhuǎn)化成產(chǎn)品呢？本文將從七個方面進(jìn)行分析，希望對你有幫助。

一、對“需求”這個詞的理解

首先我們先了解一下，在產(chǎn)品開發(fā)過程中所溝通的“需求”到底指的是什么。我們先舉幾個我們工作中常常聽到的需求：

• 老板：現(xiàn)在經(jīng)營效率太低了，我們要上個系統(tǒng)，提率（目標(biāo)需求）；
• 財(cái)務(wù)：每筆費(fèi)用報(bào)銷都要走審批，加強(qiáng)對費(fèi)用支出的管理（業(yè)務(wù)需求）；
• 運(yùn)營：日常經(jīng)營數(shù)據(jù)需要支持導(dǎo)出功能，好進(jìn)行加工分析（功能需求）。

我們可以將平常聽到的需求都?xì)w為這三類，產(chǎn)品經(jīng)理需要做的就是將目標(biāo)需求和業(yè)務(wù)需要轉(zhuǎn)化為產(chǎn)品方案，然后交付給開發(fā)團(tuán)隊(duì)。

接下來我們將以羽毛球館訂場地這個業(yè)務(wù)需求，來拆解一下整個過程，看它是一步步變成產(chǎn)品方案的。

二、定位業(yè)務(wù)問題

場館運(yùn)營部門提出一個需求，我們需要實(shí)現(xiàn)線上訂場地。

業(yè)務(wù)需求的提出，肯定是為了解決某些業(yè)務(wù)問題。通過調(diào)研，現(xiàn)在純線下訂場的方式存在以下問題：

球友：

• 想運(yùn)動，但不知道哪里有合適的場館?
• 不知道場館是如何收費(fèi)的?
• 場館有沒有空閑的場地?
• 場館的有哪些項(xiàng)目？有沒有停車場、淋浴等設(shè)施？

場館：

• 球友打電話過來，詢問場地價(jià)格和空余等情況耗費(fèi)時間;
• 新球友訂場交定金麻煩，不交定金又可能爽約，造成場地未預(yù)定出去的損失;
• 人工登記場地預(yù)定情況，易產(chǎn)生失誤，導(dǎo)致一場多訂等情況，極大影響客戶體驗(yàn)；
• 場地預(yù)定情況很難統(tǒng)計(jì)成分析數(shù)據(jù)，對運(yùn)營決策無法提供幫助;

業(yè)務(wù)問題定位了，后面的設(shè)計(jì)就要圍繞這些問題展開，設(shè)計(jì)完后要回過來看有沒有解決這些問題，否則一切都是徒勞的。

三、梳理業(yè)務(wù)流程

流程是產(chǎn)品設(shè)計(jì)的關(guān)鍵，梳理流程能讓你對整個過程更清晰。梳理過程前，先要明確下訂場有幾個場景，因?yàn)槊總€場景的流程可能不太一樣。通過調(diào)研和分析得知，訂場主要有以下幾種場景：

• 線上訂場—球友在微信或者APP上訂場；
• 線下訂場—球友直接到場館前臺臨時訂場；
• 電話訂場—打電話給場館前臺，讓前臺預(yù)留場地；
• 長期球友固定訂場—有些企業(yè)會固定在某個時段訂場，比如周三的18:00~20:00，一次預(yù)訂即可，定好有效期，不用每次臨時預(yù)訂；
• 包場—企業(yè)搞團(tuán)建時會包下整個場館；

這里就要思考一下，我們這次設(shè)計(jì)是否要滿足這5個場景呢？我們回到定位業(yè)務(wù)問題這一步，問題都是在想要運(yùn)動的球友在訂場時存在的，而方式e在線下的處理暫時并沒有多大問題，再深入一步調(diào)研可了解到，包場都是直接線下談好價(jià)格，這個價(jià)格也是可浮動的，然后將錢線下轉(zhuǎn)給場館，放到線上反而不靈活，所以我們就先不考慮線上實(shí)現(xiàn)這個場景。

Tips：產(chǎn)品經(jīng)理需要學(xué)會做減法，并不是把線下所有業(yè)務(wù)搬到線上來，開發(fā)出來后發(fā)現(xiàn)并沒有什么用，又浪費(fèi)這么多資源。

將待實(shí)現(xiàn)場景確定下來后，我們需梳理每個場景的業(yè)務(wù)流程，這樣才能對整個過程清晰。因?yàn)槲覀冞@次只是講方法，所以就只拿場景a來舉例，繼續(xù)下面的分析過程。

我們梳理出線上訂場流程圖后，這時我們需要分析一下，這些環(huán)節(jié)哪些需要做到線上？

入場前：訂場、付款、鎖場肯定是需要做到線上的，產(chǎn)品的目標(biāo)就是為了解決訂場效率低的問題；

前臺接待：出示訂場憑證、校驗(yàn)訂場憑證、開燈、放行這些環(huán)節(jié)并沒有太大的影響效率。出示訂場憑證、校驗(yàn)訂場憑證可通過報(bào)手機(jī)號的形式解決。開燈和放行涉及到智能燈控和智能閘機(jī)的對接，沒有這些東西業(yè)務(wù)也能跑的通，也能正常營業(yè)，這期也先不考慮在線上實(shí)現(xiàn)；

入場后：到點(diǎn)提示也涉及到智能設(shè)備的對接，先可人工提示。

Tips：產(chǎn)品經(jīng)理需要定義需求的優(yōu)先級，先把影響業(yè)務(wù)正常運(yùn)行的問題解決掉，再來迭代優(yōu)化。

四、梳理業(yè)務(wù)規(guī)則

業(yè)務(wù)規(guī)則是運(yùn)營部門為使業(yè)務(wù)正常運(yùn)行而定義的，就算沒有系統(tǒng)也是存在的。產(chǎn)品經(jīng)理需要做的是把這些業(yè)務(wù)規(guī)則梳理出來，然后用產(chǎn)品的語言把它描述出來。還是以線上訂場舉例，場地什么時候可以訂?訂的時候有沒有時間限制？價(jià)格會由哪些因素影響？可不可以退場？會員有沒有什么特殊權(quán)限？這些規(guī)則聽著是不是很亂，這就需要產(chǎn)品經(jīng)理一條一條梳理清楚，梳理規(guī)則的同時還需要多問為什么要這樣做呢，一來以后方便和開發(fā)等同事說清楚為什么這樣設(shè)計(jì)，二來也能加深自己對業(yè)務(wù)的了解。

通過調(diào)研我們梳理出以下預(yù)訂規(guī)則，但我們需注意以下兩點(diǎn)：

• 這些規(guī)則都是比較容易通過調(diào)研得到的，還有一些隱性的規(guī)則，調(diào)研的時候很難得到，可能在產(chǎn)品上線一段時間后才能想到。例如訂場后要在一定時間內(nèi)支付，不支付就將場地變成空閑狀態(tài)。產(chǎn)品上線后這種規(guī)則缺失一定會暴露出來的，但產(chǎn)品經(jīng)理最好能提前考慮到這種規(guī)則，盡量避免損失。
• 這些規(guī)則僅僅為一個場館的規(guī)則，為將產(chǎn)品的適用更多的場館，也為防止以后場館的業(yè)務(wù)規(guī)則變動，盡量做成可配置的。

以上只列舉了線上訂場的預(yù)訂規(guī)則，還有退訂規(guī)則、價(jià)格方案規(guī)則、會員權(quán)限等規(guī)則都需要一條一條梳理出來，這里就不一一列舉出來了。

五、繪制原型

業(yè)務(wù)流程和業(yè)務(wù)規(guī)則都梳理出來后，就可以畫原型了。這一步對產(chǎn)品經(jīng)理來說，即簡單又困難。簡單是因?yàn)槿ハ胂缶呦蟮能浖僮鞅人伎汲闃拥臉I(yè)務(wù)邏輯更容易，難是因?yàn)楫嫷脑妥罱K要符合業(yè)務(wù)流程和業(yè)務(wù)規(guī)則，并且還要符合常規(guī)交互原則。

從業(yè)務(wù)流程分析，整個訂場環(huán)節(jié)涉及到球友和場館，那肯定要有球友訂場端和場館管理端。球友訂場端剛開始也沒必要做APP，做個H5放在微信公眾號就可以了，還能引流到公眾號。確定好用什么來實(shí)現(xiàn)后，我們要梳理一下線上訂場有哪些頁面，不要想到一個畫一個，這樣很容易漏頁面。

Tips：剛開始設(shè)計(jì)原型時，盡量不要添加一些和主流程無關(guān)的頁面，比如你覺得別人做了個VR查看場館，你也要做一個，但是前期最重要的是把業(yè)務(wù)跑通，再來添加一些附加功能。

工具類產(chǎn)品原型設(shè)計(jì)多參考一下美團(tuán)、淘寶等移動端產(chǎn)品，因?yàn)橐苿佣水a(chǎn)品發(fā)展到現(xiàn)在，已經(jīng)培養(yǎng)了用戶的操作認(rèn)知，我們不用去發(fā)明輪子，讓用戶再重新去學(xué)習(xí)。

六、可用性測試

產(chǎn)品的原型出來了，可以給客戶演示，讓客戶跑一遍整個流程，看先前提的業(yè)務(wù)問題有沒有得到解決。如果有問題，再進(jìn)行調(diào)整。其實(shí)讓客戶跑一遍流程也不能發(fā)現(xiàn)所有問題，只有在真正使用的時候才會暴露出問題來，但這一步也是不可少了。

七、撰寫PRD

PRD全稱為Product Requirement Document，中文名為“產(chǎn)品需求文檔”。其核心目的是幫助開發(fā)、測試、運(yùn)營、產(chǎn)品人員理解該需求的背景和具體要求，減少產(chǎn)品實(shí)現(xiàn)過程中諸多不必要的重復(fù)解答，從而提升整體項(xiàng)目推進(jìn)效率。當(dāng)業(yè)務(wù)規(guī)則、業(yè)務(wù)流程、原型圖都出來后，我們需要把它交付給我們的開發(fā)團(tuán)隊(duì)去實(shí)現(xiàn)，交付的形式就是PRD。這里就不闡述PRD怎么寫了。

八、總結(jié)

當(dāng)接到業(yè)務(wù)需求時，變成產(chǎn)品的過程是：

• 定位業(yè)務(wù)問題；
• 梳理業(yè)務(wù)流程；
• 梳理業(yè)務(wù)規(guī)則；
• 繪制原型；
• 可用性測試；
• 撰寫PRD。

以上只是個理想化的流程，產(chǎn)品經(jīng)理并不是寫完P(guān)RD扔給開發(fā)就沒事了。包括后面的需求評審、跟進(jìn)開發(fā)進(jìn)度和問題、測試上線、迭代優(yōu)化等，都需要產(chǎn)品經(jīng)理主導(dǎo)。

文章來源：人人都是產(chǎn)品經(jīng)理  作者：康力文

藍(lán)藍(lán)設(shè)計(jì)( m.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ù)

收藏

收藏

收藏

收藏

收藏

收藏

收藏

收藏

收藏

收藏

收藏

收藏

轉(zhuǎn)自：站酷

作者：chuting97

藍(lán)藍(lán)設(shè)計(jì)( m.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ù)

收藏

收藏

收藏

轉(zhuǎn)自：站酷

作者：眼中英雄夢

藍(lán)藍(lán)設(shè)計(jì)( m.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ù)

導(dǎo)讀

品牌體系的長期價(jià)值是什么？如何構(gòu)建完整品牌體系？

本文將以網(wǎng)易智企品牌設(shè)計(jì)體系的建立過程為案例，與大家分享一下品牌體系化過程中的經(jīng)驗(yàn)和總結(jié)。

△ 網(wǎng)易智企-品牌設(shè)計(jì)體系

目錄

• 背景：從產(chǎn)品走向事業(yè)部
• 研究：品牌體系的不同構(gòu)建方式
• 策略：選擇合適的品牌體系構(gòu)建策略
• 設(shè)計(jì)：從品牌字體到框架規(guī)范
• 標(biāo)準(zhǔn)化：設(shè)計(jì)文檔與流程規(guī)范化
• 推進(jìn)：發(fā)起會議正式確立體系
• 成長：體系的不斷自我成長
• 傳承：網(wǎng)易品牌設(shè)計(jì)
• 生態(tài)：品牌體系的長期價(jià)值
• 資料獲取

背景：從產(chǎn)品走向事業(yè)部

網(wǎng)易智企是一站式企業(yè)服務(wù)提供商，依托 23 年 AI、大數(shù)據(jù)、通訊音視頻技術(shù)，以 PaaS、SaaS 為主，提供智能化、數(shù)據(jù)化、場景化的企業(yè)服務(wù)解決方案。

網(wǎng)易智企的前身，是網(wǎng)易云信和網(wǎng)易七魚兩個的產(chǎn)品。2019 年初，網(wǎng)易集團(tuán)決定整合 B 端資源，成立一個新的事業(yè)部——網(wǎng)易智企，并在此之后陸續(xù)打造了網(wǎng)易定位、網(wǎng)易互客等多個優(yōu)秀產(chǎn)品。

至此，網(wǎng)易智企的品牌架構(gòu)由兩個獨(dú)立的產(chǎn)品品牌，逐漸變成了事業(yè)部品牌+多個子品牌的品牌架構(gòu)。

但是，因?yàn)樵械膬蓚€品牌（即云信、七魚）已經(jīng)運(yùn)營多年，在設(shè)計(jì)上并不統(tǒng)一。而事業(yè)部品牌為新設(shè)計(jì)的品牌，再加上其他的子品牌，最終造成了多個品牌在設(shè)計(jì)上“各自為政”的現(xiàn)狀。

并且隨著網(wǎng)易智企的快速發(fā)展，子品牌不斷的變多，我們與市場部同學(xué)便逐漸發(fā)現(xiàn)了一些問題。下圖是市場部同事在 2019 年發(fā)表在朋友圈的一張圖，便是當(dāng)時品牌的現(xiàn)狀。

△ 網(wǎng)易智慧企業(yè)現(xiàn)狀（2019 年初）

雖然產(chǎn)品線愈發(fā)豐富，整個事業(yè)部也在不斷成長中。但是，若是品牌設(shè)計(jì)體系不夠清晰，將會對未來的品牌傳播造成非常多的問題，之后的修正成本也會越來越高。

如何改變現(xiàn)狀？我們是否能夠主動去推動事業(yè)部進(jìn)行整體的品牌升級？能否通過設(shè)計(jì)去構(gòu)建一個完整的體系，以滿足網(wǎng)易智企未來的發(fā)展需要？

因此，在發(fā)現(xiàn)這個問題后，我們便馬上開始了品牌設(shè)計(jì)體系的構(gòu)建工作。結(jié)合之前的品牌經(jīng)驗(yàn)，并在查閱大量資料進(jìn)行研究后，逐步制定了完整的解決方案。之后與市場部同學(xué)一起合作，共同推進(jìn)了品牌體系的構(gòu)建與落地工作。

研究：品牌體系的不同構(gòu)建方式

在企業(yè)的成長過程中，隨著業(yè)務(wù)的不斷拓展，自然而然地會產(chǎn)生越來越多的子品牌。在這個過程中，許多優(yōu)秀的企業(yè)通過長期的實(shí)踐，通過不同的方式，逐步構(gòu)建了屬于自己的品牌體系。比如聯(lián)合利華、大眾企業(yè)集團(tuán)、蘋果、雀巢、谷歌等等。

品牌體系一共有哪些構(gòu)建方式？他們分別適用于哪種情況？而我們又應(yīng)該用何種方式去構(gòu)建品牌體系呢？

帶著這些問題，我開始進(jìn)行了品牌體系構(gòu)建的研究。通過大量的案例分析與調(diào)研，我總結(jié)了以下幾種最常用的品牌體系構(gòu)建方式：

1. Free Standing 自由家庭式

自由家庭式，顧名思義，一切皆為 Free Style。子品牌與母品牌幾乎無關(guān)聯(lián)系性，完全自由地進(jìn)行各自發(fā)展，因此品牌在設(shè)計(jì)上和基本毫無關(guān)聯(lián)性。

這種品牌模式，通常適用于強(qiáng)子品牌戰(zhàn)略的集團(tuán)公司。不同的子品牌之間并無依存關(guān)系，也不需依靠其他子品牌、母品牌進(jìn)行背書。而是各自在領(lǐng)域中獨(dú)立運(yùn)營，甚至形成差異化競爭，以擴(kuò)大在單領(lǐng)域的品牌豐富程度，占據(jù)更大的市場份額。

△ Free Standing 自由家庭式

比如聯(lián)合利華集團(tuán)，所有子品牌幾乎均采用自由家庭式，在不同的細(xì)分領(lǐng)域擁有多個子品牌。比如個人護(hù)理用品領(lǐng)域，主要品牌有旁氏、多芬、Iluminage、卡玫爾、清揚(yáng)、凌仕、中華、力士、夏士蓮、舒耐、凡士林等。食品系列品牌有家樂、老蔡、立頓、四季寶、凈水寶、可愛多、夢龍、和路雪等品牌。

很多品牌你甚至意想不到這是出自聯(lián)合利華之手（或者被收購了），但仔細(xì)查看產(chǎn)品介紹，均會發(fā)現(xiàn)聯(lián)合利華的身影。而在產(chǎn)品廣告的最后 1 秒，也會快速出現(xiàn)聯(lián)合利華這個“爸爸”的身影 。

△ 聯(lián)合利華集團(tuán)-品牌體系

再比如 VOLKSWAGEN（大眾汽車集團(tuán)），所有子品牌也均采用自由家庭式。旗下有奧迪、斯柯達(dá)、賓利、西雅特、布加迪、保時捷、蘭博基尼、大眾、斯堪尼亞、杜卡迪等眾多子品牌。通過差異化競爭，在汽車行業(yè)的不同領(lǐng)域（家用車、豪華車、摩托車、重型卡車、巴士等）的不同級別中，均占據(jù)了不錯的份額。

面對不同的消費(fèi)群體和階層，品牌需要承載不同的品牌概念，解決不同的問題。因此，只有采用自由式家庭式的品牌家庭，才能在不同的領(lǐng)域中有針對性地進(jìn)行品牌的建設(shè)。

當(dāng)然，這種方式也具有一定的負(fù)面作用。如果當(dāng)兩個子品牌在同一領(lǐng)域重疊性較大時，容易導(dǎo)致品牌在“內(nèi)部競爭”中逐漸弱化，比如斯柯達(dá)汽車的定位與大眾汽車重疊性過大，定位區(qū)分不明顯，而與大眾的三大件又是相同的，因此逐漸在市場中被邊緣化。

△ 大眾汽車集團(tuán)-品牌體系

我們可以總結(jié)一下自由家庭式品牌體系的優(yōu)劣勢。

優(yōu)勢：

• 子品牌更靈活，更有利于差異化競爭。
• 可以針對同一行業(yè)進(jìn)行不同層次的用戶獲取，提升單品類占有率。
• 子品牌危機(jī)，對母品牌營銷較小。

劣勢：

• 品牌一致性差，用戶難以感知整體品牌感，不適合弱子品牌型企業(yè)。
• 用戶難以形成整體品牌歸屬感，無法通過母品牌進(jìn)行有效地用戶遷移。

2. Gene Delivery 基因家庭式

基因家庭式，即母品牌與子品牌擁有部分相同的元素或風(fēng)格特征，并通常具有延續(xù)性，而這種元素被稱為品牌基因。

基因家庭式是品牌體系中最為常見的表現(xiàn)方式，它通常適用于強(qiáng)母品牌的集團(tuán)企業(yè)。此類公司通常在母品牌發(fā)展成熟后，基于母品牌進(jìn)行其他領(lǐng)域的拓展，逐漸形成不同的子品牌。因此，子品牌需要延續(xù)母品牌的基因作為背書，從而提升子品牌的知名度與信譽(yù)。

△ Gene Delivery 基因家庭式

而基因家庭式這個大的方向中，按照基因傳遞的方式進(jìn)行細(xì)分，又可以歸納為以下 3 種最典型的形式：

基礎(chǔ)版：將母品牌圖形直接融入到子品牌中

比如雀巢公司的部分重要子品牌中，都將母品牌的品牌文字融入到品牌圖形中，而這也是雀巢母品牌最容易識別的部分。

通過這種方式，子品牌既保持了相當(dāng)程度的自由度，同時用戶也能直觀地通過品牌基因識別出子品牌與雀巢母品牌的關(guān)聯(lián)性。

△ 雀巢公司-品牌體系

以及美國聯(lián)邦快遞 FedEx，則是以母品牌為基礎(chǔ)，通過改變局部顏色、增加品牌文字等方式來構(gòu)建其不同的子品牌。保證了一定的差異化的同時，與母品牌形成了強(qiáng)關(guān)聯(lián)，達(dá)到了比較強(qiáng)品牌延續(xù)性。

△ 美國聯(lián)邦快遞-品牌體系

進(jìn)階版：提取母品牌關(guān)鍵特征，融入子品牌中

比如亞馬遜公司，將其標(biāo)志性的“箭頭笑臉”提取出來，與各自不同的子品牌字體組成了新的品牌。這種方式相對于基礎(chǔ)版又提高了更高的靈活性，但同時也保持了相當(dāng)程度的品牌延續(xù)性。

△ 亞馬遜-品牌體系

高階版：提取母品牌基因，通過重構(gòu)形成子品牌

比如 google 公司的新品牌與其各子產(chǎn)品的關(guān)系。通過提取統(tǒng)一的顏色以及扁平化的紙片效果，經(jīng)過重組以后得到不同的圖形，形成自由度極高，但又擁有高度統(tǒng)一性的品牌體系。

△ Google-品牌體系

但是，這種方式在設(shè)計(jì)上的要求較高。如何在差異化的同時，保持一定的品牌關(guān)聯(lián)性，需要非常精準(zhǔn)的把控。

我們可以總結(jié)一下基因家庭式品牌體系的優(yōu)劣勢。

優(yōu)勢：

• 整體品牌感強(qiáng)，用戶容易進(jìn)行感知，并進(jìn)行品牌遷移
• 靈活性、豐富性較高，可針對不同產(chǎn)品進(jìn)行差異化設(shè)計(jì)
• 擴(kuò)展性強(qiáng)，后期延續(xù)更輕松

劣勢：

• 需要母品牌有較強(qiáng)的影響力
• 品牌基因的延續(xù)上，需要平衡統(tǒng)一性與差異性，需要精準(zhǔn)把控

3. Clone Family 克隆家庭式

克隆家庭式，即子品牌直接使用母品牌的品牌圖形與品牌字體。子品牌通常與母品牌在品牌上毫無差異，或者保持圖形、顏色、字體等特征的高度統(tǒng)一性，只進(jìn)行文字內(nèi)容的更換。

△ Clone Family 克隆家庭式

比如蘋果公司與其所有子產(chǎn)品的品牌，直接沿用蘋果的主圖形，并配合統(tǒng)一的色值、字體、間距等品牌規(guī)范，僅在文字進(jìn)行相應(yīng)的命名。通過幾乎一致的品牌表現(xiàn)，當(dāng)你識別任何一個子品牌時，便能感受幾乎一致的品牌傳遞，甚至是各種細(xì)節(jié)，比如包裝風(fēng)格、說明書等等。

△ Apple-品牌體系

當(dāng)然，嚴(yán)格意義上來說，你可以認(rèn)為他們只是同一個品牌。但當(dāng)一個單一屬性的品牌需要擴(kuò)張到更多品類時，就必須帶上相應(yīng)的屬性。你可以認(rèn)為“iPhone”、“MacBook”、“TV”只是品牌的附加說明，但當(dāng)他們組合在一起并出現(xiàn)在新的品類中時，便是一個新品牌的概念了。

這種品牌體系通常適用于企業(yè)在同一個的領(lǐng)域中，開拓不同的細(xì)分領(lǐng)域。他們傳遞的品牌概念與價(jià)格定位是一致的，比如蘋果的所有產(chǎn)品都代表科技感、細(xì)節(jié)完美、設(shè)計(jì)精良，在價(jià)格上也通常占據(jù)比較高的層級。

但是，這種方式也具有一定的局限性。因?yàn)槟惚仨毐ＷC所有子品牌所傳遞的上述所有特性，都與母品牌是一致的。如果某一項(xiàng)有差異，則品牌母品牌所蘊(yùn)含的一切將不能被子品牌的用戶群體所接受，這也是當(dāng)時 iPhone 4C、5C 失敗的原因。當(dāng)你的價(jià)格定位與母品牌存在差異時，你的用戶便不再認(rèn)同這個子品牌，以及背后傳遞的一切。

為什么小米要開拓紅米系列、華為要開拓出榮耀系列，為了他們放棄克隆家庭式而轉(zhuǎn)向自由家庭式？就是這個道理——你不可能靠一個品牌傳遞不同的聲音。

我們可以總結(jié)一下克隆家庭式品牌體系的優(yōu)劣勢。

優(yōu)勢：

• 統(tǒng)一感強(qiáng)，用戶無需更多的記憶，可直接進(jìn)行品牌印象遷移
• 低成本，可以無需更多的設(shè)計(jì)與推廣活動

劣勢：

• 同一種品牌圖形，不一定適合不同的產(chǎn)品
• 缺乏變化，用戶難以感知與產(chǎn)品間的關(guān)聯(lián)
• 容易引起品牌層級的混亂，致使整個品牌家庭崩潰

策略：選擇合適的品牌體系策略

1. 確定策略

通過網(wǎng)易智企品牌現(xiàn)狀的分析，并結(jié)合智企未來的發(fā)展需要，我們最終確定——使用基因家庭式-進(jìn)階版（即提取母品牌的關(guān)鍵特征，融入到子品牌中）的品牌體系是最為合適的。因?yàn)檫@種方式既能保證品牌設(shè)計(jì)的整體統(tǒng)一性，又能保持足夠的靈活性，以適應(yīng)不同品牌的需要。

但是，提取什么樣的品牌基因是最合適的？

網(wǎng)易七魚、網(wǎng)易云信原本就擁有多年的產(chǎn)品歷史，如果只提取一方的基因，顯然不太合適。如果大改品牌圖形，則會對原有用戶的認(rèn)知產(chǎn)生較大影響，并不是一個理想選擇。

最終，我們決定了一個大膽品牌策略——以品牌字體作為品牌基因的承載物，并通過標(biāo)準(zhǔn)化的框架規(guī)范使品牌的整體一致性得到的統(tǒng)一。通過這種方式，也可以將品牌圖形的自主設(shè)計(jì)權(quán)留給子品牌。

這種品牌策略的主要優(yōu)勢有：

整體品牌感強(qiáng)，品牌基因容易延續(xù)。

后續(xù)可將品牌設(shè)計(jì)流程標(biāo)準(zhǔn)化，提升設(shè)計(jì)與一致性。

原有品牌可只升級品牌字體和框架規(guī)范，保持原有品牌圖形，從而不影響用戶認(rèn)知。

通過這種方式，我們可以對原有的網(wǎng)易七魚、網(wǎng)易云信，以及網(wǎng)易智企的品牌做一個統(tǒng)一的升級，小幅優(yōu)化品牌圖形、統(tǒng)一品牌結(jié)構(gòu)，并以全新的字體風(fēng)格重構(gòu)品牌字體。這樣，我們既能夠達(dá)到設(shè)定的目標(biāo)，又能夠最小程度的對品牌認(rèn)知造成影響。

2. 可行性調(diào)研分析

這種構(gòu)建策略是否可行？想要讓相關(guān)人員理解這個策略，僅僅依靠設(shè)計(jì)方案是不夠的。因?yàn)榇蠹业囊暯遣煌?，并不一定能夠從設(shè)計(jì)的角度去理解。因此，我們必然要充分地進(jìn)行論證，并拿出相關(guān)的案例去佐證，才能讓設(shè)計(jì)體系的的推進(jìn)更具實(shí)踐性。

通過市場調(diào)研，我們分析了最近 10 年中優(yōu)秀的品牌升級案例。在這其中，騰訊的品牌升級案例與我們的策略非常契合。

2017 年 11 月，為慶祝即將到來的 20 周年，騰訊發(fā)布了一款新字體——“騰訊字庫”，并借此機(jī)會對部分品牌進(jìn)行了升級，以此來加強(qiáng)整體品牌感。

通過發(fā)布全新的品牌字體，騰訊公司構(gòu)建了以品牌字體為核心的品牌體系，并取得了良好的效果。而這種品牌體系的構(gòu)建方式，與我們的設(shè)想不謀而合。

因此，我們認(rèn)為以品牌字體為核心的品牌體系構(gòu)建策略是完全可行的。但是，這種方式所需要投入的資源是巨大的，且周期通常比較漫長。

我們又如何克服這個問題？

雖然無法得到如此多的資源，但我們可以通過合理的計(jì)劃與推進(jìn)策略，逐步去構(gòu)建整個體系。不斷地進(jìn)行策劃、構(gòu)建、落地、完善，形成一個完整的閉環(huán)，通過不斷實(shí)踐去提升、豐富這個體系，最終讓這個體系變得越來越完整。

確定策略之后，我們開始著手進(jìn)行品牌體系的構(gòu)建工作。

構(gòu)建：從品牌字體到框架規(guī)范

1.  品牌字體設(shè)計(jì)

品牌設(shè)計(jì)體系的構(gòu)想雖始于 2019 年初，但真正的準(zhǔn)備工作則始于兩年前。在我剛接觸網(wǎng)易七魚和網(wǎng)易云信時，便發(fā)現(xiàn)了品牌中存在的一些問題。雖然沒有合適的時機(jī)進(jìn)行品牌升級，但研究和嘗試則不斷地進(jìn)行中。

在此期間，我開始著手設(shè)計(jì)一款全新的專屬字體，也就是之后的網(wǎng)易 B 端產(chǎn)品的統(tǒng)一品牌字體。

通過對于網(wǎng)易智企品牌調(diào)性的分析，以及未來發(fā)展的需要，我確定了品牌字體的基本調(diào)性：現(xiàn)代、簡約、剛正、大氣、品牌基因的融入。

作為科技類企業(yè)品牌的字體，它應(yīng)該是有現(xiàn)代感和設(shè)計(jì)感。其次，為了適應(yīng)不同的產(chǎn)品調(diào)性，同時傳遞出信任感，我希望它是剛正、大氣的。最后，作為品牌體系的載體，它必須具備專屬的品牌特征，才能以此為基礎(chǔ)形成統(tǒng)一的品牌體系。

因此，在字形的結(jié)構(gòu)上采用了較為剛正的框架，干脆利落的同時，在轉(zhuǎn)角帶有一定的弧度。方中帶圓，剛中帶柔，形成美學(xué)上的互補(bǔ)。而在遵從中文字體結(jié)構(gòu)的同時，也對筆畫本身進(jìn)行了適當(dāng)?shù)暮喕ū热绻?，用切割式的筆畫代替上勾，但感知上仍然是勾），讓字體更具現(xiàn)代感與簡潔感。

而整個字體的靈魂，則是將網(wǎng)易的特征以筆畫特征的形勢融入字體中。貫穿始終、恰到好處，使其作為統(tǒng)一的品牌基因延續(xù)在品牌家庭中。

網(wǎng)易的建筑風(fēng)格在所有公司的大樓中，都是屬于非常有識別性的。除了深邃而低調(diào)的色彩外，整個建筑從外形到地板、再到每個細(xì)節(jié)中，都將擁有獨(dú)特切角的菱形融入其中。因此，我將這獨(dú)有的菱形的四個邊單獨(dú)拆分，作為字體的基本筆畫。通過簡單的移動，四個邊正好形成了網(wǎng)易的首字母“W”。繼續(xù)移動，將其從兩邊的翅膀往中間壓，則形成了一個網(wǎng)狀的 XX 形狀——這不正是網(wǎng)字中間的圖形嗎？

網(wǎng)易建筑風(fēng)格——網(wǎng)易的“W”——網(wǎng)易的“網(wǎng)”，網(wǎng)易的基因就這樣融入到字體中。而另一個更重要的特征，則是這四個筆畫與水平線相交，所呈現(xiàn)的統(tǒng)一傾斜角度——80度切角。

2. 初步制定框架規(guī)范，預(yù)先進(jìn)行品牌升級

完成字體風(fēng)格的定義后，下一步就是以品牌字體為核心，進(jìn)行原有 2 個品牌升級的方案設(shè)計(jì)。

首先進(jìn)行的是網(wǎng)易云信的品牌預(yù)升級。將網(wǎng)易云信的品牌字體以全新的字體風(fēng)格進(jìn)行重新繪制，并結(jié)合品牌圖形制定了全新的品牌框架。比如品牌圖形與品牌字體的間距，確定為字體高度的 1/2，而安全距離則定義為與字體高度相等間距等一系列規(guī)范。

通過初步的框架制定，一套圍繞著品牌字體的初步規(guī)范便制定完成了。

完成云信的品牌預(yù)升級后，又進(jìn)行了網(wǎng)易七魚的品牌預(yù)升級。因?yàn)樵械钠放茍D形存在一定的優(yōu)化空間，除了品牌字體重新繪制與標(biāo)準(zhǔn)規(guī)范外，還對品牌圖形和品牌色做了升級，讓品牌圖形保持原有識別性的基礎(chǔ)上，更加圓潤、靈動，顏色也更具科技感。

通過兩個品牌的預(yù)升級，除了初步對整體框架規(guī)范進(jìn)行了制定，也對品牌字體的品質(zhì)和實(shí)用性也得到了良好的驗(yàn)證，為接下來品牌升級工作的推進(jìn)奠定了一個比較好的基礎(chǔ)。

標(biāo)準(zhǔn)化：設(shè)計(jì)文檔與流程規(guī)范化

1. VI 設(shè)計(jì)文檔

品牌設(shè)計(jì)不僅僅是完成圖形的設(shè)計(jì)，更重要的是使品牌在后續(xù)使用中更加規(guī)范，而品牌 VI 識別系統(tǒng)是其中最重要的工具。文檔的初衷并非約束設(shè)計(jì)，而是使品牌設(shè)計(jì)的流程更加標(biāo)準(zhǔn)化，提升非關(guān)鍵環(huán)節(jié)的工作效率，讓設(shè)計(jì)師將時間真正聚焦于的品牌創(chuàng)意階段。

因此，我們制定了適用于不同場景的 VI 設(shè)計(jì)標(biāo)準(zhǔn)文檔。整個文檔的設(shè)計(jì)準(zhǔn)則：一致性（整體框架、頁面結(jié)構(gòu)高度一致）、專業(yè)性（文字表述、規(guī)范演示高度專業(yè)）、靈活性（允許在框架中的尋求靈活創(chuàng)新）。

封面樣式：推薦的默認(rèn)為標(biāo)準(zhǔn)品牌色+Logo 圖形樣式，除此之外還提供了背景圖，在保持框架一致的基礎(chǔ)上，也具備了一定的靈活性。

△ 封面樣式

目錄樣式：提供基礎(chǔ)版的 2 個模塊版式和 3 個模塊的版式。

△ 目錄樣式

內(nèi)容框架：文字說明的區(qū)域與版式，內(nèi)容區(qū)域的不同分割模式，盡可能地適應(yīng)不同的內(nèi)容需求。

△ 內(nèi)容框架

2. 品牌展示規(guī)范

在品牌的傳播和使用中，VI 識別手冊相對專業(yè)性會更強(qiáng)一些，而在平時的展示中，更多的會進(jìn)行單獨(dú)的品牌展示。因此，我們也為此制定了不同場景下品牌的單獨(dú)展示規(guī)范，以及在標(biāo)準(zhǔn)尺寸（1920×1080）下的頁面布局、圖形顯示比例等規(guī)范。

△ 品牌圖形單獨(dú)展示

△ 橫式標(biāo)準(zhǔn)組合

△ 豎式標(biāo)準(zhǔn)組合

3. 為新品牌制定 VI 系統(tǒng)

完成標(biāo)準(zhǔn)化的 VI 設(shè)計(jì)文檔后，下一步便開始著手進(jìn)行新品牌的 VI 識別手冊的設(shè)計(jì)工作。按照我們已經(jīng)制定完成的設(shè)計(jì)文檔，品牌 VI 識別規(guī)范的輸出效率得到了較大的提升。

△ 網(wǎng)易云信-VI 視覺識別系統(tǒng)

△ 網(wǎng)易七魚-VI 視覺識別系統(tǒng)

最終，我們完成了兩個品牌的 VI 視覺識別系統(tǒng)，為后續(xù)的體系化推進(jìn)做好充分的準(zhǔn)備。

推進(jìn)：發(fā)起會議正式確立體系

通過全新品牌字體與品牌規(guī)范的確立，并完成了 2 個品牌升級、1 個新品牌設(shè)計(jì)以后，我們將完整所有的準(zhǔn)備工作整理成一個完整的提案。

下一步，就可以發(fā)起正式的品牌升級研討會了。會議目的是通過整體的背景分析與方案呈現(xiàn)，讓各相關(guān)方都能夠達(dá)成一致意見，最終完成正式的品牌體系落地。

1. 提前與關(guān)鍵相關(guān)方溝通，對齊目標(biāo)

在準(zhǔn)備好充足的方案后，如何推進(jìn)并最終落地？

這是非常關(guān)鍵的一步，也是許多設(shè)計(jì)師比較不擅長的領(lǐng)域。想要順利的推進(jìn)項(xiàng)目，光靠一個好的解決方案是不夠的，還需要在正確的時間點(diǎn)，尋求各相關(guān)方的支持。

因此，首先就需要了解各相關(guān)方對于品牌現(xiàn)狀的看法，并通過現(xiàn)狀的分析，初步對齊我們的“項(xiàng)目目標(biāo)”——即解決長期的品牌混亂問題，而這也是我解決問題的初衷。只有對齊了目標(biāo)，我們才能站在共同的出發(fā)點(diǎn)，并在合適的事件拋出解決方案。

下圖是當(dāng)時與其中一個市場側(cè)關(guān)鍵相關(guān)方溝通的過程。當(dāng)我們分析完目前的現(xiàn)狀后，相關(guān)方對目前的現(xiàn)狀表示認(rèn)可，并期待解決方案。這個時候，我們再將已經(jīng)成熟的方案展示出來，才能讓相關(guān)方站在同一角度去思考問題，并最終認(rèn)可解決方案。

之后，我以相同的方式詢問起產(chǎn)品側(cè)和其他側(cè)的相關(guān)方。大家在對齊目標(biāo)以后，都有一個比較清晰的認(rèn)知，也對我提出的解決方案非常認(rèn)可。這時候，我們的項(xiàng)目便有了進(jìn)一步推進(jìn)的基礎(chǔ)。

2. 發(fā)起會議，正式推出方案

通過提前的溝通，確定了各相關(guān)方的態(tài)度，同時了收集了一些小小的意見，并對方案進(jìn)行了微調(diào)。之后便與各相關(guān)方正式地發(fā)起了品牌升級會議。下面是這次會議的簡要過程：

會議開始后，我們首先進(jìn)行背景分析。

為什么需要進(jìn)行品牌升級？簡要分析 2019 年初智慧企業(yè)的品牌現(xiàn)狀，以及智慧企業(yè)未來的品牌發(fā)展方向：整體品牌感弱，品牌一致性過差，無法滿足智慧企業(yè)長期的發(fā)展需要。

同時，我們也對目前現(xiàn)有的品牌設(shè)計(jì)進(jìn)行分析，發(fā)現(xiàn)了較多的問題。比如品牌字體的風(fēng)格不統(tǒng)一、比例不一致、色值不統(tǒng)一等問題。而這些問題可以也可以通過品牌升級進(jìn)行解決。

最后，隨著網(wǎng)易智企的快速發(fā)展，智慧企業(yè)的子品牌會越來越多，而品牌聯(lián)合推廣的頻次將會越來越高。這意味著品牌 Logo 設(shè)計(jì)混亂的現(xiàn)狀將會產(chǎn)生越來越大的影響力，而我們的修正成本將會越來越高。

為了解決這幾個方面的問題，我們推出了最終解決方案——進(jìn)行品牌升級，并建立網(wǎng)易智企品牌設(shè)計(jì)體系。

如何建立品牌體系？

通過策略分析與市場調(diào)研，以及未來網(wǎng)易智企發(fā)展的前瞻性思考，我們最終確定使用基因家庭式-進(jìn)階版的品牌體系是最為合適的，即提取母品牌的關(guān)鍵特征，融入到子品牌中。通過這種方式，我們對網(wǎng)易七魚與網(wǎng)易云信進(jìn)行了整體的品牌升級，并為所有新品牌制定了詳細(xì)的 VI 識別系統(tǒng)。

△ 品牌升級會議 PPT

經(jīng)過這套完整的方案闡述，大家在會議中一致通過了網(wǎng)易七魚和網(wǎng)易云信品牌升級的方案，并對以品牌字體+品牌規(guī)范為核心的品牌設(shè)計(jì)體系表達(dá)了正式認(rèn)可。

3. 以規(guī)范對事業(yè)部 Logo 進(jìn)行升級

品牌設(shè)計(jì)體系經(jīng)過各方認(rèn)可以后，推進(jìn)主品牌的升級就輕松多了。由于原有事業(yè)部的品牌字體和品牌色存在一定的設(shè)計(jì)問題，在確定了品牌體系的標(biāo)準(zhǔn)字體與規(guī)范后，我們便順勢對事業(yè)部的品牌進(jìn)行升級。

當(dāng)一個體系被認(rèn)可后，遵循這個體系就變成了理所應(yīng)當(dāng)。因此，網(wǎng)易智企主品牌升級的工作也得到大家的認(rèn)同，并順利推進(jìn)下去。

之后，我們同樣為網(wǎng)易智慧企業(yè)主品牌制定了詳細(xì)的 VI 識別系統(tǒng)。

△ 網(wǎng)易智慧企業(yè)-VI 視覺識別系統(tǒng)

至此，我們已經(jīng)完成了現(xiàn)有的主品牌進(jìn)行了整體的升級，網(wǎng)易智企的品牌矩陣已經(jīng)初步形成。對比原有的品牌矩陣，整體品牌感得到了極大地提升。同時，也將會對之后的新品牌形成良好的規(guī)范，并促使這個體系不斷地成長。

4. 發(fā)送郵件，全員通知并規(guī)范使用

通過會議并得到各相關(guān)方確認(rèn)后，最后一步便是發(fā)送正式的品牌升級郵件了。

通過發(fā)送郵件，正式宣布品牌升級，并通知每一個關(guān)鍵相關(guān)方。這就相當(dāng)于合同的最后一步，整體體系便正式地得到了確認(rèn)、生效。同時也將 VI 手冊和設(shè)計(jì)文檔同步給大家，引導(dǎo)各方正確地進(jìn)行品牌使用。

成長：體系的不斷自我生長

1. 不斷豐富的品牌矩陣

隨著網(wǎng)易智企的快速發(fā)展，我們的品牌也逐漸增多。從 2019 年初進(jìn)行品牌預(yù)升級，到 2019 年底，我們一共推動了 4 個產(chǎn)品進(jìn)行品牌升級，并以新的規(guī)范進(jìn)行了 4 個新品牌的設(shè)計(jì)。

有了品牌設(shè)計(jì)體系后，大家對品牌設(shè)計(jì)的態(tài)度也發(fā)生了明顯的改變。

每當(dāng)有新的產(chǎn)品需要進(jìn)行品牌設(shè)計(jì)時，大家便會自覺地去遵循這個體系——“按照品牌體系的標(biāo)準(zhǔn)設(shè)計(jì)即可”?！拔覀冎恍枰凑阵w系來就行了，剩下的圖形創(chuàng)意工作就交給你們了”。

在此之后的每個新品牌設(shè)計(jì)，我們都按照標(biāo)準(zhǔn)化的設(shè)計(jì)流程進(jìn)行，將重點(diǎn)的工作投入在圖形的創(chuàng)意上，而不是反復(fù)地去嘗試各種風(fēng)格。我們的品牌設(shè)計(jì)效率得到了極大的提升，而各方對于品牌方案的確定也變得順利多了，因?yàn)榇蠹抑恍枰袛鄨D形是否符合產(chǎn)品特點(diǎn)即可，無需反復(fù)對比各種品牌風(fēng)格。

2. 英文品牌規(guī)范的加入

隨著品牌設(shè)計(jì)體系的不斷發(fā)展，我們的品牌將不僅僅局限于中文，也會涉及到單獨(dú)的英文品牌。經(jīng)過我們的長期實(shí)踐，英文品牌規(guī)范應(yīng)運(yùn)而生。

MCtalk 是網(wǎng)易發(fā)起，由網(wǎng)易智慧企業(yè)部主導(dǎo)的科技活動品牌:通過匯聚深度思維(Mind) 和頂尖創(chuàng)意(Creativity)來打造價(jià)值集合與傳遞的平臺。包含 MCtalk Forum 論壇、MCtalk Conference 峰會、MCtalk Live 分享、MCtalk Park 開放日和 MCtalk Academy 私享會等系列活動。

3. 周年數(shù)字品牌規(guī)范

隨著不同產(chǎn)品線周年慶，許多品牌會設(shè)計(jì)專屬的周年組合樣式。為了因?yàn)椴煌苣?Logo 而影響產(chǎn)品統(tǒng)一性，同時減少了不必要的工作，我們設(shè)計(jì)了品牌+數(shù)字周年的品牌規(guī)范。

每個品牌都可以應(yīng)用統(tǒng)一的周年組合形式。讓不同品牌在周年組合中，也能擁有統(tǒng)一的品牌感。

但是，周年品牌規(guī)范的統(tǒng)一，并不意味著每個活動獨(dú)特性的缺失。我們?nèi)耘f可以圍繞數(shù)字+主題發(fā)揮出強(qiáng)有力的創(chuàng)意，為每次活動創(chuàng)造豐富的主視覺。

傳承：網(wǎng)易云商品牌設(shè)計(jì)

隨著品牌設(shè)計(jì)體系的設(shè)計(jì)規(guī)范與標(biāo)準(zhǔn)化文檔已經(jīng)逐步成型，這份文檔可能會發(fā)送給許多設(shè)計(jì)師進(jìn)行使用。但是，具體設(shè)計(jì)時，許多設(shè)計(jì)師可能會產(chǎn)生一些疑問，導(dǎo)致字體設(shè)計(jì)、圖形設(shè)計(jì)上面會出現(xiàn)問題。

那么，如何使用這份框架規(guī)范，正確地進(jìn)行品牌設(shè)計(jì)呢？下面，我將以網(wǎng)易云商的品牌設(shè)計(jì)過程為例，大致演示一下這個流程。

1. 品牌字體設(shè)計(jì)

品牌字體的設(shè)計(jì)，我們在文檔中給出了統(tǒng)一的字體風(fēng)格，以及目前已經(jīng)設(shè)計(jì)完成的品牌字體。如果字體已經(jīng)存在，則可以直接獲取，無需重復(fù)設(shè)計(jì)。

比如網(wǎng)易云商的品牌字體中，“網(wǎng)“”易”“云”三個字已經(jīng)出現(xiàn)過，則直接取用，根據(jù)規(guī)范進(jìn)行“商”字的設(shè)計(jì)即可。

字體的設(shè)計(jì)，大概有三個步驟：

確定字體的骨架：字體設(shè)計(jì)，首先要保證字形的結(jié)構(gòu)準(zhǔn)確，遵循漢字的書寫規(guī)律。否則，將會影響字體的易讀性，讓字體看起來不夠自然。這一步，推薦多去借鑒已有的一些優(yōu)秀字體，網(wǎng)易正體的字形結(jié)構(gòu)，參照了“方正正中黑簡體”和“黑體”這兩個字體，在設(shè)計(jì)時可以先研究相同字形的筆畫結(jié)構(gòu)。

融入品牌基因：品牌基因，包含了橫線末端 80 度切角，折角處的圓角，勾、點(diǎn)的簡化處理等統(tǒng)一風(fēng)格。同時，筆畫帶有細(xì)微的圓角，使字體本身剛而不銳。

整體調(diào)整，細(xì)節(jié)優(yōu)化：最后一步，則需要憑借字體設(shè)計(jì)經(jīng)驗(yàn)，對筆畫進(jìn)行優(yōu)化，使其遵循字形結(jié)構(gòu)的前提下，更嚴(yán)謹(jǐn)、更具設(shè)計(jì)感。這一步，若沒有相關(guān)經(jīng)驗(yàn)，建議與我或者有字體經(jīng)驗(yàn)的設(shè)計(jì)師進(jìn)行探討。每個字體力求嚴(yán)謹(jǐn)、優(yōu)美、更有設(shè)計(jì)感，以便未來其他設(shè)計(jì)師使用。

2. 品牌圖形設(shè)計(jì)

品牌圖形的設(shè)計(jì)，是品牌設(shè)計(jì)中最為關(guān)鍵的一個部分。設(shè)計(jì)師需要在契合品牌理念的基礎(chǔ)上，設(shè)計(jì)出最符合需求的品牌圖形。也需要讓品牌圖形在風(fēng)格上保持相對一致。

在網(wǎng)易智企品牌體系中，推薦以平面化的圖形進(jìn)行品牌設(shè)計(jì)。這樣能夠保證圖形足夠簡潔，并適應(yīng)不同的場景使用。同時，品牌圖形應(yīng)盡可能地與母品牌保證一定傳承、關(guān)聯(lián)性。

通常情況下，設(shè)計(jì)師需要在充分理解概念的基礎(chǔ)上，進(jìn)行多個方向的嘗試。最終逐漸縮小范圍，直至最終方案的確定。

網(wǎng)易云商的核心概念是，成為企業(yè)的商業(yè)增長服務(wù)平臺。因此，“增長”這個概念應(yīng)該貫穿于品牌圖形中。而云商的產(chǎn)品皆為 SaaS 產(chǎn)品，而“商”的首字母是“S”，因此，S 也成為云商的一個標(biāo)志之一。云商的目標(biāo)，希望打通企業(yè)營銷全鏈路，因此，全鏈路也成為附屬的概念之一。

因此，整個品牌圖形呈現(xiàn)的是一個向上增長的字母“S”，它像火箭一樣向上發(fā)射。而整個圖形，則由三段線條構(gòu)成流暢的“S”線條，寓意三個品牌所形成“營銷全鏈路”的概念。

為了讓整個圖形更嚴(yán)謹(jǐn)、細(xì)節(jié)更完善，在大致確定品牌圖形后，設(shè)計(jì)師還需要巧妙地通過輔助線，去完善和優(yōu)化整個品牌圖形。為了避免切角過于尖銳，也同樣在轉(zhuǎn)角處加入了細(xì)微的圓角，使其優(yōu)雅而柔和，并且更好地與品牌字體相契合。

3. 品牌基因的延續(xù)

網(wǎng)易云商是網(wǎng)易智企旗下的商業(yè)增長服務(wù)平臺， 旗下包含網(wǎng)易七魚、網(wǎng)易定位、網(wǎng)易互客三大產(chǎn)品。因此，品牌的傳承性顯得尤為重要，如何巧妙地表現(xiàn)出其中的關(guān)聯(lián)性，是品牌圖形能否承載更多含義的關(guān)鍵。

在品牌圖形的風(fēng)格中，網(wǎng)易云商的圖形使用了與網(wǎng)易智企相同的線形風(fēng)格。同時，線條的傾斜角度，也延續(xù)了網(wǎng)易智企品牌圖形的 25 度傾斜。

在品牌圖形本身，則巧妙地融入原有的 3 個子品牌特征。比如線條末端傳承了七魚的魚形尾部，上下兩個線條傳承了互客的“互手相連”圖形，而線條前部的尖角則傳承了定位“精準(zhǔn)尖頭”的圖形。

雖然這三個原有的品牌，之后將逐漸融合成新的品牌。但是，它們并沒有消失，而是以另一種方式進(jìn)行了延續(xù)。有延續(xù)、有情感、有溫度，才能讓用戶更有記憶度，也更能讓陪伴了這么多年的圖形有一個精神的傳承。

同時，整個圖形又像一個 DNA 雙螺旋基因，互相環(huán)繞增長。寓意網(wǎng)易云商，將成為企業(yè)的增長基因這一概念。

最后，通過統(tǒng)一的品牌框架規(guī)范，將品牌圖形與品牌字體進(jìn)行結(jié)合，形成了最終的完整方案。

4. 制作完整品牌 VI 識別系統(tǒng)

最后一步，便是按照 VI 標(biāo)準(zhǔn)文檔，快速進(jìn)行品牌 VI 識別手冊的設(shè)計(jì)。標(biāo)準(zhǔn)文檔中已經(jīng)覆蓋了基礎(chǔ)的品牌使用規(guī)范，如果需要增加規(guī)范，可以按照相同的版式進(jìn)行手冊內(nèi)容的新增。

生態(tài)：品牌體系的長期價(jià)值

隨著更多品牌的加入，品牌設(shè)計(jì)體系的大家族也變得愈發(fā)豐富了。我們不僅獲得了一個高度體系化的品牌矩陣，同時也形成了一套更、更規(guī)范的企業(yè)品牌設(shè)計(jì)流程。并且，隨著我們的影響力不斷擴(kuò)大，逐漸也吸引了更多品牌加入到這個體系中…

1. 自我成長的字體庫——網(wǎng)易正體

在每次新品牌設(shè)計(jì)的過程中，都會遵循統(tǒng)一的字體風(fēng)格進(jìn)行新字體的繪制，品牌字庫也因此不斷豐富。我們希望它最終將成長為一款完整的品牌字體，并對其進(jìn)行了正式的命名——網(wǎng)易正體。

我們并不刻意去“生產(chǎn)”字體，而是讓其自然地隨著新品牌的加入不斷的成長。

需要說明的是，雖然我們將字體的設(shè)計(jì)權(quán)交給設(shè)計(jì)師，但我們?nèi)耘f會對每個字體進(jìn)行評審。除了字體風(fēng)格的統(tǒng)一之外，我們對字體本身的基本要求也同樣嚴(yán)格，比如字形結(jié)構(gòu)的正確性、字體美感是否達(dá)到標(biāo)準(zhǔn)等。

隨著品牌體系的影響力越來越廣泛，我相信我們的品牌字庫也會越來越豐富、完善。我們也歡迎更多的內(nèi)部品牌遵守這套規(guī)范，一起加入網(wǎng)易 B 端品牌設(shè)計(jì)體系、網(wǎng)易正體的“共創(chuàng)計(jì)劃”中。

2. 標(biāo)準(zhǔn)化的設(shè)計(jì)流程，更高的設(shè)計(jì)效率

通過對于整個設(shè)計(jì)流程的優(yōu)化，我們將品牌的框架規(guī)范設(shè)計(jì)、品牌字體設(shè)計(jì)、品牌 VI 規(guī)范這幾個流程進(jìn)行了標(biāo)準(zhǔn)化，以此來提升整體的設(shè)計(jì)效率。

設(shè)計(jì)師可以將更多的精力專注于前期的品牌圖形與概念的創(chuàng)意上，而之后的工作可以用這個標(biāo)準(zhǔn)化的流程來完成。更重要的是，這并不是單純設(shè)計(jì)層面的流程，二是經(jīng)過整個團(tuán)隊(duì)確認(rèn)的流程。 因此，只要圖形創(chuàng)意獲得通過，那么后續(xù)的流程便可以快速完成可出產(chǎn)出，無需再次與各方確認(rèn)。

通過實(shí)際的測算，對于傳統(tǒng)的設(shè)計(jì)流程，我們可以將品牌字體的設(shè)計(jì)時間提升越 60%（如果字庫足夠豐富，那就是 100%了），整體規(guī)范輸出效率提升 80%。

最終，我們通過這套標(biāo)準(zhǔn)化的規(guī)范節(jié)約了大量的時間，同時逐步構(gòu)成了非常完整的品牌體系。我們也希望這套標(biāo)準(zhǔn)化流程能夠幫助更多的品牌。

3. 圍繞品牌體系的內(nèi)部生態(tài)

我們通過不斷的品牌設(shè)計(jì)與升級工作，通過不斷成長的品牌、不斷完善的標(biāo)準(zhǔn)化流程，最終完整了網(wǎng)易智企的品牌設(shè)計(jì)體系的建設(shè)工作。

基于所有的 VI 規(guī)范都是同一標(biāo)準(zhǔn)的，所有場景的規(guī)范可以任意組合、替換，這使得我們可以以統(tǒng)一標(biāo)準(zhǔn)輸出給市場、產(chǎn)品人員，并逐步去建立后續(xù)的統(tǒng)一規(guī)范。

隨著品牌體系的完善，我們的推設(shè)計(jì)廣體系、產(chǎn)品設(shè)計(jì)體系才有了建設(shè)的基礎(chǔ)。圍繞市場側(cè)，我們建立了統(tǒng)一的推廣體系，用以規(guī)范線上線下的推廣輸出規(guī)范，產(chǎn)品官網(wǎng)的規(guī)范以及活動頁等規(guī)范。而圍繞產(chǎn)品側(cè)，隨著品牌體系的認(rèn)同，F(xiàn)ishDesign 的統(tǒng)一使用得以有了“群眾基礎(chǔ)”，并基于樣式組件化+規(guī)范體系化建立了產(chǎn)品設(shè)計(jì)體系。

總而言之，品牌體系是所有體系化的基礎(chǔ)，也是智慧企業(yè)設(shè)計(jì)體系的核心。只有頂層品牌的統(tǒng)一，才能在頂層認(rèn)知上影響每個產(chǎn)品線，并逐步去引導(dǎo)中層、底層規(guī)范的統(tǒng)一。

2020 年下半年，網(wǎng)易智慧企業(yè)的中文名已經(jīng)正式升級為網(wǎng)易智企，歡迎關(guān)注我們的產(chǎn)品～

4. 更大的影響力，“B 端品牌體系”共創(chuàng)計(jì)劃

我們?yōu)槭裁匆⑵放企w系？

回到最初的原點(diǎn)，除了幫助網(wǎng)易智企解決當(dāng)前階段的品牌問題外，還有另一個原因——在網(wǎng)易內(nèi)部建立一套指導(dǎo)性品牌設(shè)計(jì)規(guī)范與流程。

設(shè)計(jì)不僅僅是純粹的創(chuàng)意性，也不是片面的規(guī)范性。

體系的目的并非強(qiáng)制性的規(guī)范（我個人并不推崇毫無意義的統(tǒng)一）。體系的目的在于引導(dǎo)性、在于選擇性。我們希望提供的是一個基礎(chǔ)標(biāo)準(zhǔn)和流程。也許某個產(chǎn)品的設(shè)計(jì)師并不擅長品牌設(shè)計(jì)，也許大家有這套體系需求，那么大家可以有一套高品質(zhì)、的品牌設(shè)計(jì)與落地流程。

也許某個產(chǎn)品線覺得這套體系不夠滿足目前的現(xiàn)狀，但對于品牌的基本標(biāo)準(zhǔn)不清楚，對于品牌設(shè)計(jì)流程不夠清晰。那也可以這套體系的基礎(chǔ)上進(jìn)行創(chuàng)新，借鑒這套設(shè)計(jì)流程。

基于這個目標(biāo)，我們已經(jīng)將品牌規(guī)范與標(biāo)準(zhǔn)文檔進(jìn)行了小范圍的開放試驗(yàn)。截止到 2020 年的上半年，已經(jīng)有多個品牌開始使用這套標(biāo)準(zhǔn)化流程進(jìn)行品牌升級與規(guī)范輸出，比如網(wǎng)易易盾、網(wǎng)易輕舟、網(wǎng)易疾風(fēng)等。

品牌設(shè)計(jì)體系更大的價(jià)值在于——幫助品牌快速建立秩序，將時間留給創(chuàng)意。而體系本身，也會因?yàn)槊看蔚膭?chuàng)意，變得更豐富、更完善。通過不斷地正向循環(huán)、自我迭代，最終成為一個更大生態(tài)。

在無序中尋找秩序，在秩序中尋找創(chuàng)意，讓世界變得更有序、更有趣、更美好。

藍(lán)藍(lán)設(shè)計(jì)( m.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ù)

什么是選擇器

選擇器是一個輸入字段， 用戶必須在其中選擇一個（或多個）選項(xiàng)，這與文本字段中用戶可以自由使用的輸入?yún)^(qū)不同。選擇器具有各種不同的形狀和形式。下拉菜單，復(fù)選框，切換按鈕，滑塊等都是不同類型的選擇器，但它們看起來彼此并不相似。這些類型的選擇器之間的主要功能差異是用戶可以選擇的選項(xiàng)數(shù)量：一個或多個。

選擇器的類別

• 單選選擇器
• 多選選擇器

1. 單選選擇器

單選選擇器按效果又可以分為：點(diǎn)擊選擇器、滑動選擇器、多聯(lián)動選擇器、開關(guān)選擇器、可搜索效果的選擇器、地圖選擇器。

特點(diǎn)：同一時間只能選擇一個選項(xiàng)，當(dāng)你已經(jīng)選擇完一項(xiàng)后，準(zhǔn)備選取另一項(xiàng)，那么后選的一項(xiàng)會立刻使先選的一項(xiàng)被取消選擇。

點(diǎn)擊選擇器

點(diǎn)擊選擇器可分為兩種狀態(tài)，狀態(tài)一為立即觸發(fā)，當(dāng)你點(diǎn)擊后會立即跳到下一步操作；狀態(tài)二為再次確認(rèn)觸發(fā)，當(dāng)選中某項(xiàng)時，不會立即觸發(fā)操作，而是需要再點(diǎn)擊別的觸發(fā)類組件（如保存按鈕）后，再執(zhí)行操作。

• 立即觸發(fā)式：

特點(diǎn)：直接進(jìn)入，并沒有再次確認(rèn)的按鈕，可以讓你快速到達(dá)想要的目的。

建議：雖然目的能快速達(dá)到，不過也很可能會造成誤操作，所以在設(shè)定這類選擇器時要多考慮手指的觸碰區(qū)域以及每個選擇元素的距離，同時正因?yàn)槭侵苯犹D(zhuǎn)，所以應(yīng)當(dāng)加入一些操作提示。

舉例：汽車之家在用戶選擇二手車時就會出現(xiàn)此選擇器，當(dāng)我在汽車之家想要選擇二手車時，它會彈出立即觸發(fā)式選擇器控件，我們在控件上可以看到有7個圓形選項(xiàng)，分別為：汽車之家誠信聯(lián)盟、準(zhǔn)新車、奧迪、奔馳、寶馬、三廂轎車、分期購車，當(dāng)我點(diǎn)擊“奧迪”選項(xiàng)時就會立即跳轉(zhuǎn)選擇后的頁面，為了讓用戶知道自己選擇后的狀態(tài)，在跳轉(zhuǎn)頁面時還會彈出非模態(tài)彈窗的文字提示“共找到1943輛車”。

• 再次確認(rèn)觸發(fā)式：

特點(diǎn)：這是最為常見的選擇器類型，當(dāng)所在選項(xiàng)選上，除了選擇另一個選項(xiàng)之外，便沒法取消選中狀態(tài)。（選且只能選擇一個選項(xiàng)）

建議：在設(shè)定此類選擇器時我們應(yīng)該從產(chǎn)品的角度去考慮是否給用戶一個默認(rèn)選項(xiàng)，甚至是否考慮給出一個重置按鈕。

舉例：我剛注冊小紅書時，在小紅書填寫信息頁面中，它的默認(rèn)選項(xiàng)是“男”，我點(diǎn)擊“女”，則會自動取消掉“男”，它們兩者并不能同時存在，并且只有我點(diǎn)擊下一步按鈕時才會正式確認(rèn)我選擇完成。

滑動選擇器

特點(diǎn)：滑動選擇器是將需要選中的內(nèi)容滑動至中部，然后點(diǎn)擊確認(rèn)按鈕確認(rèn)選中后返回選中內(nèi)容。大多數(shù)運(yùn)用在選擇時間或地址上。

建議：滑動選擇器的展示區(qū)域有限，部分選項(xiàng)會被隱藏，最好是當(dāng)用戶對所有選項(xiàng)都比較熟悉、有預(yù)期的時候，才使用它。為了保證手機(jī)屏幕觸控精度，以免發(fā)生誤觸，滾輪選擇器建議控制在5列以內(nèi)。

舉例：在小紅書填寫年齡信息時，我們只需用手指在區(qū)域內(nèi)滑動即可選擇想要的選項(xiàng)。

多聯(lián)動選擇器

特點(diǎn)：多聯(lián)動選擇器是由兩個或兩個以上的中繼器制作而成，第一個中繼器選擇后，一般會對第二個中繼器進(jìn)行篩選，不過因?yàn)轱@示的區(qū)域有限，所以當(dāng)你要切換時，還只能挨個切換，效率低下。

建議：可以通過數(shù)據(jù)以及功能來減少選擇時間，例如在選擇地區(qū)時，根據(jù)當(dāng)前GPS定位地理位置，定位相關(guān)省級信息及名稱，減少滑動操作。

舉例：如下，當(dāng)我選擇了內(nèi)蒙古自治區(qū)，那么2級內(nèi)容就應(yīng)該篩選掉內(nèi)蒙古以外的城市，比較適用于省份-城市或者品牌-產(chǎn)品這種類似的選擇，當(dāng)然下面第一張多聯(lián)動選擇器也結(jié)合了滑動選擇器。

△ 選擇城市時，我們必須要先選擇省份，再選擇城市，最后才能選擇縣；

多聯(lián)動選擇器展示的方式非常多，不僅可以用滑動形式展示，還可以用點(diǎn)擊、平鋪列表等形式展示。

上圖則沒有先后順序，不過當(dāng)你首先選擇顏色時，如果沒有相同尺碼的衣服，缺貨的尺碼則不會被選中，先選擇尺碼也是相同道理。

切換開關(guān)選擇器

特點(diǎn)：切換開關(guān)選擇器有且只有兩種選項(xiàng)，用來在開和關(guān)兩種狀態(tài)之間切換。開關(guān)屬于觸發(fā)類組件，撥動開關(guān)時，它所指揮的某個操作會立即生效，常見的使用就是授權(quán)。開關(guān)的默認(rèn)狀態(tài)并不都是關(guān)閉的，還要從產(chǎn)品本身的設(shè)定上來決策。

建議：如果某開關(guān)的功能是用戶經(jīng)常使用的狀態(tài)，那么可以在默認(rèn)狀態(tài)下打開開關(guān)，不過需要注意的是在某些特殊的開關(guān)按鈕需要打開時，必須要提前告知用戶。

舉例：當(dāng)我打開UC瀏覽器的設(shè)置時，它的輔助功能就使用了切換開關(guān)選擇器，切換的開關(guān)只需要點(diǎn)擊即可。

可搜索選擇器

特點(diǎn)：可搜索選擇器一般用于選擇項(xiàng)較多時，特別是對于電商購物類的APP搜索選擇器是必不可少的，搜索選擇器會根據(jù)用戶輸入的內(nèi)容，對中繼器進(jìn)行模糊的搜索，讓用戶快速找到并選擇內(nèi)容。

建議：在搜索區(qū)域輸入文字時，可給予用戶更多的文字提示以及以及引導(dǎo)類信息。

舉例：小紅書在搜索時就會出現(xiàn)數(shù)字化的信息提示，這樣能夠很好的引導(dǎo)用戶進(jìn)入到想要的搜索結(jié)果：筆記或者商品頁面。

地圖選擇器

特點(diǎn)：作為最特別的選擇器，它的功能是復(fù)雜的，它的操作方式也是多樣化的，地圖選擇器的操作可點(diǎn)擊、可拖拽、可放大縮小等等，它多用于生活類APP。

建議：可以在選擇器中加入更多趣味、互動、可感知的設(shè)計(jì)，如加入過節(jié)元素、車輛行駛路徑、熱門區(qū)域、甚至選取后手機(jī)的震動等。

舉例：打車類APP必用的地圖選擇器，滴滴出行的用戶可以實(shí)時看到車輛信息，可以采用點(diǎn)擊、拖拽、放大等操作來選取上車地點(diǎn)，選取后還有文字信息提示，讓用戶確認(rèn)操作是否正確。

貝殼APP則用地圖選擇器來讓用戶選擇二手房，同時也采用了聯(lián)動式的效果，第一步是查看區(qū)域，可以明確看到區(qū)域的售房套數(shù)，點(diǎn)擊選擇區(qū)域后我們可以看到每個路段的房子套數(shù)，點(diǎn)擊路段后就可以看到每個樓盤的套數(shù)以及均價(jià)，直到點(diǎn)擊樓盤就會彈出詳細(xì)信息框。這樣有助于用戶在選擇二手房時從大數(shù)據(jù)分析二手房的情況，有更好的對比性與選擇性。

2. 多選選擇器

當(dāng)單選選擇器不能滿足用戶需要時，這時我們就可以采用多選選擇器，一般常用的多選選擇器都是采用點(diǎn)擊的方式，當(dāng)然也有滑動類型的多選選擇器。

點(diǎn)擊多選選擇器

特點(diǎn)：當(dāng)用戶想要選擇多個類別的情況下，我們就可以用點(diǎn)擊多選選擇器來展示提供給用戶選擇，通過屏幕點(diǎn)擊選中或取消選中該選項(xiàng)，它不會立即觸發(fā)操作，需要再點(diǎn)擊別的觸發(fā)類組件（如保存按鈕）后，再執(zhí)行操作。

建議：從用戶的角度來講盡量不要強(qiáng)制用戶選擇數(shù)量或者默認(rèn)全部數(shù)量；多選項(xiàng)時觸碰區(qū)域不能太小，以免造成誤操作。

舉例：小紅書在選擇感興趣的內(nèi)容時就采用了點(diǎn)擊多選選擇器，不過在選擇興趣時它就強(qiáng)制用戶至少關(guān)注4個興趣，而對于單興趣或者少興趣的用戶來講，這無疑會造成用戶體驗(yàn)的不佳，被逼再次從中選擇次要的興趣。

滑動多選選擇器

特別注明：從用戶的角度來看，它可以選擇多個區(qū)域段的內(nèi)容，所以我把它分為多選選擇器中。

特點(diǎn)：當(dāng)系統(tǒng)給出的選項(xiàng)不在自己的選擇區(qū)間時，可以很好的自定義選擇區(qū)間，把定義權(quán)限交在用戶手里。同樣，它需要再點(diǎn)擊別的觸發(fā)類組件（如保存按鈕）后，再執(zhí)行操作。

建議：在用戶滑動操作期間要有明確的操作提示，讓用戶時刻感知目前處于的狀態(tài)；滑動區(qū)域盡量不要超過100刻度，如果刻度距離太小，用戶在滑動時也很難精準(zhǔn)的選擇范圍。

舉例：在汽車之家APP中，當(dāng)我要選擇汽車價(jià)格范圍時就會出現(xiàn)此選擇器，我們可以用手指滑動來選取它的價(jià)格區(qū)間，相對于上半部分的單選價(jià)格拓展性更強(qiáng)，用戶可以自行選擇上半部分的單選選擇器，也可以選擇滑動多選選擇器，給予用戶更多的選擇。

選擇器的十大應(yīng)用要點(diǎn)

1. 簡單易懂

標(biāo)題易懂：

在選擇器中標(biāo)題一定要簡單明了，很快的讓用戶知道他在為什么做選擇（如：當(dāng)你關(guān)注某烹飪的APP后，它會讓你勾選喜歡的菜譜，你的標(biāo)題就可以用“選擇菜譜”四個字，簡單明了）

文字標(biāo)簽易懂：

一般使用短語而不是句子，也并不需要用標(biāo)點(diǎn)符號來結(jié)尾。（如：當(dāng)選擇想要的菜譜時，菜譜后的文字不需要加入標(biāo)點(diǎn)符號）

選取狀態(tài)易懂：

用戶能夠明確感知什么是選中狀態(tài)，什么是未選中狀態(tài)，什么是禁用狀態(tài)。（如：選中狀態(tài)為高亮顯示，未選中為普通顯示，禁用狀態(tài)為灰度顯示）

反饋提示易懂：

當(dāng)你在選擇中遇到選項(xiàng)限制或是否需要確認(rèn)操作時，反饋提示一定要一目了然。（如：當(dāng)你選擇某衣服時，S碼不能選擇，則會用灰度顯示的文字代替，甚至可以用中橫線劃過文字，明確告訴用戶不能選擇）

2. 基本排序

從邏輯順序：

邏輯排序能讓用戶很快很準(zhǔn)的找到自己需要的選項(xiàng)，特別是對于選擇地址/時間/個數(shù)等常規(guī)的選項(xiàng)時，可以按照字母/遠(yuǎn)近/大小來進(jìn)行排序。例如下面在選擇地址時，就是按照A-Z字母排序，這樣可以大大節(jié)省用戶選擇的時間。

從產(chǎn)品利益角度排列順序：

當(dāng)然為了產(chǎn)品自身的利益也可以自己優(yōu)化排序方式，選項(xiàng)的順序可以說服用戶進(jìn)行選擇，用戶可能因?yàn)榈谝粋€選項(xiàng)在列表中的位置而選擇了第一個選項(xiàng)；可以輔助用戶，也可以讓用戶向著產(chǎn)品所希望的方向傾斜。例如你在選擇菜譜時，產(chǎn)品為了讓用戶選擇更加優(yōu)質(zhì)的菜譜，就會把用戶評價(jià)高的菜譜放在前列；當(dāng)然商家也會這么做，例如你要去買某款商品，商家會在選項(xiàng)中把熱門、優(yōu)質(zhì)的產(chǎn)品放在最上方，讓你優(yōu)先選擇。

從用戶體驗(yàn)排列順序：

從用戶角度來說哪些對用戶體驗(yàn)好，那么就把它排在前面。例如汽車之家在進(jìn)行車輛類別的排序中就把用戶量最多的轎車排在第一位，而把用戶量最少的輕客放在了最后一位；同樣它在汽車品牌選擇中，單獨(dú)列出了熱門品牌把它放在前列，讓用戶進(jìn)行快速選擇。

3. 一致性

視覺布局一致：

每個元素之間的對齊、元素與元素之間的間距、按鈕不同狀態(tài)的視覺體現(xiàn)。一般情況下移動端更傾向于左對齊，這樣有利于快速讀取選擇內(nèi)容，可以提高用戶的瀏覽效率并減少錯誤。

圖片/插畫風(fēng)格統(tǒng)一：

在圖文結(jié)合的選擇器中，我們一定要保證圖片（插畫）的優(yōu)質(zhì)以及風(fēng)格的統(tǒng)一。

4. 合理運(yùn)用默認(rèn)選項(xiàng)

默認(rèn)選項(xiàng)是選擇器的開始狀態(tài)。在不同的選擇器中有不同的默認(rèn)方式。

默認(rèn)未選中：

這是最常見的一種狀態(tài)，特別是對于選擇年齡、生日這些個人隱私信息，系統(tǒng)也沒有辦法進(jìn)行默認(rèn)選擇。

默認(rèn)選中其中一個選項(xiàng)：

要想默認(rèn)其中一項(xiàng)，必須考慮兩點(diǎn)因素，因素一：你想要潛意識的像用戶傳達(dá)信息，在單選選擇器中默認(rèn)選擇一項(xiàng)后，就可以潛意識的向用戶傳遞信息必須要在這組單選項(xiàng)之中選擇一個。因素二就是產(chǎn)品的傾向，例如此產(chǎn)品的性別9成都是女性，那么建議默認(rèn)選項(xiàng)為女性。

默認(rèn)選中全部：

其實(shí)默認(rèn)選中全部在用戶體驗(yàn)上來講真的不是那么的友好，例如微博這個選擇器界面，剛進(jìn)這個界面時已經(jīng)全部勾選中，并且當(dāng)你沒注意習(xí)慣性的點(diǎn)擊下面的按鈕時會生立即生效，沒有返回的余地。（吐槽：有些APP甚至沒有一鍵取消功能，要一個個的點(diǎn)擊取消…）這也是為了產(chǎn)品犧牲掉了部分用戶體驗(yàn)吧！

5. 給用戶更多選擇

單選選擇器的更多選擇：

如果用戶不想做出選擇，那么應(yīng)該提供一個中立選項(xiàng)，為用戶提供一個明確的方向，中立選項(xiàng)比勉強(qiáng)選擇要好。例如在選擇行業(yè)領(lǐng)域時，以上并沒有你所處的領(lǐng)域或你不確定你的領(lǐng)域，你就可以選擇“不限”或“其他”。

多選選擇器的更多選擇：

在多選選擇器中，如果不能把控到用戶的準(zhǔn)確選項(xiàng)區(qū)間，那么可以考慮滑動多選選擇器，讓用戶有更多的選擇區(qū)間，不管是汽車之家還是懂車帝在選擇車輛價(jià)格上兩者都是采用的相同方式。

6. 控件狀態(tài)

選擇控件在操作過程中必須更改其狀態(tài)/外觀，要明確讓用戶知道是否能選中，是否被選中。控件狀態(tài)一般分為三種：未選中、選中、禁用。

未選中

選擇器的開始狀態(tài)，向用戶表明，可對該選擇控件進(jìn)行操作。

選中

用戶操作選取狀態(tài)，選擇控件處于被選中的狀態(tài)。

禁用

一般情況會為灰色顯示，用戶將無法與選項(xiàng)進(jìn)行交互。

7. 操作提示

指的是用戶在操作中讓用戶得到相應(yīng)的反饋，用戶根據(jù)這些反饋可以判斷當(dāng)前狀態(tài)以及操作后狀態(tài)。在選擇器中，操作提示一般用輔助文案提示及非模態(tài)彈窗提示。

輔助文案提示（選擇前與選擇中）：

輔助文案指的是在選擇控件主體之外另外放置一些文案信息來充當(dāng)說明，例如下面是地區(qū)選擇，我在選擇不同層級的區(qū)域時，它的上方會出現(xiàn)輔助提示文案，讓你明確的知道你上一層級選擇的是什么。

同樣，當(dāng)我在選擇價(jià)格區(qū)間時，滑動選擇器的左上方一樣有文字類的提示：

非模態(tài)彈窗提示（選擇后）：

非模態(tài)彈窗一般出現(xiàn)在用戶操作完的跳轉(zhuǎn)頁面中，為了讓用戶感知所選的選項(xiàng)在頁面的狀態(tài)，如下，非模態(tài)彈窗告知用戶一共有7輛車符合標(biāo)準(zhǔn)。

當(dāng)然除了非模態(tài)彈窗外，還有模態(tài)彈窗，但是用戶體驗(yàn)極差，目前很少使用，所以就不列出來了。

8. 合理使用操作區(qū)域

擴(kuò)大點(diǎn)擊區(qū)域：

在選取按鈕類的操作時，容易出現(xiàn)點(diǎn)擊不到或誤操作的現(xiàn)象，我們可以通過擴(kuò)大點(diǎn)擊區(qū)的交互區(qū)域來提高易用性，例如下圖，雖然按鈕在左邊，但是可以把橫向區(qū)域都列為可點(diǎn)擊區(qū)域。

當(dāng)然我們也可以從設(shè)計(jì)的角度來擴(kuò)大視覺范圍，從而也提高了點(diǎn)擊范圍，這樣的處理不僅提升了視覺層面，還提升了交互體驗(yàn)。（圖文結(jié)合方式）

注意交互間距：

在元素與元素之間一定要有合理的交互間距，不然很容易出現(xiàn)誤選的情況。

合理利用有效區(qū)域：

在選項(xiàng)較多的選擇器中，我們可以利用好選擇主體控件之外的區(qū)域，例如在選擇城市/品牌時，我們可以做A-Z index式字母交互區(qū)，幫助用戶快速找到想要的選項(xiàng)。

9. 趣味性

讓用戶選擇本來就是一件枯燥乏味的事情，如果讓這件事變得有趣那么會極大的提升用戶體驗(yàn)。

從文本層面：

例如當(dāng)用戶填寫性別信息時，你給予用戶的文字信息并不是“男”/“女”，而是“帥氣的boy”與“酷酷的girl”，這樣會讓用戶覺得這是一件比較有趣的事情，而不是被動選擇。（注：這樣的取名一定要符合產(chǎn)品的特性）

從視覺層面：

加入可玩兒性的選項(xiàng)，例如汽車之家的頭像切換，可以選擇自己喜歡的頭像。（頭像并不是強(qiáng)制選擇的，如果不進(jìn)行操作則是默認(rèn)選項(xiàng)）

從交互層面：

讓用戶去享受選擇。例如Soul的星球首頁就做的非常棒，在未選擇狀態(tài)他的人物會360度圍繞著轉(zhuǎn)動，當(dāng)然你也可以快速拖拽，或者放大縮小，可玩兒性十足，并且在內(nèi)部設(shè)定了最匹配/新人的高亮顯示，協(xié)助用戶去選擇。

10. 合理使用選擇器

不同的產(chǎn)品在使用選擇器時都各有不同，因?yàn)槊總€選擇器都有它的利弊，而真正要怎么去選擇還要根據(jù)產(chǎn)品本身來定。

那么我就拿目前市面上最常見的5個地址選擇器的類型來分析一下利弊：

多聯(lián)動選擇器（平鋪式）

貨車幫采用的是多聯(lián)動平鋪式選擇器，它最大的特點(diǎn)就是能夠一眼就看清楚所有地址，不過地址多時需要花時間去找，只是當(dāng)你經(jīng)常使用此功能時便會形成記憶，再此搜索的時候就能形成記憶點(diǎn)擊，效率很高，并且在操作外還有路徑提示，不僅可以幫助你記住層級選項(xiàng)，還可以實(shí)時返回路徑進(jìn)行重新選擇。

手勢操作：點(diǎn)－點(diǎn)－點(diǎn)

多聯(lián)動選擇器（列表跳轉(zhuǎn)式）

閑魚采用的是多聯(lián)動列表跳轉(zhuǎn)式選擇器，這個選擇器最大的缺陷就是選擇三級之后用戶可能會忘了上一級的內(nèi)容，那么就又要切換到上一級，閑魚采用它的原因是因?yàn)樗挥卸壜?lián)動，不存在遺忘現(xiàn)象，不過這樣列表式的選擇效率并沒有平鋪的效率高，人眼習(xí)慣掃視橫向內(nèi)容，所以橫向的內(nèi)容獲取往往要比縱向的多，在地址選擇器上我個人是不太建議采用多聯(lián)動列表跳轉(zhuǎn)式，因?yàn)椴⒉灰膊恢庇^。

手勢操作：滑－點(diǎn)－點(diǎn)

多聯(lián)動選擇器（列表式）

轉(zhuǎn)轉(zhuǎn)采用的是多聯(lián)動列表式選擇器，它的優(yōu)點(diǎn)是可以根據(jù)右側(cè)字母來找城市，數(shù)據(jù)偏大也能夠很快的查找。不過如果在層級的選項(xiàng)中出現(xiàn)錯誤，同樣就要切換到上一級，并且在操作中沒有輔助信息提示。

手勢操作：滑/點(diǎn)－滑/點(diǎn)

多聯(lián)動選擇器（下滑式）

安居客采用的是多聯(lián)動下滑式選擇器，這種形式的選擇器不會遮擋后面的主要內(nèi)容信息，在選擇完地址之后能立即看到地址的篩選結(jié)果。優(yōu)點(diǎn)是能快速選擇多級地址，并且層級分明，擴(kuò)展性較強(qiáng)可以做成地址多選。缺點(diǎn)是不適合3個層級以上的地址選擇。

手勢操作：點(diǎn)－滑/點(diǎn)－點(diǎn)

地圖選擇器

美團(tuán)外賣采用的是地圖選擇器，這個選擇器一般用在需要精準(zhǔn)定位的生活類APP中，它的優(yōu)點(diǎn)就是能夠快速精準(zhǔn)定位，并且自動錄取定位信息，它的缺點(diǎn)也顯而易見，不能含帶層級并且對范圍也有約束。

文章來源：優(yōu)設(shè)  作者：黑獅力

藍(lán)藍(lán)設(shè)計(jì)( m.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ù)

在BAT、TMDJ等一線互聯(lián)網(wǎng)企業(yè)，決策平臺又稱決策支持平臺、管理會計(jì)平臺。但實(shí)質(zhì)都是實(shí)現(xiàn)業(yè)財(cái)一體化后，提取業(yè)務(wù)、財(cái)務(wù)數(shù)據(jù)，自動生成各種管理報(bào)表、財(cái)務(wù)報(bào)表，智能預(yù)警風(fēng)險(xiǎn)、預(yù)報(bào)業(yè)務(wù)前景，通過Dashboard或駕駛艙的形式展現(xiàn)給管理層、決策層，本文作者暫以管理會計(jì)平臺展開討論。

一、定義與范圍

1. 何謂“管理會計(jì)”

管理會計(jì)，從定義來看有狹義與廣義之分。狹義的“管理會計(jì)”通常是指財(cái)務(wù)會計(jì)概念，包含“成本管理”和“管理控制系統(tǒng)”兩部分。

而廣義的“管理會計(jì)”則是指運(yùn)用一系列的分析手段，通過挖掘財(cái)務(wù)數(shù)據(jù)、業(yè)務(wù)報(bào)告等中潛在信息，對企業(yè)財(cái)務(wù)狀況、經(jīng)營成果、現(xiàn)金流量和產(chǎn)品競爭力進(jìn)行分析，輔助經(jīng)營者進(jìn)行決策，指出業(yè)務(wù)、財(cái)務(wù)風(fēng)險(xiǎn)隱患，預(yù)測未來趨勢，賦能業(yè)務(wù)，以數(shù)據(jù)驅(qū)動企業(yè)發(fā)展。本次討論的后者，即廣義的管理會計(jì)。

管理會計(jì)目標(biāo)的實(shí)現(xiàn)，不是簡單的某一個系統(tǒng)或產(chǎn)品能承載的，需要設(shè)計(jì)一系列的產(chǎn)品矩陣，包括基礎(chǔ)的核算系統(tǒng)如ERP、成本結(jié)算系統(tǒng)、預(yù)算系統(tǒng)、報(bào)表系統(tǒng)，這個矩陣就是管理會計(jì)平臺（以下簡稱管會平臺）。

管會平臺的主體或用戶的不同使得所產(chǎn)出的管理報(bào)表（以下簡稱管報(bào)）指標(biāo)也有所不同。用戶一般分為外部和內(nèi)部2個大維度。

1）外部用戶

投資人偏向于分析企業(yè)的盈利能力和資本保值增值能力，如凈利潤率、資本保值增值率等指標(biāo)；債權(quán)人則側(cè)重分析資產(chǎn)負(fù)債水平和償債能力，如資產(chǎn)負(fù)債率、利息保障倍數(shù)、權(quán)益乘數(shù)等指標(biāo)。

2）內(nèi)部用戶

應(yīng)收會計(jì)崗則側(cè)重應(yīng)收賬款的質(zhì)量、收入的趨勢，如應(yīng)收賬款周轉(zhuǎn)率、收入環(huán)比或同比、速動比率等指標(biāo)；資產(chǎn)會計(jì)崗偏向于分析資產(chǎn)的利用率、所帶來的價(jià)值，如資產(chǎn)周轉(zhuǎn)率等指標(biāo)；而企業(yè)管理層或決策層會關(guān)注企業(yè)經(jīng)營活動和財(cái)務(wù)活動的一切方面。

管會平臺在設(shè)計(jì)時應(yīng)考慮滿足這些不同用戶的需求，并通過權(quán)限、角色實(shí)現(xiàn)千人千面的效果，不同用戶展示不同指標(biāo)集和報(bào)表。

2. 意義

管理會計(jì)不僅屬財(cái)務(wù)一個分支，更是財(cái)務(wù)在企業(yè)管理中應(yīng)用的升華，財(cái)務(wù)的4個功能層次形象筑起管理會計(jì)的堅(jiān)實(shí)基礎(chǔ)：

• 【看得見】：是指基礎(chǔ)核算功能，經(jīng)濟(jì)業(yè)務(wù)活動應(yīng)及時反映在財(cái)務(wù)數(shù)據(jù)中；
• 【說得清】：強(qiáng)調(diào)數(shù)據(jù)的可靠性，財(cái)務(wù)是業(yè)務(wù)的反映，業(yè)務(wù)與財(cái)務(wù)是一個閉循環(huán)，不是憑空而來。結(jié)合業(yè)務(wù)，分析業(yè)務(wù)問題所在；
• 【管得住】：則是預(yù)算系統(tǒng)在財(cái)務(wù)流程中的具現(xiàn)，并實(shí)現(xiàn)費(fèi)用控制；
• 【指得準(zhǔn)】：是指趨勢預(yù)測，通過管理會計(jì)平臺指明業(yè)務(wù)發(fā)展方向，實(shí)現(xiàn)賦能業(yè)務(wù)、數(shù)據(jù)驅(qū)動的最高境界。

做好管理會計(jì)，核算是基礎(chǔ)，分析是關(guān)鍵，管控是抓手，賦能是核心。

分析不僅僅是傳統(tǒng)的報(bào)表分析，而是基于大數(shù)據(jù)、機(jī)器學(xué)習(xí)、AI等高科技手段，自動化、準(zhǔn)確、智能的實(shí)現(xiàn)風(fēng)險(xiǎn)預(yù)警、趨勢預(yù)測，引領(lǐng)、驅(qū)動企業(yè)發(fā)展。

舉個栗子：每月關(guān)賬后財(cái)務(wù)都要做財(cái)務(wù)分析，收集各種業(yè)務(wù)、財(cái)務(wù)數(shù)據(jù)，結(jié)合相關(guān)指標(biāo)，以發(fā)現(xiàn)業(yè)務(wù)中的問題。如做杜邦分析法，分析凈資產(chǎn)收益率。

繼而計(jì)算總資產(chǎn)凈利率，權(quán)益乘數(shù)，銷售凈利率、總資產(chǎn)周轉(zhuǎn)率……通過實(shí)際與預(yù)測的橫向?qū)Ρ?、基期與歷史的縱向?qū)Ρ龋页龈鞣N指標(biāo)異動原因，實(shí)質(zhì)是分析企業(yè)的贏利能力、營運(yùn)能力、償債能力。

但這些通用的指標(biāo)需結(jié)合企業(yè)實(shí)際情況、歷史數(shù)據(jù)，并體系化形成產(chǎn)品，才能分析出癥結(jié)點(diǎn)所在，這也是管理會計(jì)平臺建設(shè)的意義與努力的方向。

二、產(chǎn)品架構(gòu)

如何搭建管理會計(jì)平臺（以下簡稱管會平臺）呢？互聯(lián)網(wǎng)管理會計(jì)平臺，其實(shí)并不是一個單一的平臺，而是由眾多關(guān)聯(lián)子系統(tǒng)構(gòu)成，通過多個子系統(tǒng)間協(xié)同合作完成管理會計(jì)目標(biāo)的系統(tǒng)集。

從前端用戶的視角來看，獲取管理報(bào)表是一個很簡單的動作：查詢相關(guān)主體公司管理報(bào)表或分析結(jié)果即可，但從系統(tǒng)角度來說，管理會計(jì)的建設(shè)過程實(shí)際涉及了眾多財(cái)務(wù)子系統(tǒng)的協(xié)同、及復(fù)雜的系統(tǒng)邏輯。

一個典型的財(cái)務(wù)產(chǎn)品架構(gòu)如下圖，涉及多個子系統(tǒng)。典型管理會計(jì)產(chǎn)品分為生產(chǎn)端與消費(fèi)端，架構(gòu)圖如下：

在簡要介紹各子系統(tǒng)功能前，可以先看以下簡化版的管會平臺產(chǎn)品架構(gòu)圖，典型的管會平臺產(chǎn)品架構(gòu)可以劃分為四層結(jié)構(gòu)：支撐層、數(shù)據(jù)層、核心層、應(yīng)用層：

1. 支撐層

用來支持管會平臺的基礎(chǔ)服務(wù)和基礎(chǔ)設(shè)施，包括容器云、安全服務(wù)、存儲服務(wù)、消息引擎、任務(wù)高度、短信服務(wù)、證書服務(wù)等。

2. 數(shù)據(jù)層

匯集業(yè)務(wù)、財(cái)務(wù)數(shù)據(jù)，以大數(shù)據(jù)或數(shù)據(jù)湖的形式承載基礎(chǔ)數(shù)據(jù)，包括ETL、BI、大數(shù)據(jù)等。

3. 核心層

管會平臺的核心模塊，分為清結(jié)算、財(cái)務(wù)中臺、ERP、預(yù)算、管報(bào)中心五大塊；

1）清結(jié)算

主要由計(jì)價(jià)、清分、結(jié)算、對賬組成，是業(yè)務(wù)活動在財(cái)務(wù)的2個反映之一，解決互聯(lián)網(wǎng)業(yè)態(tài)中的成本費(fèi)用結(jié)算，與傳統(tǒng)企業(yè)的成本計(jì)量方法不同的是，一般是按個別計(jì)價(jià)法對不同時間段可以階段性、階梯性等復(fù)雜業(yè)態(tài)成本計(jì)量。

2）財(cái)務(wù)中臺

主要針對業(yè)務(wù)中非審批類的收入、資產(chǎn)折舊、攤銷，自動對賬、生成分錄，并傳遞至ERP，主要包括：入賬規(guī)則、數(shù)據(jù)校驗(yàn)、分錄生成、主數(shù)據(jù)等。

3）預(yù)算模塊

預(yù)算功能，包含預(yù)算編制、執(zhí)行等，結(jié)合BPM審批流，實(shí)現(xiàn)費(fèi)用控制。

4）ERP

財(cái)務(wù)核心入賬平臺，包括總賬、應(yīng)收、應(yīng)付、資產(chǎn)、財(cái)報(bào)等。

5）管報(bào)中心

管會平臺核心輸出層，包括生產(chǎn)端和消費(fèi)端2部分，生產(chǎn)端分為指標(biāo)集、規(guī)則引擎、模板、預(yù)處理、智能診斷等模塊。消費(fèi)端主要是管報(bào)產(chǎn)出結(jié)果的展示即駕駛艙、手工確認(rèn)或修正。

管報(bào)中心是核心中的核心，后面第三章會詳細(xì)展開。

4. 應(yīng)用層

通過支撐層、數(shù)據(jù)層、核心層提供的服務(wù)組合起來，對最終用戶、運(yùn)營管理人員提供的系統(tǒng)。在產(chǎn)品架構(gòu)層面體現(xiàn)為前端展示層、業(yè)務(wù)域和過程域。前端展示層主要是結(jié)果展示的形式，如PC端的web頁面、移動端的APP或H5、小程序等。

業(yè)務(wù)域是上游的各業(yè)務(wù)系統(tǒng)，而過程域是管會平臺所依賴的流程工具、特征數(shù)據(jù)，如供應(yīng)商、ORG、BPM等。

三、管報(bào)中心

管報(bào)中心由生產(chǎn)端和消費(fèi)端組成：

• 生產(chǎn)端：諸如“成本費(fèi)用率”、“速動比率”等指標(biāo)集實(shí)現(xiàn)可視化、配置式的增加、禁用，再關(guān)聯(lián)規(guī)則引擎的會計(jì)科目、計(jì)算規(guī)則，提供給預(yù)處理模塊消費(fèi)，并通過智能診斷產(chǎn)出相關(guān)指標(biāo)的因果解析或預(yù)警信息；
• 消費(fèi)端：以駕駛艙的形式將相關(guān)結(jié)果展示給用戶。如對結(jié)果疑義時，還可手工修正。

1. 生產(chǎn)端

生產(chǎn)端流程圖如下：

【指標(biāo)集】：配置各種指標(biāo)，如“速動比率”、“產(chǎn)品成本費(fèi)用率”等。一旦配置不得刪除，只可修改或禁用。上游是科目與計(jì)算規(guī)則，但校驗(yàn)關(guān)系不在此模塊。

【模板】：指標(biāo)、預(yù)警或診斷信息的集合，可導(dǎo)入或手工增加。在預(yù)處理和結(jié)果展示時，將會調(diào)用此模板。

【規(guī)則引擎】：由“科目規(guī)則”、“計(jì)算規(guī)則”、“指標(biāo)規(guī)則”、“預(yù)警規(guī)則”四部分組成。

• 科目規(guī)則，依賴主數(shù)據(jù)的會計(jì)科目，在此設(shè)置科目間依賴關(guān)系、重分類關(guān)系、借貸方向。如應(yīng)收賬款與，余額應(yīng)在借方；如果出現(xiàn)貸方，則可能是預(yù)付賬款，重分類時應(yīng)放在預(yù)付賬款。如流動資產(chǎn)由貨幣資金、銀行存款、短期投資、應(yīng)收票據(jù)、應(yīng)收賬款和存貨構(gòu)成。
• 計(jì)算規(guī)則，簡單的如加減乘除、取模、求余等，復(fù)雜的如貝葉斯推理。后臺預(yù)設(shè)，前端界面可自定義設(shè)置各種指標(biāo)的計(jì)算規(guī)則。
• 指標(biāo)規(guī)則，指標(biāo)與指標(biāo)之間的邏輯關(guān)系，如“總資產(chǎn)凈利率 = 銷售凈利率 * 總資產(chǎn)周轉(zhuǎn)率”、“ 銷售凈利率 = 凈利潤/主營業(yè)務(wù)收入凈額”等等。
• 預(yù)警規(guī)則，包括觸發(fā)開關(guān)、預(yù)警信息模板，預(yù)警條件、主因判定等。如下圖杜邦分析法對A公司進(jìn)行分析預(yù)警：

在每一層指標(biāo)中，有實(shí)際值、預(yù)測值，二者之間的偏離度，就是預(yù)警條件；“好”、“差”就是簡單的信息模板，可把具體原因也納入進(jìn)來。

主因判定實(shí)質(zhì)是一個由上到下的遞歸過程，如此例中，A公司獲利能力（即資本報(bào)酬率）相對較差(3.08%<7.41%)，這是第1層判斷。

再往第2層，經(jīng)過分析可知這不是因?yàn)榭傎Y產(chǎn)凈利潤差(2.55%>2.37%)，而是財(cái)務(wù)融資能力差(1.21<3.21)。如此類推，直至分析至底層科目級指標(biāo)。

【預(yù)處理】分為“重分類”、“平衡試算”、“定時任務(wù)”、“結(jié)果存儲”四部分，是報(bào)表產(chǎn)出的運(yùn)算過程。其中“平衡試算”屬前置數(shù)據(jù)校驗(yàn)，檢查數(shù)據(jù)是否達(dá)到報(bào)表可用程度?！岸〞r任務(wù)”與“結(jié)果存儲”屬技術(shù)性過程，“重分類”根據(jù)會計(jì)要求設(shè)置，具體由財(cái)務(wù)確定。

【智能診斷】是對具體的報(bào)表進(jìn)行分析，由“診斷開始（數(shù)據(jù)準(zhǔn)備）”、“規(guī)則判斷”、“預(yù)警判斷”、“結(jié)果確認(rèn)”四部分。其中結(jié)果確認(rèn)包含結(jié)果展示、消息分發(fā)、手工修正等?！耙?guī)則判斷”與“預(yù)警判斷”是對【規(guī)則引擎】中的“指標(biāo)規(guī)則”、“預(yù)警規(guī)則”的具象應(yīng)用，實(shí)際應(yīng)用中可引入AI、TensorFlow(機(jī)器學(xué)習(xí))等技術(shù)手段提升診斷的準(zhǔn)確度。

2. 消費(fèi)端

在生產(chǎn)端準(zhǔn)確、及時生產(chǎn)出數(shù)據(jù)后，消費(fèi)端就不愁無米下鍋了。一般通過Dashboard或駕駛艙展示，這一塊通常需要BI或數(shù)倉部門的協(xié)助，效果圖如下：

四、總結(jié)

綜合以上，管會平臺的每個子系統(tǒng)并非孤立的，通過產(chǎn)品架構(gòu)相互關(guān)聯(lián)。產(chǎn)品架構(gòu)與技術(shù)架構(gòu)相輔相成，產(chǎn)品架構(gòu)決定需求和設(shè)計(jì)，技術(shù)架構(gòu)決定技術(shù)框架和性能。包括AI在智能診斷上的應(yīng)用、數(shù)據(jù)域的實(shí)現(xiàn)等。

好的產(chǎn)品架構(gòu)將這些不同用途的功能進(jìn)行聚類整合，因此，【才聽途說】建議將管會平臺拆分成多個子系統(tǒng)，明確業(yè)務(wù)邊界，減少系統(tǒng)間的耦合，提供優(yōu)質(zhì)、的管理決策支持服務(wù)。

并根據(jù)前端業(yè)務(wù)場景的需求隨時進(jìn)行調(diào)整變化以適應(yīng)業(yè)務(wù)的發(fā)展，如規(guī)則引擎部分基本可由前端配置即可，減少后端開發(fā)與產(chǎn)品上線時間。

不同互聯(lián)網(wǎng)公司，業(yè)務(wù)體量甚至有成千上萬倍的差距，如京東集團(tuán)內(nèi)不同BU的體量及發(fā)展速度造就其系統(tǒng)復(fù)雜度也差異巨大，高度復(fù)雜的管會平臺甚至需要數(shù)百人的技術(shù)團(tuán)隊(duì)來設(shè)計(jì)、開發(fā)、維護(hù)。

不過，對于體量較小的互聯(lián)網(wǎng)公司來說，幾人的團(tuán)隊(duì)即可搭建一套系統(tǒng)并維護(hù)日常運(yùn)營。

互聯(lián)網(wǎng)企業(yè)作為金融科技業(yè)界引領(lǐng)者，建議在系統(tǒng)開發(fā)前期（從0到1），以MVP形式，小步快跑，快速迭代，盡快上線、降低開發(fā)成本，優(yōu)先開發(fā)主要需求、及較重要的子系統(tǒng)，或并行實(shí)施幾個子系統(tǒng)，如ERP的實(shí)施、清結(jié)算的開發(fā)、管報(bào)中心的開發(fā)可以并行。再做次優(yōu)級子系統(tǒng)，逐步迭代。

隨著訂單量的提升及業(yè)務(wù)復(fù)雜度的增加，不同BU甚至不同BGBU的接入，管會平臺復(fù)雜度將指數(shù)及上升，系統(tǒng)處理起來會越來越吃力，若無良好的規(guī)劃，各子系統(tǒng)耦合度越來越高，雜糅在一起，系統(tǒng)靈活性越來越差，無法跟上業(yè)務(wù)的發(fā)展。

因此，管會平臺的中長期發(fā)展（從1到100、到∞），極其考驗(yàn)我們的業(yè)務(wù)梳理能力，及對業(yè)務(wù)進(jìn)行拆分、產(chǎn)品架構(gòu)的能力。

特別是目前行業(yè)內(nèi)還沒有體系化的管會平臺建設(shè)經(jīng)驗(yàn)可參考時，更考驗(yàn)我們的綜合能力，包括財(cái)務(wù)專業(yè)知識、業(yè)務(wù)理解力、產(chǎn)品規(guī)劃能力。

但萬事不要怕，只要抓住產(chǎn)品設(shè)計(jì)精髓，即設(shè)計(jì)的產(chǎn)品應(yīng)滿足邏輯完整、業(yè)務(wù)功能明確、可擴(kuò)展（發(fā)展方向明確但業(yè)務(wù)邊界清晰）、靈活（非耦合）等特點(diǎn)，一切將會迎刃而解。