三、規(guī)劃頁面構(gòu)圖

講到設(shè)計(jì)初期的頁面構(gòu)圖規(guī)劃問題，其實(shí)這個(gè)構(gòu)圖是服從你的展示方式的，即故事線。設(shè)計(jì)前期規(guī)劃階段，先想好打算怎么表達(dá)，再選擇對(duì)應(yīng)的構(gòu)圖方式。表達(dá)上我們講究總分主次關(guān)系 ，那么構(gòu)圖上依舊遵循這個(gè)規(guī)則，先具體再抽象。

（一）全屏平鋪式

全屏平鋪式的構(gòu)圖方式是最常見的一種構(gòu)圖方式，如下圖無意中構(gòu)成橫平豎直的輔助線將內(nèi)容一格一格展現(xiàn)出來，界線清晰分割明確。因此模塊之內(nèi)的內(nèi)容就會(huì)顯得格外的清楚和突出，給人一目了然的感覺。注意哦，平鋪并不代表完全一個(gè)一個(gè)格子碼好，比如下圖中的深紅色區(qū)域，沒有被網(wǎng)格框住但也碼的很清楚，淺紅色區(qū)域中有一對(duì)一的也有一對(duì)二的對(duì)應(yīng)關(guān)系，故此類型的構(gòu)圖中加上這些靈活的變化就會(huì)顯得沒那么生硬。并且這種構(gòu)圖方式是遵循F型網(wǎng)頁閱讀習(xí)慣的，因此重要內(nèi)容放哪大家知道了吧~

（二）中心放射式

圓形就是一個(gè)典型的中心放射式，圓是有圓心的，通過構(gòu)造不同大小的同心圓起到聚焦、凸顯作用。伴隨一個(gè)一個(gè)同心圓自然而然形成放射線，把重要表述放中間，其他表述按照放射線編排起來。引導(dǎo)用戶的視線聚集在我們重點(diǎn)突出的功能點(diǎn)上，先主后次，有起有落。

（三）視線引導(dǎo)式

視線引導(dǎo)式主要是依靠點(diǎn)線面的關(guān)系形成一條清晰的視覺引導(dǎo)線，引導(dǎo)用戶的視線，避免雜亂無章的堆砌。視線流動(dòng)的軌跡多則是從上至下從左到右移動(dòng)，故在大屏上從左到右，從主到次，減小用戶的負(fù)擔(dān)和閱讀疲勞。如下圖是我同事做的一張大屏，指標(biāo)瑣碎，每個(gè)指標(biāo)與指標(biāo)間沒有太強(qiáng)的相關(guān)性。當(dāng)時(shí)發(fā)現(xiàn)大方向上有一定的前后關(guān)系，故最后用這種方式把數(shù)據(jù)串起來。設(shè)計(jì)稿上需要把樣式給全，看上去有點(diǎn)碎，實(shí)際開發(fā)后效果還是蠻不錯(cuò)。

（四）水平羅列式

水平羅列式的構(gòu)圖方式有點(diǎn)像全屏平鋪式，同樣是利用人從左至右的閱讀習(xí)慣。如下圖，不一樣的是四個(gè)大類有明顯的前后關(guān)系，并且彼此之間存在對(duì)比。利用無形之中形成的水平線條把內(nèi)容串在一起，將同級(jí)且對(duì)比的意思表達(dá)出來。

（五）三角排列式

三角排列式的構(gòu)圖方式，核心思想就是一個(gè)穩(wěn)！從上至下的三角構(gòu)圖，能把信息層級(jí)羅列得更為規(guī)整和明確。這張大屏是我做的某地?cái)?shù)字駕駛艙中的一個(gè)分頁，用來總覽這個(gè)分支的三個(gè)內(nèi)容，每塊內(nèi)容上面是政策解讀下面是數(shù)據(jù)結(jié)果，清晰明確。

四、營造頁面氛圍

頁面的氛圍個(gè)人主要認(rèn)為是通過恰到好處的細(xì)節(jié)堆砌出來，這些細(xì)節(jié)要自然合適不突兀，講究一個(gè)“巧”字。對(duì)于我來說這些細(xì)節(jié)就好像歐亨利小說的結(jié)局一樣，意料之外又在情理之中。不過講道理這些氛圍的東西并沒有很明顯的一定之規(guī)，有些方法在這個(gè)場景下合適在那個(gè)場景下就不合適了，需要設(shè)計(jì)師在做的時(shí)候不斷嘗試，也是一個(gè)緣分。

抄現(xiàn)實(shí)是我們?cè)谠O(shè)計(jì)中最直接的也是最常用的一種表達(dá)方式，它的含義就是提取現(xiàn)實(shí)中存在事物的點(diǎn)線面關(guān)系。因此往往在發(fā)散思維中找到與主題相關(guān)的靈感點(diǎn)后，用方式提取其中的內(nèi)容后，能緊密的結(jié)合主題。它將抽象的主題通過實(shí)體表達(dá)出來，并以之作為內(nèi)容信息的載體，能夠合適的存在于頁面之中。這個(gè)緯度的內(nèi)容我直接舉幾個(gè)案例描述下。

（一）案例-公安項(xiàng)目中的細(xì)節(jié)

公安的項(xiàng)目是我同事做的，在用戶那邊得到了一致的好評(píng)，并且也是團(tuán)隊(duì)前期重點(diǎn)研究的一個(gè)DEMO。這個(gè)項(xiàng)目好在業(yè)務(wù)邏輯清晰，并且在表達(dá)方式上做到合理合適的程度。如下是項(xiàng)目其中一張大屏的一處細(xì)節(jié)，需求是需要排列公安系統(tǒng)中處置人員的不同分布，在大屏中也是核心區(qū)域。

一般在頁面核心區(qū)域我們會(huì)花點(diǎn)心思將這塊的內(nèi)容做充實(shí)做飽和，畢竟第一眼需要留下好印象。設(shè)計(jì)的時(shí)候提取了警徽的基礎(chǔ)形狀、警徽的構(gòu)成、胸徽的線條排布、旌旗的基礎(chǔ)形狀、放射線的構(gòu)圖方式，然后將文案排布形成設(shè)計(jì)結(jié)果。最后客戶這邊對(duì)于這塊內(nèi)容直接過稿，認(rèn)為設(shè)計(jì)環(huán)節(jié)帶出了警隊(duì)的特色，給了高度的評(píng)價(jià)。

（二）案例-駕駛艙項(xiàng)目中的細(xì)節(jié)

駕駛艙的項(xiàng)目是我直接參與主導(dǎo)的，當(dāng)時(shí)這個(gè)項(xiàng)目的歡迎屏風(fēng)格稿做了好幾版本的，用戶一直都不認(rèn)可。過程中去除主觀因素，總結(jié)用戶對(duì)于駕駛艙的認(rèn)知和理解?？蛻舻男枨笫邱{駛艙需要在“駕駛”的時(shí)候，眼中不光有艙內(nèi)的內(nèi)涵，也要有艙外的風(fēng)景。如下是歡迎屏的基礎(chǔ)狀態(tài)（交互操作并未展開），設(shè)計(jì)的時(shí)候提取了汽車儀表盤的基礎(chǔ)形狀和風(fēng)格組成、星光點(diǎn)與點(diǎn)的關(guān)系、逆光山體風(fēng)景的天空漸變，然后組合在一起形成設(shè)計(jì)結(jié)果。最后客戶這邊看到后過稿，這個(gè)設(shè)計(jì)也留到了項(xiàng)目最后。

（三）案例-大佬作品山海經(jīng)中的細(xì)節(jié)

如下的作品是behance上一個(gè)大佬的作品，作品的名字叫做山海經(jīng)，我們也是經(jīng)常拿出來學(xué)習(xí)參考。在人物設(shè)定中，作者將古代的烏紗帽、官服、官徽紋樣等內(nèi)容融入角色的道化服之中，并且角色周邊環(huán)境中大量融入一些官府的元素，比如官兵舉得牌子、衙門的建筑體等。整個(gè)作品雖然融入大量的古代元素，但是用賽博朋克的方式表達(dá)出來，成品沒有一絲違和感。確實(shí)給了大家一個(gè)方向，原來國風(fēng)的東西可以這么玩。

總結(jié)

1.使用足夠并且容易區(qū)分層級(jí)的顏色去構(gòu)造頁面。數(shù)據(jù)可視化的項(xiàng)目往往信息的量級(jí)是不可控的，準(zhǔn)備工作需要做充分。

2.合適的字體能讓你的頁面事半功倍。挑選字體得對(duì)比，確保不同的使用場景下有一致性的顯示。條件允許下，針對(duì)自身業(yè)務(wù)場景打造對(duì)應(yīng)的顯示字體（羨慕臉.jpg）

3.好的構(gòu)圖可以讓表達(dá)更上一個(gè)臺(tái)階。根據(jù)故事線的講述，挑選對(duì)應(yīng)的構(gòu)圖方式，做到從總到分、有主有次。

4.氛圍彰顯作品的細(xì)膩程度。細(xì)節(jié)決定成敗，在作品中增添“巧”的細(xì)節(jié)，會(huì)讓觀賞者更加投入獲取信息的節(jié)奏中。

文章來源：tob.design        作者：王亮亮同學(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ù)

前言

從入行到如今的這些年中，眼中的設(shè)計(jì)風(fēng)格不斷變化。伴隨這些年行業(yè)的興起，從最早的擬物風(fēng)到現(xiàn)在的內(nèi)容當(dāng)?shù)溃絹碓蕉嗟脑O(shè)計(jì)師參與其中，為行業(yè)貢獻(xiàn)著自己的理解。但也發(fā)現(xiàn)同質(zhì)化的現(xiàn)象越趨明顯，個(gè)人認(rèn)為這里面有設(shè)計(jì)師本身的問題，也有行業(yè)風(fēng)氣的問題。同質(zhì)化的現(xiàn)象有很多的組成因素，可能是頁面視覺是直接的拿來主義，亦可能是脫離不了舒適圈的習(xí)慣為之。

