UI設(shè)計(jì)中的扁平化設(shè)計(jì)研究

周仁杰

（西南交通大學(xué)藝術(shù)與傳播學(xué)院，四川 成都 610400）

UI設(shè)計(jì)中的扁平化設(shè)計(jì)研究

周仁杰

（西南交通大學(xué)藝術(shù)與傳播學(xué)院，四川 成都 610400）

扁平化設(shè)計(jì)（flat design）是現(xiàn)代設(shè)計(jì)中不加任何裝飾，單純直白的表現(xiàn)效果，是目前較流行的設(shè)計(jì)表達(dá)方式，并廣泛運(yùn)用于User Interface（用戶(hù)界面）中，減少了裝飾得復(fù)雜多樣的閱讀障礙，給用戶(hù)提供了更便利的操作，具有直觀易懂、簡(jiǎn)約時(shí)尚等特點(diǎn)。

UI設(shè)計(jì)；扁平化；界面設(shè)計(jì)；簡(jiǎn)約化；交互

UI設(shè)計(jì)是指對(duì)軟件的人機(jī)交互、操作邏輯、界面美觀的整體設(shè)計(jì)。好的UI設(shè)計(jì)不僅是讓軟件變得有個(gè)性有品味，還要讓軟件的操作變得舒適簡(jiǎn)單、自由，充分體現(xiàn)軟件的定位和特點(diǎn)。隨著社會(huì)的進(jìn)步，新媒體以及APP的急速發(fā)展，UI設(shè)計(jì)在人類(lèi)社會(huì)發(fā)展中已經(jīng)占據(jù)了重要的地位，人們無(wú)時(shí)不刻在接觸著這些東西，手機(jī)、電腦、電視這些與人們形影不離的物品更離不開(kāi)UI設(shè)計(jì)。簡(jiǎn)單來(lái)說(shuō)UI設(shè)計(jì)就是界面設(shè)計(jì)，它不僅要有美觀性又要具有合理操作性，UI設(shè)計(jì)可以有很多風(fēng)格，可以是傳統(tǒng)古典風(fēng)格、現(xiàn)代簡(jiǎn)約風(fēng)格、多彩的炫酷風(fēng)格，復(fù)雜繁瑣的擬物風(fēng)格……而占據(jù)UI設(shè)計(jì)中主導(dǎo)的則是擬物和簡(jiǎn)約風(fēng)格，這里的簡(jiǎn)約風(fēng)格實(shí)際上指的就是扁平化設(shè)計(jì)風(fēng)格，為何它能夠存在并且占據(jù)主導(dǎo)地位，這就得詳細(xì)分析了。

一、趨向視覺(jué)簡(jiǎn)約化的UI設(shè)計(jì)

作為現(xiàn)代生活的必需品，UI設(shè)計(jì)是面向大眾的，不需要有多么高端大氣上檔次的格調(diào)，更不需要狂拽酷炫叼炸天效果，它所需要的是在擁有良好操作實(shí)用性下并擁有美觀性，所以說(shuō)簡(jiǎn)便是前提，美觀在后。太高端可能用戶(hù)找不到按鈕，太酷炫可能導(dǎo)致軟件卡頓不順暢，太多的裝飾在手機(jī)一類(lèi)的小屏幕上不見(jiàn)得放的進(jìn)去，即便擠進(jìn)去了也不見(jiàn)得看得見(jiàn)，綜合選擇，結(jié)果扁平化被接受了，它同時(shí)滿(mǎn)足了界面設(shè)計(jì)的11個(gè)設(shè)計(jì)原則：簡(jiǎn)易性、用戶(hù)語(yǔ)言、記憶負(fù)擔(dān)最小化、一致性、清楚、用戶(hù)熟悉程度、用戶(hù)習(xí)慣、排列、安全性、靈活性、人性化。

那么憑什么扁平化就能深受UI設(shè)計(jì)師們幸寵？首先，扁平化的概念最核心的地方就是放棄一切裝飾效果，諸如透視，紋理，漸變等等能做出3D效果的元素一概不用。所有的元素的邊界都干凈利落，沒(méi)有任何羽化，漸變。尤其在手機(jī)上，更少的按鈕和選項(xiàng)使得界面干凈整齊，使用起來(lái)格外簡(jiǎn)潔。可以更加簡(jiǎn)單直接的將信息和事物的工作方式展示出來(lái)，減少認(rèn)知障礙的產(chǎn)生。簡(jiǎn)單來(lái)說(shuō)，扁平化設(shè)計(jì)風(fēng)格不見(jiàn)得是最美的，但一定是最適合的，就像結(jié)婚一樣，老婆不見(jiàn)得要最美，適合自己的才是真道。

二、應(yīng)用于UI設(shè)計(jì)中的扁平化設(shè)計(jì)

最早使用扁平化風(fēng)格的是微軟的Windows 8以及Windows phone和Windows RT的metro界面，這種風(fēng)格的出現(xiàn)確實(shí)顛覆了我們眼中的界面設(shè)計(jì)，開(kāi)始有人喜歡也有人反對(duì)，但最終到底誰(shuí)對(duì)誰(shuí)錯(cuò)，時(shí)間會(huì)告訴我們一切……

