9.23日(rì)音(yīn)訊,網站(zhàn)制(zh♣ π☆ì)作(zuò)扁平化(huà)設計(jì)的(de)5大(dà)特征。↑♠♣如(rú)今設計(jì)界最炙手可(kě)熱(rè)的(de)明(míng)星←>大(dà)概就(jiù)是(shì)扁平化(huà)設計₽©(jì)了(le)吧(ba)，關于它的(d$±e)討(tǎo)論至今都(dōu)沒有(yǒu)冷(l↔©ěng)卻的(de)迹象。諸多(duō)設計(jì)師©↔(shī)分(fēn)成了(le)泾渭分(fēn)明(míng)←✘的(de)兩個(gè)陣營，一(yī)邊努力把扁平化(huà ≈)做(zuò)到(dào)極緻，一(yī)面對(duì)其不(bù)屑一(y→↓>ī)顧。
在我看(kàn)來(lái)，優秀的(de✘π&€)設計(jì)的(de)定義就(jiù)是(shì)好(hǎo)用(yòσ£ng)，隻要(yào)能(néng)設計(jì)出優秀的(d↓ β∑e)産品，我可(kě)以采用(yòng)任何方式，♦£扁平化(huà)也(yě)是(shì)其中之一(yī)。但(dàn)是(shì★")必須意識到(dào)，沒有(yǒu)哪種風(§δαfēng)格是(shì)包打天下(xià)的(de)，不(bù)能(n↑÷éng)強行(xíng)将一(yī)種風(fēn∑©€g)格應用(yòng)到(dào)不(bù)該用(yòn ¥g)的(de)地(dì)方。
那(nà)麽，扁平化(huà)究竟該怎麽實現(xiàn)怎륩ε麽應用(yòng)呢(ne)？下(xià)文(wén)§★将要(yào)做(zuò)的(de)就(jiù)是(shì)分(fēn)✘♠§析扁平化(huà)的(de)五個(gè)最典型的(de)特征，同時(shí)也↔δ(yě)介紹一(yī)下(xià)僞扁平化(huà)（不(bùλ÷)含貶義，隻是(shì)一(yī)種折衷的δ♥∏✔(de)設計(jì)方式）。
一(yī)、拒絕特效
扁平化(huà)這(zhè)個(gè)詞來(lái)自(zì)于這× (zhè)種設計(jì)所使用(yòng)的(de)樣式和(hé)形狀，↔☆₽它完全屬于二次元世界，一(yī)個(gè)簡單的(de)形₩γ↕狀加沒有(yǒu)景深的(de)平面，不(bù¶≈)叫扁平化(huà)都(dōu)浪費(fèi∏©∏)這(zhè)個(gè)詞了(le)。
這(zhè)個(gè)概念最核心的(de)地(₽<dì)方就(jiù)是(shì)放(fàng)棄一(yπ©ī)切裝飾效果，諸如(rú)陰影(yǐng)、透視(shì)、紋理(lǐ)、≠♠×漸變等等能(néng)做(zuò)出3D效果的γ¥(de)元素一(yī)概不(bù)用(yòng)。所有(yǒ'¥u)的(de)元素的(de)邊界都(dōλ±£u)幹淨俐落，沒有(yǒu)任何羽化(huà)、漸變或者陰影(yǐng)。
這(zhè)一(yī)設計(jì)趨勢極¶✔力避免任何拟物(wù)化(huà)的(de)元素，這(zhè)導緻這(zhè)∞ ★一(yī)設計(jì)風(fēng)格在 δσ其它平台有(yǒu)時(shí)候顯得( α$de)突兀，前景圖片、按鈕、文(wén)本和(hé)導航欄與背景圖片 π"♥格格不(bù)入，各成一(yī)派。
那(nà)麽，扁平化(huà)的(de)效果如(rú)何呢(ne)？₽←>
因為(wèi)這(zhè)種設計(jì)有(yǒu)著(zhe)鮮明(☆α≠→míng)的(de)視(shì)覺效果，它所使用(yòng)的(de)元素之↓§σ間(jiān)有(yǒu)這(zhè)清晰的(de)層次和≠ε(hé)布局，這(zhè)使得(de)用(yòng)戶能(n♠≥γ"éng)直觀的(de)了(le)解每個(gè)元♥£素的(de)作(zuò)用(yòng)以及交互方式。如(rú)今從(có ↓ng)網頁到(dào)手機(jī)應用(yòng)無不(bù)在使用(y±ε$òng)扁平化(huà)的(de)設計(jì)風(fēng)格，尤其在手機(®∞>jī)上(shàng)，因為(wèi)屏幕的(de↓←<♠)限制(zhì)，使得(de)這(zhè)一(yī)≠≠£±風(fēng)格在用(yòng)戶體(tǐ)驗上(shànφg)更有(yǒu)優勢，更少(shǎo)的(de)按鈕和(hé)γ™π選項使得(de)界面幹淨整齊，使用(yòng)起來(lái)格外(wài)簡♦€✔單。
二、界面元素
扁平化(huà)設計(jì)通(tōng)常采用(yòn±₽✘g)許多(duō)簡單的(de)用(yòng)戶₩↑<界面元素，諸如(rú)按鈕或者圖标之類。設≥δ計(jì)師(shī)們通(tōng)常堅持使用(&£÷yòng)簡單的(de)外(wài)形（矩形或者圓形），并λ₹且盡量突出外(wài)形，這(zhè)些(xiē)元素一₹♦(yī)律為(wèi)直角（極少(shǎo)的(de)一(yī)些α'(xiē)為(wèi)圓角）。
這(zhè)些(xiē)用(yòng)戶界面元素可(kě)以方©♠&∏便用(yòng)戶點擊，這(zhè)能(néng)極大(dà)的(de)±♥減少(shǎo)用(yòng)戶學習(xí)新交互方"β₹♥式的(de)成本，因為(wèi)用(yòng)戶憑經驗就(jiù)能$≈≤(néng)大(dà)概知(zhī)道(dào)每>♦↓個(gè)按鈕的(de)作(zuò)用(yòng)。
此外(wài)，扁平化(huà)除€∏♠≠了(le)簡單的(de)形狀之外(wài)，還(há↔£₩i)包括大(dà)膽的(de)配色。但(dàn)是(sh¶>$ì)需要(yào)注意的(de)是(shì)，扁平化(hu£≤&<à)設計(jì)不(bù)是(shì)說(shuō)就(jiù)簡單的(de)₩∑$搞些(xiē)形狀和(hé)顔色搭配起來(lái÷✘&)就(jiù)行(xíng)，它和(hé)其他(tā)設計(jì)風(fēnα↓βg)格一(yī)樣，是(shì)由許多(duō)的(de)概念與方法組₹δ成的(de)，想要(yào)學習(xí)具體(tǐ)✘♣®設計(jì)方法的(de)朋(péng)友(yǒu)可(k§₹↑™ě)以看(kàn)看(kàn)Designmodo，這(zhè)裡(lǐ)ε★ ₹有(yǒu)許多(duō)現(xiàn)成的(♥ de)設計(jì)實例可(kě)以讓大(dà)家(jiā)≠∏Ω分(fēn)享（免費(fèi)矩形UI、免費(fèiδ★λ)扁平化(huà)UI，這(zhè)兩個(gβ→è)地(dì)方是(shì)一(yī)些(xiē)簡單的(de)和(hé)一→ γ(yī)些(xiē)最基本的(de)組件(jiàn)；專業(yè)≤₹π矩形UI、專業(yè)扁平化(huà)UI，☆δ這(zhè)兩個(gè)地(dì)方是(shì)一(yī)些₽λ(xiē)完整的(de)網頁）。
三、優化(huà)排版
由于扁平化(huà)設計(jì)的(£ §de)使用(yòng)特别簡單的(de)元素，排版÷Ω♦就(jiù)成了(le)很(hěn)重要(yào)的(de)一(§♣yī)環，排版好(hǎo)壞直接影(yǐng)響視(shì)覺效果♣₩Ω，甚至可(kě)能(néng)間(jiān)接影(yǐng)響用(yòng)戶↕÷體(tǐ)驗。
字體(tǐ)是(shì)排版中很(hěn)重要(y ≤£✘ào)的(de)一(yī)部分(fēn)，它需要(yào)δΩ®和(hé)其他(tā)元素相(xiàng)輔相(x∏₩♣>iàng)成，想想看(kàn)，一(yī)款花(huā)體(≈'ελtǐ)字在扁平化(huà)的(de)界面裡(lǐ)得(de)有(yǒu)÷Ω≈多(duō)突兀。上(shàng)圖是(shì)'β★β一(yī)些(xiē)扁平化(huà)網站(zhàn)使用(yòng™♠≠)無襯線字體(tǐ)的(de)例子(zǐ)，↑₹無襯線字體(tǐ)家(jiā)族龐大(dà≈♦π)分(fēn)之衆多(duō)，其中有(yǒu)些(xiē)字體(tǐ)會☆÷✔♣(huì)在特殊得(de)情景下(xià)會(huì)有(®₩✘yǒu)意想不(bù)到(dào)得(de)效果。但(dàn)注意，過猶不(♣£bù)及，不(bù)要(yào)使用(yòng)那(nà)些(xiē)極為₩¥ Ω(wèi)生(shēng)僻的(de)字©"α£體(tǐ)，因為(wèi)保不(bù)齊它就(jiù)把α§你(nǐ)帶進坑裡(lǐ)了(le)。
如(rú)何使用(yòng)字體(t¥♥←ǐ)也(yě)是(shì)一(yī)門(mén)學問(wèn)，要(yà'γo)學會(huì)讓不(bù)同的(de)©•字體(tǐ)表達不(bù)同的(de)概念，通(tōng)過•¶字體(tǐ)告訴用(yòng)戶這(zhè)某一(yī)設計(jì)φ'σ₽／功能(néng)的(de)含義，努力使字體(<₽tǐ)成為(wèi)你(nǐ)簡化(huà)±♥€<設計(jì)的(de)有(yǒu)力武器(qì)。
四、如(rú)何配色
扁平化(huà)設計(jì)中，配色貌似是(shì)最重♥εδ要(yào)的(de)一(yī)環，扁平化≠→(huà)設計(jì)通(tōng)常采用(yΩ₹òng)比其他(tā)風(fēng)格更明γ©λ(míng)亮(liàng)更炫麗(lì)的↕¥(de)顔色。同時(shí)，扁平化(huà)設φ→$§計(jì)中的(de)配色還(hái)意味著 ↑§→(zhe)更多(duō)的(de)色調。比如(rú)，其他(tā)設•'♥π計(jì)最多(duō)隻包含兩三種主要(yào)顔色，但(dàn)是(sh₩✔₽ì)扁平化(huà)設計(jì)中會(hδαuì)平均使用(yòng)六到(dào)八種顔色。
而且扁平化(huà)設計(jì)中，往往傾向于使用(yγ♦✔"òng)單色調，尤其是(shì)純色，并且不(bù)做(zuò)任何★÷β€淡化(huà)或柔化(huà)處理(lǐ)（最受歡迎的(de★ )顔色是(shì)純色和(hé)二次色）。另外( ♥★wài)還(hái)有(yǒu)一(yī)些(xiē)顔色也(yě)¥ 挺受歡迎，如(rú)複古色（淺橙、紫色、綠(£₽π∏lǜ)色、藍(lán)色等）。
五、最簡方案
設計(jì)師(shī)要(yào)盡量簡化≤✘(huà)自(zì)己的(de)設計(jì)方↕< ¶案，避免不(bù)必要(yào)的(de)元素出現(xiàn→>)在設計(jì)中。簡單的(de)顔色和( π∑≤hé)字體(tǐ)就(jiù)足夠了(le)，如(rú)果你(nǐ)σ×₩δ還(hái)想添加點什(shén)麽，盡量選擇簡單的(de)圖案。
扁平化(huà)設計(jì)尤其對(d≥®✘uì)一(yī)些(xiē)做(zuò)零售的 &₩€(de)網站(zhàn)幫助巨大(dà)，∞♣↕≥它能(néng)很(hěn)有(yǒu)效的(de)把商品組織起來(l→©ái)，以簡單但(dàn)合理(lǐ)方式排列。