我很擔(dān)心的一件事情就是我們一味的反對(duì)同質(zhì)化的假，最后會(huì)演變成另外一種假。是一味的擯棄，還是部分的接納。這是一個(gè)界限的問題，而這個(gè)界限我還沒想明白。如今風(fēng)格太現(xiàn)成，都像麥當(dāng)勞一樣，思想的麥當(dāng)勞，短暫的吃下去了，飽了，不去想了。這個(gè)慣性思維很可怕，最可怕的是可能有段時(shí)間自身都意識(shí)不到這個(gè)問題。

那么如何跳出這個(gè)慣性思維？我這邊借用馮小剛導(dǎo)演在十三邀里說的一段話來解釋。創(chuàng)作過程太正常很多時(shí)候是經(jīng)驗(yàn)在發(fā)揮作用，每次都和自己的經(jīng)驗(yàn)作斗爭，最后可能會(huì)出現(xiàn)一個(gè)在經(jīng)驗(yàn)之外又讓自己激動(dòng)的東西。簡而言之就是革了自己的命?？赡苣奶煳蚁朊靼走@個(gè)問題，會(huì)再寫一章如何創(chuàng)新來講這個(gè)問題。

那么本章主要講我們是如何在前期定義一張大屏的風(fēng)格？主要可以從幾個(gè)方面來講：配色、字體、構(gòu)圖、氛圍。

一、定義頁面配色

定義大屏配色的前提是對(duì)于用戶的政務(wù)有著充分的調(diào)研，明白是主管哪個(gè)行業(yè)的，分別用對(duì)應(yīng)的色系去定調(diào)子。

舉個(gè)例子，生物醫(yī)藥、環(huán)保等行業(yè)通常選用能表達(dá)健康安全的綠色；公安、教育、政府等通常選用能表達(dá)科技未來的藍(lán)色；消費(fèi)業(yè)、服務(wù)業(yè)等行業(yè)通常選用能表達(dá)熱鬧、朝氣的暖色調(diào)。

它們有個(gè)共性就是主色調(diào)不管傾向于哪個(gè)顏色，背景通常是對(duì)應(yīng)顏色的暗色系。因?yàn)榭梢暬笃潦褂铆h(huán)境通常是在室內(nèi)、展廳等這種外部環(huán)境比較暗的地方，避免對(duì)于觀賞者視覺上的不適應(yīng)。而且這也有幫助觀賞者對(duì)于數(shù)據(jù)的聚焦比對(duì)的工作，暗色調(diào)的背景加上高亮的配色，也容易在界面中將層次做出來，這點(diǎn)特別適用與3D城市的構(gòu)建，以后我們會(huì)講述如何在城市中做出層次對(duì)比的方法。

色彩心理學(xué)普遍還是適用于可視化大屏的，顏色對(duì)于人意識(shí)的傾向性還是比較強(qiáng)烈的。但是需要明確的是在數(shù)據(jù)可視化領(lǐng)域中，有些配色規(guī)則并不適用。在傳統(tǒng)UI設(shè)計(jì)中我們一般會(huì)擬訂主色輔色特殊狀態(tài)色，甚至在灰階會(huì)把標(biāo)題、正文、背景的顏色區(qū)分做全。這樣做的好處就組件一致性，給人統(tǒng)一的感覺。數(shù)據(jù)可視化一般會(huì)定一個(gè)主基調(diào)，圍繞這個(gè)主基調(diào)會(huì)用至少5-6中以上的調(diào)色板進(jìn)行設(shè)計(jì)。

（一）使用足夠并且容易區(qū)分層級(jí)的顏色種類

假設(shè)我們需要做一個(gè)政務(wù)的可視化系統(tǒng)，在設(shè)計(jì)初期敲定了以靛藍(lán)（H:200）為主色調(diào)的設(shè)定。那么我們會(huì)尋找在這個(gè)顏色周邊的鄰近色去做這個(gè)靛藍(lán)色調(diào)的搭配，比如在青（H:180）和深藍(lán)（H:220），使得整個(gè)大面積的色彩整體上過渡會(huì)比較自然。通過對(duì)純度S和明度B的調(diào)節(jié)，我們可以找到很多色調(diào)用于數(shù)字、文字、點(diǎn)線面等視覺元素。然后在靛藍(lán)色調(diào)的對(duì)比色上去尋找用于高亮的展示，比如綠（H:120）這類的，起到強(qiáng)化主色調(diào)的層級(jí)作用。最后找到靛藍(lán)色的互補(bǔ)色左右的紅（H:10）和黃（H:45）用于重點(diǎn)強(qiáng)調(diào)內(nèi)容。主色調(diào)的互補(bǔ)色需要少量并且珍惜的使用，需要有但不是大面積得使用。

色彩是為了突出內(nèi)容的重要信息，請(qǐng)有選擇、有策略的使用顏色，切勿濫用。配色沒有絕對(duì)的好壞，只有在當(dāng)前場景下是否適合，色環(huán)理論只能大致告訴你一些配色的方式，最重要的是靠設(shè)計(jì)師自己眼睛去感受顏色帶來的沖擊力。上述的配色方式僅僅是我們工作的一個(gè)慣用方式，不同項(xiàng)目敲定的內(nèi)容也不同，請(qǐng)靈活使用。

當(dāng)然我們?cè)谶@邊提及的色調(diào)并不是一個(gè)確定的值，而是圍繞選定顏色周邊的一個(gè)色域。可能在文字或者數(shù)字上會(huì)沿用傳統(tǒng)UI的規(guī)則，保持特定的統(tǒng)一。但是在點(diǎn)線面、配飾、特殊狀態(tài)的觸發(fā)等元素上使用這些色域去提高整個(gè)界面的層次和細(xì)節(jié)，使得畫面沒有那么硬，各個(gè)板塊之間是有舒服得過渡。這里的色域以前是需要自己將色調(diào)于黑白二色融合的漸變中選取不同位置的顏色組成色板，如今AntDesign的輪子比較友好，填入主色就可以對(duì)應(yīng)生成有層級(jí)的顏色。

我們上述的配色方案是有傾向觀賞展示型的，由于用戶使用大屏普遍都是匯報(bào)展覽并且用戶樣本容量小。故在表達(dá)的過程中大量借鑒了運(yùn)營設(shè)計(jì)的方式方法，因此配色方式存在包容性不夠的現(xiàn)象，對(duì)于色盲色弱的人群是有障礙的。比如青色、藍(lán)色、紫色在色域展開的過程中，選取其中幾個(gè)顏色做疊加色板樣式時(shí)，灰色模式下存在顏色拉不開的現(xiàn)象?？赡苁恰八{(lán)色”是對(duì)色障人群最友好的顏色，AntV保留MPC疊加色板，但同時(shí)在使用建議中也寫明推薦使用MOB疊加色板。

在數(shù)據(jù)可視化領(lǐng)域中，還需要界定清楚你做的是偏向觀賞展示型的還是偏向?qū)崙?zhàn)分析型。這兩者的區(qū)別主要在觀賞性的數(shù)據(jù)可視化往往需要大量的視覺語言去烘托氣氛、用輔助性的元素去增強(qiáng)觀賞的趣味。實(shí)戰(zhàn)分析型的主要是需要消除不必要的視覺雜音、強(qiáng)化傳達(dá)的力度。因此這就是一個(gè)尺度的問題，是偏向品牌創(chuàng)意的手法多一點(diǎn)，還是偏向傳統(tǒng)UI的手法多一點(diǎn)，君可自決~

