平面設(shè)計(jì)、界面設(shè)計(jì)本應(yīng)該是一個(gè)化繁為簡(jiǎn)，解決問(wèn)題的工具，但是我們經(jīng)常通過(guò)設(shè)計(jì)把問(wèn)題變得更加復(fù)雜，為了設(shè)計(jì)而設(shè)計(jì)。所以整理了7條設(shè)計(jì)規(guī)則，幫助ui設(shè)計(jì)師做出更好的設(shè)計(jì)。

＃1 極簡(jiǎn)主義，盡可能的留白

設(shè)計(jì)師喜歡留白，但是客戶想填滿。。。

留白是構(gòu)成一個(gè)好的視覺(jué)布局重要元素，但也是最容易被忽視使用的元素。通常情況下，留白意味著浪費(fèi)屏幕空間。但實(shí)際上，留白對(duì)于設(shè)計(jì)更加簡(jiǎn)化的布局非常有用，因?yàn)檫@樣可以讓用戶專注他們看的內(nèi)容。

來(lái)看一個(gè)留白使用得不錯(cuò)的例子：

＃2 微交互設(shè)計(jì)

推動(dòng)用戶參與網(wǎng)站/網(wǎng)絡(luò)應(yīng)用/移動(dòng)應(yīng)用的方法有很多，但是經(jīng)常被忽視的一點(diǎn)就是“微交互”。

微交互的基本原則是：行動(dòng)-反應(yīng)。在真實(shí)物理環(huán)境中，每個(gè)動(dòng)作都會(huì)有相應(yīng)的反應(yīng)。所以這個(gè)也適用于設(shè)計(jì)，這樣的小交互設(shè)計(jì)能讓界面看起來(lái)更加有生機(jī)和活力。

來(lái)看一下哪些地方需要用到微交互：

1，打開/關(guān)閉

2，調(diào)整設(shè)置偏好

3，上傳和下載

4，通知

5，社交媒體分享

6，下拉菜單和隱藏菜單

7，突出顯示CTA號(hào)召性用語(yǔ)

修改文本的色彩代碼，文本的顏色跟著改變。

收到新郵件時(shí)，郵件計(jì)數(shù)器會(huì)微妙地增加。

＃3 不知道怎么選擇顏色時(shí)，請(qǐng)使用安靜的顏色

我記得我制作的第一個(gè)UI設(shè)計(jì)方案是黑色系，從那以后，我對(duì)黑暗色調(diào)就有來(lái)一種偏好。我的大多數(shù)設(shè)計(jì)都是暗色調(diào)的。黑色能夠?yàn)樵O(shè)計(jì)賦予了一種其它顏色無(wú)法替代的優(yōu)雅。

有些設(shè)計(jì)方案，在開始設(shè)計(jì)之前就必須確定設(shè)計(jì)的配色方案，這里有一個(gè)訣竅，那就是使用柔和的顏色。

柔和的顏色指南

安靜的顏色讓設(shè)計(jì)師在不違背極簡(jiǎn)主義的原則下，在頁(yè)面內(nèi)創(chuàng)建出深度。用戶可以很容易地在深度較淺的藍(lán)色之上使用柔和的藍(lán)色，讓頁(yè)面有層次感，而不需要只使用陰影的層次結(jié)構(gòu)效果。

＃4 光是來(lái)自頂端

陰影為用戶查找界面元素提供了寶貴的線索。

設(shè)計(jì)師們最常犯的錯(cuò)誤就是忘記了光線是從頂端照下來(lái)的。照亮了頂部，并在下面有投影，物體的頂部較亮，底部較暗。

我們的屏幕是平面的，但是我們投入很了精力去讓所有的內(nèi)容都能以3D的效果呈現(xiàn)出來(lái)。即使在平面設(shè)計(jì)、界面設(shè)計(jì)，我們也一直嘗試著不破壞扁平設(shè)計(jì)的原則下融入3D的元素：

＃5 為每個(gè)頁(yè)面添加一個(gè)聚焦點(diǎn)

突出重點(diǎn)是吸引用戶注意特定設(shè)計(jì)元素的不錯(cuò)策略。這可能涉及到內(nèi)容、圖像、鏈接、按鈕等方面。在大多數(shù)的設(shè)計(jì)領(lǐng)域，比如建筑設(shè)計(jì)、景觀設(shè)計(jì)、時(shí)尚設(shè)計(jì)等，都會(huì)使用這個(gè)策略，突出重點(diǎn)都是非常有效的。

平面設(shè)計(jì)師和攝影師廣泛使用 “三分原則”來(lái)創(chuàng)造藝術(shù)和設(shè)計(jì)上的重點(diǎn)內(nèi)容。

在上圖中，突出重點(diǎn)是通過(guò)顏色來(lái)實(shí)現(xiàn)的。

＃6 讓用戶感覺(jué)到他們自己很聰明

設(shè)計(jì)不應(yīng)該是復(fù)雜的。當(dāng)用戶能夠預(yù)測(cè)某個(gè)事物的設(shè)計(jì)行為時(shí)，他們會(huì)感到很開心，因?yàn)檫@讓他們認(rèn)識(shí)到自己很聰明。

用戶喜歡能讓他們感到自己聰明的產(chǎn)品和服務(wù)。他們花費(fèi)的寶貴注意力，時(shí)間和金錢越值得，他們就會(huì)覺(jué)得自己更聰明。用戶在與您的產(chǎn)品互動(dòng)時(shí)感覺(jué)越聰明，他們就越會(huì)喜歡上您的產(chǎn)品。

下面圖片的小例子。相比左邊的鹽和胡椒瓶，用戶更喜歡右邊的。因?yàn)橛脩舾菀讌^(qū)分哪個(gè)是鹽，哪個(gè)是胡椒粉。

界面設(shè)計(jì)時(shí)，如果漢堡包圖標(biāo)是用來(lái)表示來(lái)自左側(cè)的菜單，則不要用它來(lái)表示配置文件的詳細(xì)信息。

＃7 保持一致

一致性的設(shè)計(jì)是直觀的設(shè)計(jì)。

當(dāng)設(shè)計(jì)是一致時(shí)，人們可以毫無(wú)壓力的將原有認(rèn)識(shí)遷移到新的環(huán)境中，并快速學(xué)習(xí)新的事物。這樣，他們可以專注于執(zhí)行任務(wù)，而不是花大量的時(shí)間去學(xué)習(xí)新的UI界面的。