- 原文作者 : Nick Babich
- 譯者 : edvardhua
- 校對者 : owenlyn, jiaowoyongqi, Graning
設(shè)計是一件用戶驅(qū)動很強的工作饥努。隨著用戶越來越偏好更簡潔的交互界面草穆，如何剔除多余的元素凛剥，保留最基礎(chǔ)最重要的元素是極簡設(shè)計的關(guān)鍵俏拱。極簡設(shè)計形式和功能完美結(jié)合勤家。它最大的優(yōu)點是極簡的表現(xiàn)形式抵卫，簡潔的線條健民，大方的留白抒巢，簡約的圖形化元素，就算是很復(fù)雜的內(nèi)容秉犹，在這樣的設(shè)計下也會顯得很簡潔和干練蛉谜。當(dāng)然，如果能有效的利用這些元素崇堵。
極簡設(shè)計必須要 簡潔明了和一致的可用性 悦陋。你的交互系統(tǒng)應(yīng)該通過 清晰的視覺傳達（clear visual communication） 來解決用戶的問題。這也是為什么具備簡潔設(shè)計和高可用性的應(yīng)用如此讓人深刻筑辨。即便只是一個通過極簡設(shè)計的導(dǎo)航俺驶，都能夠提供很強的交互方式。要做到這一點棍辕，你需要注意以下幾個方面暮现。
簡單的配色方案
簡單的配色方案能夠提高用戶體驗，相應(yīng)的 太多的色彩則會給用戶負面的影響楚昭。針對于初學(xué)者栖袋，有一些預(yù)先定義的標準顏色方案能夠讓你輕松創(chuàng)建新的顏色方案。
-
單配色方案抚太。 單配色方案由特定色彩的不同的色調(diào)塘幅，陰影或顏色深淺所構(gòu)成昔案。他們的原理是通過修改特定顏色的飽和度和亮度，可以生成多種協(xié)調(diào)的顏色电媳，這種顏色方案比較簡潔和優(yōu)雅踏揣，不會給眼睛產(chǎn)生太大負擔(dān)。
藍色的單配色方案匾乓。素材來源: Smashing Magazine
素材來源: Dribbble
-
近似色彩配色方案 近似色彩配色方案 的思路是從色輪上取三個相鄰的顏色來做為配色捞稿。全手勢操作的應(yīng)用 Clear 使用了近似色彩配色方案，它使用不同顏色來區(qū)分任務(wù)的優(yōu)先級或者高亮關(guān)鍵的任務(wù)拼缝。（頂端的任務(wù)使用最鮮艷的顏色娱局，而底部的任務(wù)則使用明亮精致的顏色）
漸變的黃色和橙色也是近似色彩配色方案的一個例子。素材來源: tuts+
IOS 平臺的 Clear 應(yīng)用
模糊效果
模糊效果出現(xiàn)在極簡UI設(shè)計中是一件非常符合邏輯的事情咧七，它能夠增加 UI 的層次感衰齐。如果你的 UI 擁有多個層級，使用模糊效果能夠讓用戶清晰的了解到 UI 的前后層級的關(guān)系继阻。這也給了設(shè)計師一個完美的機會來設(shè)計多樣化的菜單和層級效果耻涛。
雅虎天氣 顯示了一張當(dāng)前位置的風(fēng)景圖片，如果需要查看天氣的詳細信息穴翩，你只需要向上滑動便會馬上顯示出來犬第。與在原先的頁面上疊加一層相比，這種方式在增加了詳細信息的易于獲取的情況下還保存了上一張圖片作為模糊背景后芒帕，幫助用戶在操作之后有更為直觀的反饋歉嗓。而且交互方式極為自然，你可以很方便的就返回到上一層背蟆。
IOS 上的雅虎天氣
一個應(yīng)用中只使用一種字體
在一個應(yīng)用中使用多種字體會看起來很散亂和馬虎鉴分。減少屏幕上字體的類型數(shù)量可以增強排版的效果。當(dāng)你在設(shè)計應(yīng)用的時候你可以通過更改字體的字重带膀，樣式志珍，尺寸和大小來優(yōu)化布局效果，而不是更換字體垛叨。
通常來說伦糯，一個應(yīng)用中只使用一種字體 素材來源: Apple
當(dāng)你在為APP選擇字體的時候，選擇平臺的默認字體可能是最安全穩(wěn)妥的選擇：
- 蘋果使用 San Francisco family 字體來提供全平臺一致的閱讀體驗嗽元。（在 IOS 9 中簡稱為 SF-UI）
- Roboto 和 Noto 分別是 Android 和 Chrome 的默認字體
減少屏幕上使用的字體類型能夠獲得較好的排版效果敛纲。素材來源: Dribbble
數(shù)據(jù)的視覺焦點
你應(yīng)該使用大號字體和醒目的顏色來讓特定的數(shù)據(jù)成為視覺的焦點。使用中性的顏色（黑白灰）來展示普通的內(nèi)容剂癌，而一些具備操作的部分則使用強對比的顏色來吸引用戶注意淤翔，從而給給予用戶正確的指導(dǎo)和操作。
素材來源: Smashing Magazine
明亮的色調(diào)+中性的色調(diào)是最容易搭配的方案佩谷，同時也是視覺上最引人注意的方案之一旁壮。素材來源: Smashing Magazine
被放大的字體和顯眼的色彩能夠很好的吸引用戶的注意力监嗜，而不需要多余的文字提示。與此同時還提供了簡潔易用的信息收集體驗抡谐。
在屏幕特定的區(qū)域使用放大的字體和彈出的顏色能有效吸引用戶注意力裁奇。
素材來源: Dribbble
使用留白代替線條來區(qū)分元素
設(shè)計師通常使用線條和分割線來給屏幕劃分區(qū)域和功能類別，但是增加太多這些元素會 UI 界面過于臃腫童叠。
更少的線條和分割線能夠讓我們的頁面看起來更加的干凈框喳，現(xiàn)代化和功能突出课幕。我們可以使用間距厦坛，留白和色塊來區(qū)分不同的元素。谷歌日歷就是一個很好的例子乍惊，它使用投影將兩個內(nèi)容不同的區(qū)塊清晰地拉開層次杜秸，而不是用線段來簡單地分割。
間隔不僅提供了清晰的視覺也增加了日歷應(yīng)用的易用性润绎。
圖標：線條和填充
我們使用圖標用來表達某種功能或者內(nèi)容撬碟，圖標作為一種視覺語言，它應(yīng)該是簡約易于識別和理解的莉撇。IOS 7 后許多極簡設(shè)計的 UI 都使用線條或者填充的圖標呢蛤。來看看同一個圖標分別使用線條和填充的效果。
時鐘圖標 素材來源: icons8
我們來看看底部菜單欄的圖標棍郎。該圖標在應(yīng)用中通常是作為導(dǎo)航的存在其障，所以指示當(dāng)前用戶所在區(qū)域是很重要的，我們通常使用高亮圖標來表示當(dāng)前用戶所選中的區(qū)域涂佃。這個時候励翼，灰色的線性圖標表示為未選中的狀態(tài)。這樣一來我們的底部菜單欄就很直觀了辜荠。
蘋果商店的底部導(dǎo)航 素材來源: viget
總結(jié)
簡約的 UI 和設(shè)計技術(shù)是完成優(yōu)秀設(shè)計的關(guān)鍵汽抚，但是極簡設(shè)計的本身不是設(shè)計的目的。我們最終的目標是要簡約 UI 的同時需要保證功能的完整性和高可用性伯病。簡單的流程造烁，清晰的視覺傳達和與設(shè)計的結(jié)合來打造無縫的交互體驗才是最重要的。