在智能手機(jī)和移動(dòng)網(wǎng)絡(luò)的快速發(fā)展下，人們大家可以便捷的通過(guò)手機(jī)關(guān)注自己感興趣的新聞、圖片和喜歡的APP（應(yīng)用程序），手機(jī)基本上成為人們與世界連接的首選工具。在這種數(shù)字智能化的社會(huì)環(huán)境下，新媒體的出現(xiàn)，電商模式的蓬勃發(fā)展，帶動(dòng)了越來(lái)越多的手機(jī)客戶(hù)端建立并通過(guò)APP吸引消費(fèi)者的關(guān)注，扁平化的UI設(shè)計(jì)在該市場(chǎng)下迅速蔓延。生活中處處可見(jiàn)扁平化設(shè)計(jì)作品，比如蘋(píng)果手機(jī)，采用棱角分明的線(xiàn)條，加上蘋(píng)果的部分應(yīng)用設(shè)計(jì)界面，單色鮮明的對(duì)比，非常漂亮。

扁平化設(shè)計(jì)能否長(zhǎng)期發(fā)展下去主要取決于用戶(hù)體驗(yàn)，用戶(hù)在使用扁平化風(fēng)格界面時(shí)基本都能很快的入手，信息也比較明確不像有些其他風(fēng)格的界面找了半天還是沒(méi)找到在哪，軟件界面運(yùn)行的流暢性也是用戶(hù)比較頭疼的問(wèn)題，而扁平化特別的編碼方式大大縮小了容量的占用，界面刷新速度快優(yōu)化了閱讀，給用戶(hù)提供了流暢舒服的界面體驗(yàn)，因此，這是普遍用戶(hù)們的選擇。

一般來(lái)說(shuō)扁平化三大要素是去過(guò)渡式高光、過(guò)渡式漸變、過(guò)渡式陰影。圖形之間棱角分明，清晰可辨。扁平化主要以色塊為主，幾乎我們看到的所有扁平化設(shè)計(jì)都離不開(kāi)色塊，這些色塊可能由不同的圓形，三角形，菱形，矩形，不規(guī)則形等等構(gòu)成，圖形的選擇也是很講究的，過(guò)多棱角的形狀會(huì)影響文字的閱讀性。扁平化的界面給人呈現(xiàn)的感覺(jué)是清爽，快捷。看起來(lái)這種設(shè)計(jì)風(fēng)格很簡(jiǎn)單，事實(shí)越干凈簡(jiǎn)單的設(shè)計(jì)才越難，不像天花亂墜的繁華風(fēng)格可以加各種元素進(jìn)去，扁平化設(shè)計(jì)中的每一個(gè)細(xì)微的元素，文字與圖形的距離關(guān)系，文字大小與圖形的關(guān)系，字體與圖形的關(guān)系，圖形色塊之間的搭配關(guān)系等等都是要充分考慮好的，最后

設(shè)計(jì)出來(lái)的成果并不僅僅是看起來(lái)清爽那么簡(jiǎn)單，其難度及花費(fèi)精力不亞于其他風(fēng)格設(shè)計(jì)。它是全面考慮的結(jié)果，這是簡(jiǎn)約并非簡(jiǎn)單，簡(jiǎn)約實(shí)用成就好的設(shè)計(jì)。

三、結(jié)語(yǔ)

目前網(wǎng)站和應(yīng)用程序在許多平臺(tái)涵蓋了越來(lái)越多不同的屏幕尺寸，創(chuàng)建多個(gè)屏幕尺寸和分辨率的skeuomorphic設(shè)計(jì)既繁瑣又費(fèi)時(shí)。設(shè)計(jì)正朝著更加扁平化的設(shè)計(jì)，可以一次保證在所有的屏幕尺寸上它會(huì)很好看。扁平化設(shè)計(jì)更簡(jiǎn)約，條理清晰，最重要的一點(diǎn)是，更好的適應(yīng)性。但正如很多設(shè)計(jì)一樣，扁平化設(shè)計(jì)也有缺點(diǎn)，比如需要一定的學(xué)習(xí)成本，傳達(dá)的感情不豐富，甚至過(guò)于冰冷。

事實(shí)顯示，扁平化正被應(yīng)用于UI界面及各大設(shè)計(jì)中，去掉所有瑣碎、復(fù)雜的立體化的裝飾，用簡(jiǎn)潔的元素去表達(dá)更深刻的內(nèi)在，摒棄浮華繁瑣，追求簡(jiǎn)單時(shí)尚舒適的生活方式，將快速、易懂可視化的感官體驗(yàn)上真正傳達(dá)至用戶(hù)的內(nèi)心，讓更多的用戶(hù)有興趣去下載使用，這就是扁平化應(yīng)用于UI設(shè)計(jì)中產(chǎn)生的價(jià)值。

TP316

A

1005-5312（2015）11-0057-01