界面設(shè)計中扁平化風(fēng)格探析

◎張大慶

界面設(shè)計中扁平化風(fēng)格探析

◎張大慶

指出界面設(shè)計扁平化風(fēng)格是時代需求，分析扁平化頁面設(shè)計在形式和色彩上的安排，并提出相應(yīng)的設(shè)計要求。

扁平化 界面設(shè)計 形式

一、扁平化風(fēng)格是應(yīng)時代需求

扁平化界面有助于提高用戶體驗——效率。其一，在視覺效果方面，例如：Andriod手機有很多種分辨率，要想使同一個App在各種分辨率中都能清晰顯示，就需要準(zhǔn)備多套資源以對應(yīng)，ROM資源里就存在hdpi、1dpi、mdpi等資源以對應(yīng)各種不同分辨率，這樣一來，調(diào)用的資源越多，程序運行的速度就越慢。扁平化設(shè)計風(fēng)格傾向于矢量風(fēng)格圖形，在一定程度上減弱對像素精度的依賴，從而創(chuàng)建出適應(yīng)性更高的用戶界面。類似的問題在Windows7系統(tǒng)中也很突出，雖說Windows7視覺效果比起XP而言要炫得多, 但同等配置下的Windows7運行速度卻遠遠低于XP系統(tǒng)。扁平化風(fēng)格設(shè)計可以很好地解決這些問題，讓系統(tǒng)運行更流暢，從而提高用戶操作體驗。

1.扁平化設(shè)計的原則

（1）頁面的形式安排

“對齊”能夠創(chuàng)造更整齊劃一的版式，讓信息傳達更加清晰快捷。文本內(nèi)容的位置，可以讓其邊緣按照普通的行或列對齊，或者讓其主體按照一個中心點排列。視覺元素應(yīng)該以一個或者多個要點對齊，這樣能創(chuàng)造出一致性與相符性，增加設(shè)計的整體美感，使人覺得消晰舒適。

（2）80/20 法則的運用。

在好的界面設(shè)計中，大約80％的效果是由20％的變量造成的。比如，一個產(chǎn)品，設(shè)計師用的是它關(guān)鍵的20％的功能，那么設(shè)計師就應(yīng)該把80 ％的時間、設(shè)計和測試資源都用在這些功能上面。設(shè)計中的元素是有主次之分的。設(shè)計師可以利用80 / 20 法則來評估系統(tǒng)元素之間的價值，并做出更加優(yōu)化的決策。形式布局上的容易使用也是扁平化頁面形式安排上應(yīng)著重考慮的。設(shè)計出的東西和環(huán)境應(yīng)該無需改變就能使用，并能給越多人使用越好。扁平化還應(yīng)注意界面的美觀實用效應(yīng)。好用但不美觀的設(shè)計，接受度往往不高，也就談不到是否實用了。這些偏見及其帶來的一系列后續(xù)反應(yīng)是很難改變的。美學(xué)在設(shè)計使用上起到了重要作用，美觀的設(shè)計更能促進正面態(tài)度的形成，而且人們會更愿意容忍美觀設(shè)計的缺陷。

2.頁面的顏色安排

扁平化風(fēng)格頁面設(shè)計的顏色安排對顏色的數(shù)目，顏色的組合和純度都提出了相應(yīng)的要求。

（1）顏色的數(shù)目。扁平化使用顏色的數(shù)目要盡可能的少。一個設(shè)計作品。一眼掃過去，所能接受的顏色數(shù)目要盡可能的少。因為大多數(shù)人的顏色觀覺是有限的。不要把顏色當(dāng)作信息表達的唯一途徑；（2）顏色的組合。為使顏色的組合達到美觀。扁平化設(shè)計利用色環(huán)上的色彩（相似色）、色環(huán)上相反的顏色（輔色）、色環(huán)中對稱多邊形角上的顏色（三角形和正方形）和大自然中的色彩組合；（3）純度。如果色彩的主要目的是吸引注意力，可以利用飽和色（純色）；如果效果和效率是主要目的，則利用去飽和度的色彩。通常，扁平化運用去飽和度、明亮的色彩，會使人感覺友善，而專業(yè)。

二、扁平化不是簡單化

1.可理解性。在扁平化風(fēng)格界面設(shè)計中，最需要考慮是可理解性。設(shè)計的可理解性很大程度上取決于界面如何向用戶表達功能。設(shè)計中要表達出那些有用的功能，可是，如果功能以一種難以理解的方式表達，那么它們基本上就不能發(fā)揮作用；2.有效性/可用性。有效性要求扁平化必須能夠提供必需的功能來滿足用戶的需求。這意味著在繪制系統(tǒng)中的設(shè)計應(yīng)該提供繪制圖形所必需的所有工具，或者意味著網(wǎng)站需要提供滿足用戶需求的各種信息；3.簡潔性。簡潔是一種高層次扁平化原則。

扁平化設(shè)計既是簡潔又是高效的事物，是設(shè)計過程中一件難以完成的任務(wù)。

在Ockham’s razor中對簡潔的概念有很好的描述，它是由中世紀(jì)英國的哲學(xué)家和圣芳濟會的僧侶Ockham Willian提出的。該原則可以理解為如果給出了兩個水平相當(dāng)?shù)脑O(shè)計，最簡潔的那個是最好的。在物理和圖形設(shè)計等學(xué)科中，它是一個被廣泛接受的概念。同樣，在扁平化交互設(shè)計中也需要很好地使用這個原則。設(shè)計者減少不必要的細節(jié)并去掉了不易于理解的元素。同時，簡潔性原則要求設(shè)計應(yīng)當(dāng)只包含表達必要信息所需的元素。

4.可記憶性

可記憶性原則可用來提高設(shè)計的效率。具有較好的可記憶性的扁平化界面易于用戶學(xué)習(xí)和使用，而且便于用戶進行控制。

可記憶性的交互設(shè)計將會使扁平化界面更加易于理解和高效，因為用戶不需要過多的思考。這允許用戶使用已有的經(jīng)驗進行界面設(shè)計。

三、結(jié)語

扁平化并不是完全沒有設(shè)計效果的設(shè)計，只是少了一些多余的人造的維度。并始終將用戶的需求放在首位，牢記“用戶的需求高于美學(xué)追求”。不論哪種應(yīng)用設(shè)計風(fēng)格的選擇，都應(yīng)該取決于實際功能。無論何種視覺風(fēng)格，精準(zhǔn)的信息表達，良好的交互體驗才是界面設(shè)計的根本。

[1]夏穎“數(shù)字產(chǎn)品界面中樸素的設(shè)計和冗余的設(shè)計”,《裝飾》,2013.05

（作者單位：長江大學(xué)藝術(shù)學(xué)院）

（責(zé)任編輯 陳天賜）