（二）反面案例解析

以下的案例是我自己工作中犯的錯(cuò)誤，拿出來共勉（捂臉233333）。做的時(shí)候由于可視化的經(jīng)驗(yàn)并不是很多，在選用顏色的過程中并沒有把顏色的層級(jí)拉的特別開，導(dǎo)致長時(shí)間觀賞容易產(chǎn)生識(shí)別不清的問題，進(jìn)一步講有可能在比對(duì)數(shù)據(jù)過程中產(chǎn)生認(rèn)知障礙。回首一看，中央的核心區(qū)插畫的比重大于數(shù)據(jù)本身要表達(dá)的內(nèi)容，出現(xiàn)了喧賓奪主的情況。這也是一些設(shè)計(jì)師容易犯的錯(cuò)誤，需要再次明確所有的手法和表達(dá)方式都是服從一個(gè)原則，即清晰有效地傳達(dá)與溝通信息。

設(shè)想一下，一個(gè)充滿數(shù)據(jù)的界面本身就是會(huì)伴隨視覺疲勞的。人是有惰性的，會(huì)自然的抗拒一些不清晰不明確的展現(xiàn)方式。數(shù)據(jù)可視化在我們理解中就是通過設(shè)計(jì)師清晰有效地傳達(dá)與溝通信息，使人有能力抗拒自己的惰性去從枯燥的數(shù)據(jù)中分析出超額信息。

二、挑選頁面字體

數(shù)據(jù)可視化和大量數(shù)字打交道，選對(duì)數(shù)字的字體挺重要的。涉及到字體版權(quán)的問題請(qǐng)自行解決，在推薦字體之前有兩件事情需要注意下：

第一、文字習(xí)慣左對(duì)齊，數(shù)字習(xí)慣右對(duì)齊。文字左對(duì)齊是人一般從左至右閱讀，數(shù)字右對(duì)齊能夠快速識(shí)別數(shù)據(jù)量的大小，容易與其他數(shù)據(jù)比對(duì)。因此在選用數(shù)字字體的時(shí)候，盡量使用字間距相同的字體（比如Lato字體和DIN字體，注意PS中比對(duì)的時(shí)候需要選擇度量標(biāo)準(zhǔn)，使用視覺的字間距會(huì)有問題），這樣比對(duì)數(shù)據(jù)的時(shí)候字間距相同更容易產(chǎn)生比對(duì)結(jié)果。

第二、選用數(shù)字字體的時(shí)候需要檢查下常用字符是否有缺失、是否顯示正常。比如錢幣的符號(hào)“￥”和“$”以及“%”。還有就是“1”和“7”、“0”和“O”這兩個(gè)需要能夠清晰識(shí)別。（國外的很多字體是沒有人民幣的符號(hào)的，DIN的0和O并不是特別好識(shí)別，故很多公司會(huì)自己改良字體滿足自身業(yè)務(wù)的要求）

我們最長使用的就是思源黑體、思源宋體，開源并且字體庫全。缺點(diǎn)就是比較中性，在數(shù)字上辨識(shí)度不是很友好，因此我們?cè)跀?shù)字上最常使用的就是DIN字體。DIN 是德國標(biāo)準(zhǔn)協(xié)會(huì)，Deutsches Institut für Normung 的首字母縮寫。1975年起，德國政府把DIN作為國家標(biāo)準(zhǔn)體系，DIN 標(biāo)準(zhǔn)在國際和歐洲范圍內(nèi)被廣泛使用。DIN 字體繼承了嚴(yán)謹(jǐn)可識(shí)別度高，被廣泛運(yùn)用。

DIN也是有缺陷的，支付寶設(shè)計(jì)師SKY在專欄里也講過4的開頭較大，以及5，6字體的圓形不夠一致，7縮小后識(shí)別度問題，所以很多公司都會(huì)基于這些問題進(jìn)行二次設(shè)計(jì)，比如微信錢包、京東金融、百度金融都在一些地方對(duì)DIN字體進(jìn)行了微調(diào)后使用。

接下來我們直接推薦幾個(gè)有風(fēng)格的英文和數(shù)字字體給大家（私貨環(huán)節(jié)?。?/span>

（一）英文字體

1.Futura

Futura這個(gè)字體是我自己特別喜歡的一個(gè)字體，字體表現(xiàn)很現(xiàn)代，看上去特別利落，繼承了包豪斯的設(shè)計(jì)理念。

2.Optima

Optima也是我個(gè)人比較心水的一款，字體充滿人文主義。字體本身嚴(yán)格遵循了黃金分割原則，比例優(yōu)美，字里行間充滿了變化。

3.Garamond

Garamond簡直就是襯線體之中的典范，就這么說吧，經(jīng)典的設(shè)計(jì)中一定會(huì)出現(xiàn)他的身影。

4.Bodoni

Bodoni被譽(yù)為“現(xiàn)代主義風(fēng)格最完美的體現(xiàn)”。字體粗細(xì)對(duì)比強(qiáng)烈，給人浪漫的感覺。

5.Didot

Didot和Bodoni很相似，都是給人浪漫的感覺，不同的是Didot在數(shù)字上面做了不一樣的處理，兩者在電商上使用都蠻多的，一般用做價(jià)格顯示。

（二）數(shù)字字體

1.DIN

DIN被德國人視為“國民字體”，有著悠久的歷史。德國的路標(biāo)和路牌的標(biāo)準(zhǔn)字體就是DIN。其中的4這個(gè)設(shè)計(jì)挺有個(gè)性和特點(diǎn)的，容易辯識(shí)出來。除了前面說的問題，真的是精準(zhǔn)的徳國工藝阿（dog臉~）

2.lcdD

lcdD是常見的電子表數(shù)字的字體風(fēng)格，更加端正鮮明的視覺效果，運(yùn)用在數(shù)字提示等內(nèi)容上，傾斜風(fēng)的設(shè)計(jì)讓字體更有自己的獨(dú)特魅力。

3.Lato

Lato就是那種非常現(xiàn)代科技感的一款，并且具備了很多常用自己的特點(diǎn)，屬于那種用了不會(huì)出錯(cuò)的字體。

4.Avanti

Avanti和DIN在字形上是很相似的，但是它的字形更加飽滿。差異主要在3、5、8這三個(gè)數(shù)字以及G、Q都做了不一樣的處理，上半部較小而下半部較大，多了一些變化和趣味性。這個(gè)字體還有一個(gè)細(xì)體，一粗一細(xì)，靈活使用。

5.Tensans

Tensans和Avanti也很相似，如5和8上下部分的比例，6和9的轉(zhuǎn)折以及中圈部分都挺相似的，有點(diǎn)像Avanti字體的加粗版本。但是Tensans特征更加明顯，比如2、3、4、7的轉(zhuǎn)角尖銳，切角鋒利，具有很濃重的現(xiàn)代工業(yè)氣息，比較適合速度、剛猛、游戲等主題的設(shè)計(jì)。

6.Impact

Impact這個(gè)字體第一感覺就是厚重醒目，視覺沖擊力很強(qiáng)。特粗的筆畫、緊縮的間距以及狹窄的中宮，特別適合大標(biāo)題和醒目的價(jià)格展示。

7.BebasNeue

字體字面比較秀長，筆畫流暢，簡約大方。適用于化妝品、服裝等女性向。

8.Niagara-Solid

和上面哪個(gè)BebasNeue是有點(diǎn)相像的，字面細(xì)瘦，挺拔優(yōu)美。多了一些襯線體的字重和體勢(shì)的變化，設(shè)計(jì)感與裝飾感更強(qiáng)，尤為時(shí)尚，在女性、文化、時(shí)尚類中用的格外多。

9.Gaoel

Gaoel有著Avanti的韻味，但是更加年輕、圓潤，令人驚喜的是大寫的字母有著統(tǒng)一的特點(diǎn)，特別未來。不過需要注意的是該款沒有小寫，小寫就直接變成如下樣子。整體字體設(shè)計(jì)很圓潤，年輕化，可愛非常適合一些偏年輕化的產(chǎn)品，同時(shí)字重非常適合金融產(chǎn)品的字重效果！

10.Proxima Nova

Proxima Nova的style還是比較多的，我個(gè)人用的比較多還是在它的細(xì)體上做修改，比較纖細(xì)現(xiàn)代。

11.Gotham

Gotham號(hào)稱發(fā)布會(huì)字體，特別現(xiàn)代干凈的一款字體，這些年看到的較多是手機(jī)發(fā)布會(huì)的海報(bào)設(shè)計(jì)，纖細(xì)的字體壓在海報(bào)上很有力量。

