不論你從事平面設(shè)計(jì)、網(wǎng)頁(yè)設(shè)計(jì)、UI/UX設(shè)計(jì)、前端設(shè)計(jì)…只要你是設(shè)計(jì)師，你不可不知從2013年后火速竄起改變整個(gè)資訊產(chǎn)業(yè)使用者界面的「扁平化設(shè)計(jì) (Flat Design) 」 ，是如何撼動(dòng)整個(gè)世界，甚至是改變你的工作型態(tài)與產(chǎn)業(yè)!

你有沒(méi)有發(fā)現(xiàn)，2013年后許多網(wǎng)頁(yè)、APP、甚至系統(tǒng)界面，都開(kāi)始改用色彩繽紛、簡(jiǎn)約的風(fēng)格，就像把所有物件通通壓扁在畫面上，這就是紅極一時(shí)的扁平化設(shè)計(jì) (flat design)，新一代界面設(shè)計(jì)的趨勢(shì)。

不單單只是資訊產(chǎn)業(yè)，連許多知名廠商的LOGO 也開(kāi)始改頭換面采用扁平化的潮流，像是Netflix、ebay、Spotify、Twitter、Audi、Citro?n…等

然而也有人認(rèn)為這樣的改變變得沒(méi)特色，比如說(shuō)Instagram 的logo 就變得十分不顯眼。

在資訊的推波助瀾下，你有發(fā)現(xiàn)許多行業(yè)的設(shè)計(jì)趨勢(shì)與消費(fèi)者習(xí)慣的轉(zhuǎn)變，潛移默化地受到科技化(Informatization)的影響嗎?

什么是扁平化設(shè)計(jì)?

那么，解釋一下到底這個(gè)很夯的扁平化設(shè)計(jì)是什么呀?

其實(shí)從上面一些案例你應(yīng)該有隱約感覺(jué)到一些共通之處，扁平化設(shè)計(jì)就是，去除陰影 (shadow)、漸層 (gradients)、裝飾 (decoration )、反射光澤 (shiny)等3D要素，通常使用高亮度的色彩 (bright color) 搭配無(wú)襯線字體呈現(xiàn)出簡(jiǎn)約現(xiàn)代風(fēng)格。

噢！所以你是說(shuō)扁平化設(shè)計(jì)是2013年后才有的東西嗎?

哦不！當(dāng)然不是了，先讓我們把時(shí)間拉回100年前…

扁平化設(shè)計(jì)的開(kāi)端

19世紀(jì)英國(guó)女王維多利亞在位統(tǒng)治時(shí)期稱為維多利亞時(shí)代，那個(gè)時(shí)期的建筑風(fēng)格就稱為維多利亞風(fēng)格 (Victorian Style)，是個(gè)日不落國(guó)、英國(guó)錢淹腳目的黃金年代，外觀華麗而細(xì)致，就算到了今天你還是能看到許多保存完整的建筑物。

嗯，就是那種你出國(guó)絕對(duì)會(huì)和它拍照的美麗建筑。

知名建筑像是英國(guó)國(guó)會(huì)大廈

然而好景不常，1920經(jīng)過(guò)一次世界大戰(zhàn)的洗滌后，人們對(duì)維多利亞風(fēng)格感到厭倦，與每下愈況的生活簡(jiǎn)直形同對(duì)比，讓人感到華而不實(shí)。

于是德國(guó)建筑師Walter Gropius 在1919 年成立了國(guó)立包豪斯學(xué)校，不過(guò)在1933年被納粹壓迫而關(guān)閉，因?yàn)镚ropius在學(xué)校宣傳共產(chǎn)主義思想。

誰(shuí)也沒(méi)想到，這個(gè)短短成立不到15年的學(xué)校竟然深深影響了往后世界的藝術(shù)、工業(yè)設(shè)計(jì)、平面設(shè)計(jì)、室內(nèi)設(shè)計(jì)、現(xiàn)代戲劇、甚至是現(xiàn)代美術(shù)等領(lǐng)域上!

仔細(xì)看看包豪斯學(xué)派（又稱包豪斯主義，The Bauhaus Style）的主張:

Form Follows Function: 設(shè)計(jì)的構(gòu)成必須反映出功能，效用放第一位；

Truth to Materials: 盡量呈現(xiàn)該素材的特性；

The Less is More: 簡(jiǎn)約、功能性的美學(xué)，去除無(wú)謂的裝飾；

包豪斯簡(jiǎn)約實(shí)用的設(shè)計(jì)理念可以說(shuō)是和扁平化有異曲同工之妙。

包豪斯家具

包豪斯建筑

扁平化設(shè)計(jì)的起源

時(shí)間來(lái)到1950年代，瑞士發(fā)展出了國(guó)際印刷風(fēng)格 ( International Typographic Style or International Style)，又稱瑞士風(fēng)格 (Swiss Style)，相較于包豪斯主義，瑞士風(fēng)格繼承其特性，不過(guò)著重在印刷、字體等平面設(shè)計(jì)上。

可以看看swissted 這個(gè)網(wǎng)站，收集了許多瑞士風(fēng)格的海報(bào)作品

1957年，瑞士設(shè)計(jì)師 Max Miedinger 與 Eduard Hoffmann 設(shè)計(jì)出「Helvetica」的無(wú)襯線字體，Helvetica 在拉丁文中有著「瑞士」之意。