12.Expansiva

Expansiva也是特別有個(gè)性的一款字體，用于做數(shù)字的也比較多，目前看到的可視化設(shè)計(jì)中存在，但是使用量并不多，由于字形骨骼的因素，用于數(shù)字上比較多。

文章來源：tob.design        作者：王亮亮同學(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ù)

黑川雅之，世界著名工業(yè)設(shè)計(jì)師，將建筑的思維融入工業(yè)設(shè)計(jì)中，并開創(chuàng)東方日式美學(xué)和西方工業(yè)設(shè)計(jì)思維融合的先河，甚至對(duì)后來原研哉和深澤直人的創(chuàng)作都有重要的影響。黑川雅之被稱為日本設(shè)計(jì)圈的達(dá)芬奇，作為日本建筑和工業(yè)造型設(shè)計(jì)界的代表人物，他個(gè)人本身就像是一部活的工業(yè)文明發(fā)展史。

說黑川雅之是日本戰(zhàn)后將日本傳統(tǒng)文化和西方現(xiàn)在工業(yè)設(shè)計(jì)完美結(jié)合的第一代設(shè)計(jì)師一點(diǎn)也不夸張。

在工業(yè)設(shè)計(jì)的世界里，黑川雅之將日式禪意美學(xué)與西方工業(yè)設(shè)計(jì)世界注重完整和功能性做了完美的融合。從他的工業(yè)設(shè)計(jì)中都可以看出來對(duì)空間和時(shí)間的反思和理解。

黑川雅之老師提倡設(shè)計(jì)應(yīng)該關(guān)注通感，而不該只是注重外在的表象和造型。所以，黑川老師強(qiáng)調(diào)在視覺設(shè)計(jì)之余，要更加關(guān)注設(shè)計(jì)對(duì)象對(duì)其余感官的刺激，尤其是觸覺。
代表作賞析——

結(jié)合傳統(tǒng)的手工藝與現(xiàn)代感的設(shè)計(jì)，最有代表性的作品系列是Irony鑄鐵壺系列。沙模鑄鐵本身記錄了鐵的演變過程，在鐵的表面能夠清晰地看到這一由溫度和時(shí)間共同留下的痕跡，驅(qū)散人們印象中光滑金屬表面的冷質(zhì)和距離感，金屬表面也可以被打造得溫潤自然，既粗糙又美麗。
GOM系列

上世紀(jì)70年代是塑料和金屬的全盛時(shí)期，也是注重視覺美感的年代，而GOM第一次以“材料”這個(gè)關(guān)鍵詞登場，對(duì)于黑川來說帶有向現(xiàn)代主義挑釁的意味。在他看來，如果說現(xiàn)代設(shè)計(jì)是日耳曼的理性審美意識(shí)和基督教價(jià)值觀下白皙光亮的形象，而橡膠吸光的、黯黑的表面含有危險(xiǎn)和不安的成分，黑色暗影有壞的意味，似乎是對(duì)明快現(xiàn)代設(shè)計(jì)的一種對(duì)抗。
PLPL餐具系列

在西方培養(yǎng)了盤子文化，在日本則演變?yōu)榱送氲奈幕?設(shè)計(jì)最重要的是通過款式、材料及材料的原始意義，將該物品周圍的獨(dú)特韻味表現(xiàn)出來。設(shè)計(jì)韻味，從而在人的內(nèi)心深處引起情感上的共鳴。
黑川雅之說——
含而不露
日本設(shè)計(jì)講求意境，不需要表達(dá)得太多，其余的要留給觀賞和使用者以想象的空間。強(qiáng)化觸感可以讓材料當(dāng)主角，款式的簡單給視覺上禪意之美。

返璞歸真
比起工業(yè)時(shí)代大規(guī)模生產(chǎn)語境下“追求體驗(yàn)”的產(chǎn)品，日本設(shè)計(jì)更加關(guān)注對(duì)“留白和空”的運(yùn)用。不刻意去追求完美，天然的情景下或許存在雜質(zhì)、存在結(jié)節(jié)、存在傷疤，但不完美本身也是一種完美，自然的哲理本身也包含著宇宙萬物制衡的道理。

關(guān)注偶然
不是什么事情都會(huì)在計(jì)劃下發(fā)生，人生充滿了偶然和不確定性，承認(rèn)并順應(yīng)偶然的存在才能迸發(fā)出無限的可能，設(shè)計(jì)也是一樣。就好像在制造鑄鐵壺的過程中，由于不可控的溫度和時(shí)間的作用，自然而隨機(jī)地形成大大小小的氣孔，這是偶然之力造就的美。

藍(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ù)

設(shè)計(jì)思維（Design Thinking）是通過提出有意義的創(chuàng)意和想法，來解決特定人群的實(shí)際問題。設(shè)計(jì)思維可以幫助各個(gè)專業(yè)背景的人通過創(chuàng)新的解決方案解決問題。在“設(shè)計(jì)思維”在被不同的學(xué)者提出之后，IDEO是第一家將設(shè)計(jì)思維應(yīng)用于商業(yè)問題的解決之中。IDEO的創(chuàng)始人，David Kelley，后來又在美國斯坦福大學(xué)創(chuàng)建了著名的D.School，斯坦福設(shè)計(jì)學(xué)院。

斯坦福設(shè)計(jì)學(xué)院將設(shè)計(jì)思維分成5大步驟：“Empathy同理心思考”、“Define需求定義”、“Ideate創(chuàng)意構(gòu)思”、“Prototype原型實(shí)現(xiàn)”、“Test實(shí)際測試”。下面具體闡述。

第1步：移情／同理心

移情就是對(duì)他人的情感或情緒感同身受的能力。

第一步的目的是進(jìn)行用戶研究，從而了解人們真正關(guān)心的東西，我們需要真正了解他們的處境，比較常用的方法是用戶訪談。

舉個(gè)例子，如果你想幫助老年人進(jìn)行設(shè)計(jì)，你可能會(huì)發(fā)現(xiàn)他們行動(dòng)能力下降，但是他們想保持走動(dòng)的能力。 在和他們進(jìn)行訪談的過程中，他們可能會(huì)與你分享他們實(shí)現(xiàn)目標(biāo)的不同方法。 在訪談后期可以進(jìn)行深入挖掘，尋找個(gè)人故事或比較極端的場景。 理想情況下，你可以與多個(gè)訪談?wù)呷酥刈龃诉^程。

當(dāng)然用戶研究的方法不僅于此，還可以：

·進(jìn)行民意調(diào)查或組件焦點(diǎn)小組進(jìn)行調(diào)查。

·勤發(fā)電子郵件，了解受眾對(duì)當(dāng)前活動(dòng)的反饋。

·統(tǒng)計(jì)數(shù)據(jù)、視覺跟蹤軟件也能派上大用場。

·嵌入代碼，觀察設(shè)計(jì)元素對(duì)交互的影響。

·通過社交網(wǎng)絡(luò)、親身交流對(duì)交互效果進(jìn)行監(jiān)控。

·對(duì)你的受眾進(jìn)行群體劃分，了解不同群體對(duì)相似的產(chǎn)品、品牌或設(shè)計(jì)的反應(yīng)。

第2步：定義問題

通過訪談，你現(xiàn)在可以了解人們?cè)谔囟ɑ顒?dòng)中實(shí)現(xiàn)的實(shí)際需求。 一種方法是對(duì)受訪者在談?wù)撍麄兊膯栴}時(shí)提到的動(dòng)詞或活動(dòng)進(jìn)行重點(diǎn)分析：比如他們會(huì)說，他們喜歡去散步，結(jié)識(shí)老朋友喝茶，或者在街角商店購物。 通過深入分析，透過表面你可能會(huì)意識(shí)到，這不是老年人喜歡外出，而是他們希望彼此保持聯(lián)系。 分析后，制定一個(gè)問題陳述：“有些老人害怕孤獨(dú)。 希望保持聯(lián)系。

第3步：創(chuàng)意

現(xiàn)在只關(guān)注問題陳述并提出解決問題的想法。 重點(diǎn)不在于獲得一個(gè)完美的想法，而是要想出盡可能多的想法，比如針對(duì)我們的例子，我們可以提出許多想法：獨(dú)特的虛擬現(xiàn)實(shí)體驗(yàn)，高級(jí)友好懸停板或改裝的手推車。 不管它是什么，請(qǐng)畫出你的最佳想法，并將它們展示給你正在嘗試提供幫助的人，這樣你才能得到他們的反饋。

第4步：原型制作

現(xiàn)在花一點(diǎn)時(shí)間思考一下你從對(duì)話中了解到的不同想法。 問問自己，你的想法如何適應(yīng)人們的實(shí)際生活。 你的解決方案可能是一個(gè)新想法和已經(jīng)被使用的組合。 然后連接點(diǎn)，勾勒出最終的解決方案，并建立一個(gè)真正的原型，以進(jìn)行測試。

第5步：測試

現(xiàn)在尋找實(shí)際用戶測試你的原型。 如果人們不喜歡它，要敢于接受意見，關(guān)鍵是要了解哪些是有效的，哪些沒有，所以任何反饋都很好。 然后回到理念或原型，并運(yùn)用你的技能。 重復(fù)這個(gè)過程直到你有一個(gè)能夠解決實(shí)際問題的原型。

第6步：重復(fù)以上步驟進(jìn)行迭代

反饋——原型——測試——反饋——原型.......

荷蘭埃因霍芬理工大學(xué)工業(yè)設(shè)計(jì)系博士在讀

公眾號(hào)：“用設(shè)計(jì)做研究”

知乎專欄：“用設(shè)計(jì)，做研究”

設(shè)計(jì)與研究/工業(yè)設(shè)計(jì)/荷蘭留學(xué) 原創(chuàng)文章發(fā)布

原創(chuàng)：

工業(yè)設(shè)計(jì)李存

藍(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ù)

大屏可視化界面設(shè)計(jì)可謂是當(dāng)今行業(yè)、企業(yè)發(fā)展的見證，生動(dòng)直觀地再現(xiàn)了行業(yè)、企業(yè)的全貌。不僅作為展示，方便了解、監(jiān)督；同時(shí)可以作為一個(gè)有效的管理平臺(tái)，帶來效益。大屏界面面向范圍廣，協(xié)同性好，易于被采用。下面幾個(gè)大屏的界面設(shè)計(jì)，沉穩(wěn)的背景上，加上亮色作為點(diǎn)綴和強(qiáng)調(diào)。既不失其風(fēng)格，又富有靈動(dòng)性。

（圖片均來源于網(wǎng)絡(luò)）

藍(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ù)

更多精彩文章：

   大數(shù)據(jù)可視化界面設(shè)計(jì)賞析（一）

   大數(shù)據(jù)可視化界面設(shè)計(jì)賞析（二）

   大數(shù)據(jù)可視化界面設(shè)計(jì)賞析（三）

  大數(shù)據(jù)可視化界面設(shè)計(jì)賞析（四）

  大數(shù)據(jù)可視化界面設(shè)計(jì)賞析（五）

  大數(shù)據(jù)可視化界面設(shè)計(jì)賞析（六）

  大數(shù)據(jù)可視化界面設(shè)計(jì)賞析（七）

無論是羅瑟·瑞夫斯提出的“USP”，還是奧格威所推廣的“品牌形象”，又或是里斯和特勞特提出的“定位”……這些都可以看成是一種單一的主張。

而行業(yè)中成立時(shí)間更早也更大的一批元老級(jí)公司，他們并不推崇這些創(chuàng)意先鋒們的單一廣告主張。他們認(rèn)為廣告公司要根據(jù)企業(yè)的不同，自由地從所有門派中組合出最有效果的方法。

BBDO一位資深人士自豪地說，“你常?？梢钥闯鲞@是奧格威的廣告，那是達(dá)彼思的廣告，但你無法認(rèn)出哪個(gè)是我們的廣告，因?yàn)槲覀儠?huì)去整合每個(gè)人的構(gòu)想。”麥肯則更加瘋狂。他們認(rèn)為做廣告并不是它最重要的工作，他們要處理“整個(gè)營銷”的問題。

本文便是麥肯的傳奇故事。

一、麥肯早期的發(fā)展

麥肯的歷史最早可以追溯到1902年成立的埃里克森廣告公司。在1930年，埃里克森與晚自己九歲的麥肯合并，合并后的新公司名稱是這兩者的組合。不過不叫埃里克森-麥肯，而叫麥肯-埃里克森廣告公司，也就是后來的麥肯世界，一般仍然簡稱麥肯。

合并后的麥肯迅速發(fā)展，最主要是把握住了兩大先機(jī)。第一個(gè)先機(jī)是新媒體的興起。

當(dāng)時(shí)兩家公司的合并，正趕上了廣告業(yè)第一次變革。全行業(yè)正新興起一個(gè)新媒體——廣播媒體。由于無需識(shí)字，廣播收聽量遠(yuǎn)遠(yuǎn)超過報(bào)紙的閱讀量，當(dāng)時(shí)每個(gè)家庭平均每天要收聽四個(gè)小時(shí)的廣播節(jié)目。在合并的前一年，麥肯就收購了一家廣播節(jié)目制作公司，得到一批廣播創(chuàng)作人才。合并后的麥肯高度重視廣播媒體，而公司的規(guī)模也直追當(dāng)時(shí)的巨頭。

在廣播之后，又興起一種有圖像的“廣播”——電視。按照人們的習(xí)慣，美國的電視臺(tái)不叫某某電視臺(tái)，而叫做某某廣播公司。盡管當(dāng)時(shí)電視才剛剛起步，而且還只是黑白的，但麥肯認(rèn)為電視的傳播威力有超過傳統(tǒng)報(bào)刊媒體的趨勢(shì)，便投入大量精力將已有的廣播業(yè)務(wù)優(yōu)勢(shì)發(fā)展到電視上。到了1950年代電視占據(jù)主導(dǎo)地位，成為媒體之王，麥肯也水漲船高成為電視廣告業(yè)務(wù)量最大的公司。

第二個(gè)先機(jī)是拓展海外市場。

創(chuàng)始人哈里森·麥肯早在1917年就說，“海外其他國家的生活與生產(chǎn)水平比我們要低，所以他們的產(chǎn)品會(huì)以極低的價(jià)格在當(dāng)?shù)劁N售，我國的制造商在海外市場將面臨巨大競爭，我國制造商在海外必須大做廣告才能在競爭中站穩(wěn)腳跟。” 

1927年，麥肯在歐洲建立了分公司。雖然發(fā)展得十分艱難，但它還是跟隨標(biāo)準(zhǔn)石油公司的腳步，開設(shè)各地分公司，這樣廣告創(chuàng)作可以在當(dāng)?shù)剡M(jìn)行，可以提高服務(wù)效率。

第二次世界大戰(zhàn)使麥肯在歐洲的分公司受到嚴(yán)重威脅。倫敦分公司有人回憶，在戰(zhàn)爭激烈的時(shí)候，公司員工要沖上屋頂，清除燃燒彈，夜間還要輪流放哨。二戰(zhàn)后情況還沒有好轉(zhuǎn)，海外業(yè)務(wù)讓哈里森·麥肯很頭痛。沒有盈利，加上各國反對(duì)情緒和高壓管制，讓海外業(yè)務(wù)前景不容樂觀。不過1947的實(shí)施馬歇爾計(jì)劃，西歐各國接收美國包括金融、技術(shù)、設(shè)備等各種形式的援助合計(jì)131.5億美元。經(jīng)濟(jì)的逐漸恢復(fù)，讓麥肯的海外業(yè)務(wù)起死回生，并成為海外廣告市場的領(lǐng)跑者。

麥肯把握住了新媒體與海外市場的時(shí)代機(jī)遇，成為了行業(yè)中堅(jiān)。不過，它帶給行業(yè)最大的驚喜，是哈珀的到來。

二、哈珀的到來

1939年，耶魯大學(xué)心理學(xué)專業(yè)畢業(yè)生哈珀進(jìn)入麥肯公司，當(dāng)時(shí)他只有23歲。

一開始，哈珀在郵件收發(fā)室工作。心理學(xué)專業(yè)的學(xué)習(xí)經(jīng)歷，讓哈珀對(duì)研究很癡迷。由于他對(duì)研究的諸多見解對(duì)公司內(nèi)部有很大啟發(fā)，三年后哈珀成為文案測試部門主管，四年后哈珀又成為研究部總監(jiān)。

在研究部，他發(fā)起一個(gè)名為“因素分析”的關(guān)于廣告如何吸引讀者的研究項(xiàng)目，并在全公司推廣，他說服創(chuàng)意部，因素分析不會(huì)危及他們的創(chuàng)造性。

在哈珀成為研究部門主任的兩年后，也就是1948年，32歲的哈珀被哈里森·麥肯指定為公司新總裁。哈里森·麥肯說，“他在研究領(lǐng)域所取得的成就，使得他對(duì)重要事實(shí)的了解獨(dú)特而有見地，而這正是一切策劃的基礎(chǔ)。我覺得像哈珀一樣能把研究做得有生有色的人會(huì)成為公司鼓舞人心的總裁。”