可以說(shuō)是瑞士風(fēng)格的代表作品，追隨著現(xiàn)代主義觀點(diǎn)，認(rèn)為應(yīng)該讓讀者在閱讀時(shí)能專注于文字所表達(dá)的內(nèi)容，而不會(huì)關(guān)注文字本身所使用的字體，至今為全世界商標(biāo)設(shè)計(jì)運(yùn)用最為廣泛的一款字體。

有許多知名企業(yè)的logo字體正是使用了Helvetica

額外補(bǔ)充：Arial 為1982 年 Monotype 公司出品的字體，因搭配微軟作業(yè)系統(tǒng)而迅速普及，不過(guò)一般人很容易將兩者混淆。

如果說(shuō)包豪斯的設(shè)計(jì)理念影響了扁平化，那瑞士風(fēng)格可以說(shuō)是孕育扁平化的搖籃，人們普遍認(rèn)為瑞士風(fēng)格對(duì)扁平化設(shè)計(jì)理念的影響是最為深遠(yuǎn)的。

俗話說(shuō)十年風(fēng)水輪流轉(zhuǎn)，瑞士風(fēng)格在普及一段時(shí)間后就開(kāi)始衰退了，沒(méi)有什么潮流是一成不變的，1970年代后出現(xiàn)一種反對(duì)現(xiàn)代主義的「后現(xiàn)代風(fēng)格 (Postmodernism) 」，帶有叛逆風(fēng)格地對(duì)字體和排版進(jìn)行切割、重構(gòu)，呈現(xiàn)充滿活力的樣貌。

后現(xiàn)代風(fēng)格家具，是不是和包豪斯風(fēng)格差很多呢?

后現(xiàn)代風(fēng)格建筑，十分醒目，很難讓人不多看一眼

所以說(shuō)，扁平化設(shè)計(jì)的「前輩」被打的嫑嫑的，時(shí)至今日，他又是怎么忽然起死回生呢?

扁平化設(shè)計(jì)的過(guò)渡期

UI 設(shè)計(jì)界過(guò)去幾年持續(xù)爭(zhēng)論的一個(gè)大議題– 那就是使用者界面究竟該「擬物化(skeuomorphism)」還是「扁平化 (flat design)」？

回顧電腦時(shí)代的時(shí)候，Windows 界面設(shè)計(jì)采用擬物化，比如說(shuō)資源回收桶是模擬真實(shí)世界型態(tài)的樣貌3D立體化，文件與電腦圖示也都有著陰影與細(xì)節(jié)。

好吧！你可能覺(jué)得很丑不好看，那我們換成軟體美學(xué)設(shè)計(jì)翹楚Apple的Mac OS X

底下有著玻璃式的圖像倒映，所有圖示依然做的栩栩如生，不論是時(shí)鐘、指南針、放大鏡或齒輪。

不過(guò)如果你有注意的話，會(huì)發(fā)現(xiàn)Apple的產(chǎn)品采用包豪斯設(shè)計(jì)，有著潔白、簡(jiǎn)約、俐落的線條。

你是不是覺(jué)得奇怪，為什么Apple明明很早以前外型就采用包豪斯設(shè)計(jì)，可是在軟體界面上卻是用擬物化設(shè)計(jì)呢?

你還有印象的話，應(yīng)該記得前六代的iOS系統(tǒng)

我看過(guò)一派有趣又富有哲理的論點(diǎn)，認(rèn)為擬物化設(shè)計(jì)是人類認(rèn)知學(xué)習(xí)的過(guò)渡期產(chǎn)物，就像20世紀(jì)初的量產(chǎn)汽車外觀也十分類似原本人們舊有習(xí)慣的馬車。

在人們尚未學(xué)習(xí)到新知識(shí)的時(shí)期，考量到原本使用者的習(xí)慣，用他們熟悉的事物來(lái)接觸新知，降低學(xué)習(xí)曲線與使用者門檻，20世紀(jì)末人們學(xué)習(xí)使用電腦時(shí)便是先接觸了擬物化的設(shè)計(jì)，在2007年開(kāi)始接觸智能手機(jī)時(shí)，很理所當(dāng)然的會(huì)把過(guò)去的習(xí)慣帶入，就像以前操作電腦一般，而事實(shí)上，所謂的「智能手機(jī)」本來(lái)就是一部小型掌上型電腦。

而過(guò)一段時(shí)候后，使用者習(xí)慣新事物的習(xí)慣后，就可以朝真正合適的方向發(fā)展，就像后來(lái)的汽車即使不在設(shè)計(jì)的像馬車外觀，人們也能夠接受。

另一派則認(rèn)為純粹是該時(shí)代發(fā)明人對(duì)科技的水平與想像就是如此，而且也被過(guò)去的思維與習(xí)慣所限制住，然后在不斷漸進(jìn)的過(guò)程中慢慢改變?cè)镜脑O(shè)計(jì)；在2007年的時(shí)候根本還沒(méi)出現(xiàn)扁平化設(shè)計(jì)這個(gè)名詞。

這兩派論點(diǎn)并沒(méi)有答案，但是Apple 同時(shí)運(yùn)用擬物化與包豪斯設(shè)計(jì)為自己寫下科技業(yè)的傳奇一章。