成為總裁的哈珀聘請(qǐng)了多位博士加入麥肯傳播研究所，不斷研究改進(jìn)廣告方法論，使得麥肯公司在廣告研究及業(yè)務(wù)應(yīng)用等方面處于領(lǐng)先地位。

傳播研究所擁有很多研究工具，這些工具僅從名字上就讓客戶覺得很放心。比如：相對(duì)銷售傾向測試、感知實(shí)驗(yàn)室……這些金光閃閃的名字，讓人覺得廣告只要通過這些測試，就一定能獲得成功。這些測試在當(dāng)時(shí)是十分創(chuàng)新的，比如在分析觀眾對(duì)廣告的反應(yīng)時(shí)，引入眼球攝影新技術(shù)與廣告效果研究結(jié)合起來，記錄瞳孔對(duì)視覺刺激擴(kuò)張程度。

這些引領(lǐng)時(shí)代的研究成果，吸引了大量客戶的青睞。而哈珀并未滿足，他在多年研究心得的基礎(chǔ)上，創(chuàng)造性地提出了他對(duì)“未來廣告公司”的構(gòu)想。

哈珀對(duì)“未來廣告公司”的構(gòu)想是采用平行子公司的結(jié)構(gòu)組建廣告集團(tuán)。這看似簡單的構(gòu)想，實(shí)在是了不起的創(chuàng)想。集團(tuán)公司在其他行業(yè)中雖然已被普遍采用，但廣告行業(yè)卻受到天生的限制，一直無法集團(tuán)化運(yùn)作。

主要原因是當(dāng)時(shí)廣告公司的客戶們不喜歡和競爭對(duì)手共用同一家廣告公司。這意味著廣告公司在每一個(gè)行業(yè)只能有一家客戶，他們只能為一個(gè)品牌的汽車、一個(gè)品牌的啤酒、一個(gè)品牌的計(jì)算機(jī)做廣告。如果一家廣告公司收購了另一家，那么兩家公司此前可能擁有的同一領(lǐng)域的兩家客戶就必須放棄一家。

這個(gè)問題是致命的，而哈珀構(gòu)想的“未來廣告公司”則解決了這個(gè)問題。

三、哈珀發(fā)明廣告集團(tuán)

1934年，麥肯公司的大客戶標(biāo)準(zhǔn)石油公司，被一家叫馬肖爾&普拉特的小型廣告公司插了一腳。當(dāng)時(shí)報(bào)刊行業(yè)利用自身的主流地位阻止新興的廣播媒體進(jìn)入廣告市場，導(dǎo)致企業(yè)無法順利投放廣播廣告。這家小型廣告公司建議標(biāo)準(zhǔn)石油暫不投放廣播廣告，轉(zhuǎn)而贊助制作一個(gè)全新的廣播節(jié)目，這樣可以繞開廣告投放的限制，這個(gè)全新的節(jié)目在全國各大廣播上播出。由此，馬肖爾&普拉特成為標(biāo)準(zhǔn)石油在美國主要的廣播廣告代理商，然后又成為電視廣告代理商之一。

馬肖爾&普拉特公司非常小，卻奪走了標(biāo)準(zhǔn)石油的一大塊廣告資源。這讓麥肯創(chuàng)始人哈里森·麥肯對(duì)此耿耿于懷，而一直琢磨如何創(chuàng)建“未來廣告公司” 的哈珀，卻在馬肖爾&普拉特公司那里看到一個(gè)絕好的機(jī)會(huì)。

1954年，麥肯收購了馬肖爾&普拉特公司。但哈珀并沒有簡單地把它合并到麥肯，而是讓它成為一個(gè)單獨(dú)的公司，讓它擁有原來的名稱和客戶，甚至可以與麥肯的客戶之間存在競爭關(guān)系的客戶。哈珀跳出傳統(tǒng)管理方式的藩籬，以平行子公司的結(jié)構(gòu)成立廣告集團(tuán)。讓被收購公司獨(dú)立于收購公司運(yùn)作，兩家公司的財(cái)務(wù)由集團(tuán)公司來控制，而業(yè)務(wù)上則由各自獨(dú)立經(jīng)營，無需放棄業(yè)務(wù)相沖突的客戶。

這一大膽的做法震驚業(yè)界，受到業(yè)界的抨擊。也有不認(rèn)可的客戶中止了合作，但最終吸引了更多的客戶。

隨著質(zhì)疑的聲音漸漸減少，哈珀的廣告集團(tuán)慢慢體現(xiàn)出自身的優(yōu)勢(shì)。集團(tuán)公司擁有大量后臺(tái)人員同時(shí)為旗下所有廣告公司提供行政和財(cái)務(wù)，更重要地的是將媒體采購獨(dú)立出來，這種集團(tuán)集中采購媒體的方式大大強(qiáng)化了自己的地位，這就能夠?qū)崿F(xiàn)廣告行業(yè)的規(guī)模經(jīng)濟(jì)。在此之前，廣告公司被視為創(chuàng)意經(jīng)濟(jì)，很難形成規(guī)模。不要小看規(guī)模優(yōu)勢(shì)，列寧有一句名言：“數(shù)量本身就是質(zhì)量。”

麥肯于1954年買下馬肖爾&普拉特公司初嘗成果之后，陸續(xù)又收購了其他一些小型廣告公司。1960年，哈珀將集團(tuán)公司更名為IPG，這原本是旗下一家公關(guān)公司的名字。1971年，IPG集團(tuán)上市，有了資本市場的加持，收購更加大手筆。1990年收購了著名的靈獅廣告；2001年更以21億美元將行業(yè)元老FCB納入旗下（FCB的前身是拉斯克兒和霍普金斯奮斗過的洛德暨托馬斯廣告公司）。哈珀用極具創(chuàng)想的方式，一手締造了自己的廣告帝國。

哈珀締造的IPG廣告帝國，為全行業(yè)集團(tuán)化發(fā)展指明了方向。麥肯這一模式后來也被其他廣告集團(tuán)廣泛采用。到1990年代，全行業(yè)進(jìn)入了集團(tuán)化時(shí)代，形成WPP、宏盟、IPG、陽獅、電通、哈瓦斯六大廣告集團(tuán)。

這些廣告集團(tuán)也像IPG一樣瘋狂并購知名廣告公司。比如WPP收購了智威湯遜、奧美、楊羅必凱；宏盟則擁有恒美、天聯(lián)；陽獅則并購李?yuàn)W貝納、盛世長城。

這些廣告集團(tuán)正是用哈珀的平行子公司模式組建的。

四、哈珀的另一個(gè)偉大想法

在IPG集團(tuán)取得成功后，哈珀的視野早就超出廣告集團(tuán)之上。他又想一個(gè)新概念，這個(gè)概念不僅改變了麥肯，也改變了整個(gè)行業(yè)。

在1950年代，由于新媒體——電視的強(qiáng)勢(shì)崛起，大家一致認(rèn)為進(jìn)入了“電視為王”的時(shí)代。但是哈珀并沒有將注意力僅僅局限在電視上，而是十分重視新老媒體的整合運(yùn)作，乃至營銷傳播的整合運(yùn)作。

所以，哈珀另一個(gè)偉大的想法，就是“整合營銷傳播”。麥肯公司認(rèn)為：哈珀是實(shí)事上第一個(gè)提出此思想的人，比舒爾茨教授整整早了30年，但是哈珀并沒有得到“整合營銷傳播之父”的榮耀。

哈珀認(rèn)為整合營銷傳播的目標(biāo)是創(chuàng)作過程的核心，它是一種站在戰(zhàn)略高度促進(jìn)創(chuàng)意思維的手段。在1952年，哈珀就強(qiáng)調(diào)，應(yīng)當(dāng)擴(kuò)展廣告業(yè)務(wù)范圍，建立起一個(gè)能夠適應(yīng)營銷活動(dòng)從產(chǎn)品概念、產(chǎn)品設(shè)計(jì)一直到把產(chǎn)品送到消費(fèi)者手中的各環(huán)節(jié)的需求的組織體系。但在傳統(tǒng)廣告公司結(jié)構(gòu)中，這些重要形式常被廣告的風(fēng)頭蓋過。它們被認(rèn)為與廣告公司現(xiàn)有業(yè)務(wù)沒有多大關(guān)系。

哈珀覺得需要重建廣告業(yè)務(wù)方式本身，廣告公司也應(yīng)該向生產(chǎn)廠家一樣，研究和開發(fā)自己的產(chǎn)品。1956年哈珀說，“我們?yōu)榭蛻羲龅牟⒉粌H僅是充當(dāng)版面購買的經(jīng)紀(jì)人或只為那些版面做設(shè)計(jì)與文案。我們?yōu)榭蛻糇龅母啵覀儙椭麄兲厣珷I銷經(jīng)理，幫助他們?cè)O(shè)計(jì)新產(chǎn)品，并安排生產(chǎn)?，F(xiàn)在我們經(jīng)常參與他們的銷售會(huì)議，評(píng)估營銷方式，參與他們的高層決策。我們還要在許多與廣告不相關(guān)的領(lǐng)域幫助他們?！?

對(duì)于提供營銷附加服務(wù)，麥肯也早有這個(gè)傳統(tǒng)。早在1933年麥肯就設(shè)立了促銷部。專門為客戶制作各種促銷品，包括目錄、小冊(cè)子、掛歷等，還提供櫥窗設(shè)計(jì)、柜臺(tái)、賣場、陳列等服務(wù)，并負(fù)責(zé)直郵廣告活動(dòng)的執(zhí)行。在哈珀的時(shí)代，麥肯除了并購其他廣告公司之外，還成立一批專職營銷附加服務(wù)公司。包括市場研究公司、公關(guān)公司、品牌咨詢公司、銷售渠道拓展公司等。他要在原有的廣告公司之外為客戶提供全面的營銷服務(wù)。

1960年，哈珀公開宣講要“整體性”解決營銷問題。他認(rèn)為做廣告并不是他們最重要的工作，麥肯要處理“整個(gè)營銷”的問題。

麥肯為什么要從做廣告變成處理“整個(gè)營銷”呢？喬治·帕克解釋道：“廣告公司一定要與客戶最高層做經(jīng)常性聯(lián)絡(luò)。然而如果你只帶著廣告設(shè)計(jì)稿來，你就無法接觸那個(gè)階層。要接觸客戶最高層，你必須提出營銷咨詢意見?！?/strong>

哈珀是第一個(gè)將廣告描述為營銷傳播的人，等到30年后“整合營銷傳播”才被廣泛使用，到1990年代，哈珀首創(chuàng)的理念仍然是廣告行業(yè)討論的重點(diǎn)。他幾乎以一人之力完成了行業(yè)管理模式與業(yè)務(wù)模式的升級(jí)?！皬V告集團(tuán)+整合營銷傳播”也成為下一個(gè)階段行業(yè)大發(fā)展的兩大引擎。

五、哈珀拿下可口可樂全球廣告業(yè)務(wù)

哈珀的努力沒有白費(fèi)，麥肯在1955年成功接下可口可樂的全球廣告業(yè)務(wù)。

此時(shí)的可口可樂正面臨百事可樂日益強(qiáng)勁的挑戰(zhàn)。可口可樂營業(yè)收入下降，新任總裁比爾·魯濱遜終止與達(dá)美高長達(dá)50的合作，因?yàn)樗庾R(shí)到有必要進(jìn)一步統(tǒng)籌其海外和美國本土廣告。而此時(shí)麥肯由于哈珀的前瞻性布局，已經(jīng)建立起跨國業(yè)務(wù)體系，差不多是當(dāng)時(shí)唯一的選擇。

哈珀帶領(lǐng)團(tuán)隊(duì)克服重重困難，全力以赴，匯報(bào)提案長達(dá)6小時(shí)，充分展示麥肯全球服務(wù)能力以及“整合營銷傳播”思維與市場調(diào)研強(qiáng)度結(jié)合起來所能達(dá)到效果的大好機(jī)會(huì)。最終贏得了可口可樂的全球廣告業(yè)務(wù)。麥肯隨即組建的可口可樂工作組，一開始就有121名職員，涵蓋了麥肯公司各個(gè)部門的職能。此外，還有20人的推銷小組被派往18個(gè)重要的食品分銷中心城市。像可口可樂這種跨國廣告業(yè)務(wù)，需要協(xié)調(diào)進(jìn)行，又要適應(yīng)不同的市場條件。麥肯的原則是“分散行動(dòng)，集中策劃”，由一批分公司在世界各地分別運(yùn)作，而總部則負(fù)責(zé)協(xié)調(diào)整個(gè)組織在全球范圍的活動(dòng)。

可口可樂在品牌史上占有重要地位，全球各大品牌排行榜，只有可口可樂一家公司從來沒有跌出過前10名。因此，我們簡單回顧一下它的歷史。

1885年，美國頒布禁酒令，禁止銷售各類酒水，關(guān)閉各地酒館，這給酒業(yè)帶來滅頂之災(zāi)。一個(gè)叫彭伯頓的藥劑師，手下?lián)碛幸患夜趴戮茝S。為了減少禁酒令帶來的損失，他改進(jìn)當(dāng)時(shí)古柯酒的配方，仍以古柯為原料，加入可樂果，經(jīng)過不斷實(shí)驗(yàn)，終于在1886年研制出一種不含酒精的全新飲料。

這種冒著氣泡的飲料被魯濱遜取名為“Coca-Cola”。這個(gè)名字包含飲料的兩種主要成分，還十分押韻，得到了彭伯頓和其他股東的認(rèn)可。（Coca-Cola最早的中文譯名是——蝌蚪啃蠟，導(dǎo)致當(dāng)時(shí)進(jìn)入中國的產(chǎn)品無人問津。后來由蔣彝重新譯為——可口可樂，這個(gè)新譯名在音譯的基礎(chǔ)上還具有實(shí)際含義，成為品牌中文譯名的典范。）

魯濱遜早些年通過推銷印刷機(jī)認(rèn)識(shí)了彭伯頓，入伙了彭伯頓的公司。魯濱遜不但為產(chǎn)品取名，還手寫了延用至今的斯賓賽體可口可樂標(biāo)志，同時(shí)他策劃從零起步的廣告宣傳。1886年3月29日，魯濱遜發(fā)布了第一個(gè)報(bào)紙廣告，上寫著“可口可樂，美味、清爽”。可口可樂從此開始了萬里長征第一步。

六、可口可樂成為美國文化象征

最早的可口可樂是在藥房及店鋪的冷飲柜中以5美分的價(jià)格出售，由售賣者將可口可樂糖漿加冰水現(xiàn)場制作。

到1899年，有兩位律師向當(dāng)時(shí)的負(fù)責(zé)人阿薩·坎德勒提出建議采用瓶裝生產(chǎn)。這樣在沒有冷飲柜的鄉(xiāng)村地區(qū)，瓶裝可口可樂的銷售前景會(huì)跟城市的冷飲鋪現(xiàn)做的一樣好。

但阿薩·坎德勒怕力不從心，因?yàn)椤捌垦b項(xiàng)目有太多細(xì)節(jié)需要處理”。為了打消阿薩·坎德勒的顧慮，兩位律師做出承諾：保證瓶裝可樂不會(huì)爭搶冷飲柜的生意，而且可以擴(kuò)大糖漿的銷量，還不用花公司一分錢，廣告都由瓶裝廠自己投放。最終雙方簽訂了合同，公司以每加侖1美元的價(jià)格賣給他們糖漿，允許對(duì)方使用可口可樂品牌。這個(gè)合同沒有約定有效期，也沒有約定價(jià)格是否可以浮動(dòng)。這為后面雙方長期糾纏埋下隱患，但也正由于各地瓶裝廠的加盟，真正讓可口可樂全國暢銷。

隨著瓶裝可口可樂的暢銷，各地紛紛出現(xiàn)仿冒品。仿冒品采用相同的筆直的瓶子，采用相同的鉆石形標(biāo)簽，裝著同樣焦糖色的飲品。普通不認(rèn)字的消費(fèi)者常常無法分辨誰是可口可樂。

可口可樂公司的赫希認(rèn)為，應(yīng)該拋棄現(xiàn)有大家都在用的瓶子，另外生產(chǎn)一種特征鮮明的新瓶子。他勸說瓶裝廠不要將眼光局限在換用新瓶的短期花費(fèi)上，要生產(chǎn)一眼就消費(fèi)者被看出的瓶子，“在黑暗中僅憑觸覺即能辨認(rèn)，甚至摔碎在地上也能一眼識(shí)別”，這瓶子根本不用貼紙質(zhì)商標(biāo)，商標(biāo)要直接印在瓶子上。

1915年，設(shè)計(jì)師迪安以當(dāng)時(shí)流行的一種裙子為靈感，設(shè)計(jì)出弧形瓶。這個(gè)瓶子手感很好，拿取非常方便，而且十分獨(dú)特，人們一眼就能看出這是可口可樂。弧形瓶很快被申請(qǐng)了外觀專利，其他廠家不能仿制這種瓶子，這讓仿冒者們紛紛陷入絕境。此后40多年，可口可樂堅(jiān)持以弧形瓶作為唯一的產(chǎn)品包裝。最終，弧形瓶就像手寫體的商標(biāo)一樣，成了可口可樂的品牌“視覺錘”。

弧形瓶讓可口可樂大獲成功。使得公司越來越重視品牌形象，在1931年，邀請(qǐng)藝術(shù)家海頓·珊布為可口可樂創(chuàng)造了一個(gè)全新的圣誕老人形象。他一改之前嚴(yán)肅的精靈形象，成為一個(gè)永遠(yuǎn)樂呵呵、胖乎乎的圣誕老人。他紅色的外衣，白白的胡子，與可口可樂紅白形象一脈相承。

圣誕老人的推廣，大大增加了冬季的銷量。此后，可口可樂的廣告不斷強(qiáng)化紅白衣服打扮的圣誕老人形象，圣誕老人派發(fā)可口可樂成為小孩子們的最愛。隨著強(qiáng)大的營銷攻勢(shì)，“可口可樂版”圣誕老人漸漸定格在了人們的腦海中，并流傳至今。

1942年，美國參加第二次世界大戰(zhàn)。董事長伍德拉夫希望將可口可樂列入軍需品的行列，這樣可以隨著軍隊(duì)的步伐征戰(zhàn)世界，但軍方一開始并不同意。伍德拉夫召開多次新聞發(fā)布會(huì)。將可口可樂抬到“戰(zhàn)時(shí)休息”、“鼓舞士氣”至關(guān)重要的地位，宣講可口可樂對(duì)調(diào)整士兵狀態(tài)的意義。伍德拉夫還宣布“不管我國軍隊(duì)在什么地方，也不管公司的代價(jià)有多大，我們一定保證每個(gè)軍人只花5分錢就能買到一瓶可口可樂?！币粫r(shí)民意沸騰，最終軍方同意讓可口可樂走向前線，并幫助可口可樂在當(dāng)?shù)亟◤S。

道格拉斯·霍爾特在《品牌如何成為偶像》中說，這是有史以來最成功的公關(guān)。

可口可樂不惜工本，滿世界送可樂，無論是歐洲小鎮(zhèn)，還是亞洲孤島，只要5美分，駐扎美軍都能買到。可口可樂不僅緩解著戰(zhàn)爭之痛，更成為士兵們對(duì)家鄉(xiāng)的寄托。在前線，可口可樂被送到每一位士兵手中；在后方，它又印刷大量廣告來慶祝每一場戰(zhàn)斗的勝利。當(dāng)戰(zhàn)爭結(jié)束時(shí)，人們對(duì)可口可樂懷有宗教般的虔誠，喝出一種民族自豪感，成為美國文化的象征。

七、“給世界來瓶可口可樂”

在麥肯與可口可樂合作期間最經(jīng)典的作品，當(dāng)屬1971年推出的“山頂”廣告。

這支廣告教全世界唱一首廣告歌，成為前所未有的、最為流行的廣告歌曲。也是電視廣告史上巔峰杰作之一。廣告內(nèi)容如下：

在意大利的某座小山頂，兩名短發(fā)的青春少女在歌唱：“我想給世界一個(gè)家，用愛來灌溉它……”隨著歌聲悠揚(yáng)，鏡頭拉遠(yuǎn)，越來越多不同國家、不同種族的年輕人加入歌唱隊(duì)伍。歌聲越來越洪亮，匯成美妙的合唱：“我想讓世界學(xué)會(huì)歌唱，人們和諧歡暢……”最后成百上千不同種族的年輕人齊聚山頂，每個(gè)人手里捧可口可樂，仿佛手擎著一面旗幟，高聲歌唱：“我想給世界來瓶可口可樂，讓它永遠(yuǎn)陪伴我的快樂！” 

這個(gè)廣告先在歐洲播出，不溫不火。但在美國一播出，迅速引起巨大轟動(dòng)，沒有人對(duì)可口可樂誓志拯救世界感到荒謬，人們紛紛點(diǎn)播這首廣告歌曲，寄來超過10萬封信函索取樂譜，可口可樂公司將歌曲唱片贈(zèng)送給索取者們。這首廣告歌去掉了中間的商品信息后，被重新錄制成一首單曲，在各大電臺(tái)播出，最終登上一些音樂排行榜冠軍寶座?！都~約周刊》寫道：“這是肯定會(huì)紅火的潛意識(shí)廣告?！彪m然歌詞中沒有提及可口可樂，但是每個(gè)人只要聽到這首歌，都自然會(huì)想起可口可樂。

這個(gè)創(chuàng)意據(jù)說源自麥肯創(chuàng)意總監(jiān)比爾·巴克爾。他乘坐的航班，因?yàn)橹仂F而在香農(nóng)機(jī)場迫降。原本要乘坐飛機(jī)的旅客們，不得不擠在條件簡陋的旅館房間里熬過一晚。人群中到處彌漫著憤怒與不滿。第二天早晨，在等待航班放行時(shí)，令人意外的一幕出現(xiàn)了，前天晚上情緒最激動(dòng)的那些旅客，正一起邊吃著零食喝著可口可樂，邊“吐槽”開著玩笑，怒火似乎已被手中的可口可樂澆滅，平靜放松下來了。比爾·巴克爾回憶道：“那一刻，可口可樂的意義早已超越了一瓶飲料。它是把人們聯(lián)結(jié)在一起的紐帶，是提供陪伴的一劑良方。”之后就創(chuàng)作出“我想給世界來瓶可口可樂”的廣告歌曲。

不過，提出“文化品牌戰(zhàn)略”的道格拉斯·霍爾特認(rèn)為“山頂”廣告巨大成功的關(guān)鍵，并不是廣告公司所說普通人的陪伴良方，而是可口可樂緩解當(dāng)時(shí)激烈的種族文化沖突。

在二戰(zhàn)后很長的時(shí)間內(nèi)，可口可樂一直擁有美國文化象征的這份殊榮。然而到了20世紀(jì)60年代，美國爆發(fā)民權(quán)運(yùn)動(dòng)，美國黑人民眾為獲得平等權(quán)利而進(jìn)行斗爭達(dá)到高峰，引起強(qiáng)烈的文化沖突。民權(quán)運(yùn)動(dòng)的吶喊，撕碎了原有的民族團(tuán)結(jié)，可口可樂原有的品牌力量隨之消減。

在這個(gè)背景下，“山頂”廣告吸收了嬉皮士反文化的形象與和平運(yùn)動(dòng)的內(nèi)容，認(rèn)識(shí)到當(dāng)時(shí)充滿沖突的社會(huì)現(xiàn)實(shí)，呼喚對(duì)人性的理解和容忍。廣告中溫暖人心的歌詞和朗朗上口的旋律，以及一群不同膚色、不同國籍的年輕人共唱“給世界來瓶可口可樂”，這一“世界大合唱”告訴人們：想平息看上去十分激烈的社會(huì)沖突，最簡單的方法莫過于拿起一瓶可口可樂。

麥肯公司的李·塔利認(rèn)同道格拉斯·霍爾特的觀點(diǎn)，他說：“百事可樂更擅長定位，只瞄準(zhǔn)一個(gè)市場——二戰(zhàn)結(jié)束后的嬰兒潮一代年輕人。而我們努力使可口可樂成為適合所有人的東西，這樣做反而使我們迷失了方向，并且不記得自己本該有的形象?！?百事可樂保持與充滿活力的年輕人市場同步前進(jìn)的策略讓可口可樂一度十分被動(dòng)。麥肯公司連續(xù)三年進(jìn)行深入調(diào)查，最終確認(rèn)可口可樂的主要作用是作為社會(huì)催化劑，聯(lián)結(jié)人們情感的紐帶。

可口可樂作為聯(lián)結(jié)情感的紐帶，通過象征性地化解美國社會(huì)中尖銳的文化沖突，增加了人們的凝聚力，也增加了人們與可口可樂之間的情感紐帶。難怪有人說：“無論膚色是白是黑，也無論是總統(tǒng)還是平民，我們喝的都是相同的可口可樂。”

可口可樂這種“平等”性，捍衛(wèi)了自身作為美國文化象征的殊榮，這一超然地位，讓可口可樂在大多數(shù)的時(shí)間里，始終壓住百事可樂一頭。

八、可口可樂引發(fā)的危機(jī)

時(shí)間來到1985年，可口可樂發(fā)生了史上最大危機(jī)。

此次危機(jī)讓人們發(fā)現(xiàn)：盡管可口可樂是一個(gè)超級(jí)品牌，但卻沒有一個(gè)成體系的品牌理論來指導(dǎo)實(shí)踐，以至發(fā)生此次危機(jī)。

從這次危機(jī)后，品牌理論成為全行業(yè)關(guān)注的焦點(diǎn)，迅速構(gòu)建起品牌理論的大廈。

文章來源：站酷  作者：趙義