很多設計師容易犯一個錯：設計不明確

設計一旦不明確，就容易讓用戶產生疑惑，甚至認為出現了bug！

我的原則就是，要么不做變化，要做咱就做的徹底一點，明確一點！

我從以下方面舉幾個例子：

1.間距

2.大小

3.樣式

4.顏色

1.間距

當信息內容需要區隔的時候，最常用的兩種方式：

一種是加一條細細的分割線；

另一種是加一條粗粗的分割塊：

我們有一次在加分割塊的時候就出現了一個小失誤，把分割塊設定為4pt：

這樣會存在什么問題？

會讓用戶懷疑，這是粗一點的線條？還是細一點的色塊？

所以為了避免這樣情況的發生，線條就細點0.5pt，色塊就粗點10pt（反正稍微大一點就行），明確一點：

再比如之前有一個小案例，大概的信息是這樣排版的：

不細看也沒啥大問題，但是仔細觀察就會發現，在間距方面有一定的優化空間。圖上有六條信息，實際是三組，如果間距不做徹底，就會讓人感覺是獨立的六組，但如果把間距做的徹底一點：

這樣就可以很明確看出，這是三組信息，而不僅僅只是六條信息。

所以要么就不分組，既然分了，就分的徹底一點！

2.大小

界面內信息有很多，這么多信息，有些需要強調，有些可以弱化。

很簡答一個例子，有時候大字后面需要跟一個小字，如果你沒區分開就是這樣的效果：

這樣就很不明確，到底是做了大小變化？還是出現了bug？

所以盡量把二者區分開，比如大小對比、顏色區分、粗細變化：

這樣就可以很明確！

3.樣式

前短時間有位讀者朋友發我一組圖標，圖標源自追波，我覺得整體做的還可以，但是有一個樣式上的小細節可以優化下。

整體圖標樣式都是有厚度的，但是郵件這個圖標看起來就有些猶豫，想表達厚度，但是又沒表達清楚：

圖標源自追波

所以可以讓厚度的寬度加大，并且把側面的顏色和正面區分開，這樣就可以把厚度更明確的表達出來。

再比如之前做過一個引導頁，需要做一個影帶，最開始做的是這樣的：

不知道的還以為是個手表帶，所以必須要仔細觀察影帶的特征，并將其明確的表達出來，比如兩邊的孔是方形的，整體材質要軟一下等等：

這樣表達才明確，用戶才不會困惑！

4.顏色

下面兩組顏色：

左面這組可以很好的突出一個顏色，而右面這組就很難突出某一個顏色。

在界面設計中，有很多場景下，會有多個按鈕，我們需要強調其中一個，就需要采用這種徹底的對比方式：

而不是讓人模凌兩可，分不清主次的方式：

明確一點，用戶就不困惑了。

我們再來一個例子！

其實工作上有很多優化需求都是基于“明確”這個點展開的，前一陣子做的一個排行榜獎牌標識的優化，我們看看原來的樣式，就是因為顏色對比度不夠，產生數字看不清的情況：

在這樣的背景下，我們就可以拉大顏色對比度，讓數字更清晰、更明確：

這就是基于“明確“這個點，進行的需求優化。

總結

今天講的都是做設計不夠明確的小案例，也是很多朋友容易忽略的問題。

ios有一條設計原則就是清晰，清晰的本質就是做的足夠徹底，該強調的強調，該弱化的弱化，比如他們超級醒目的大標題：

當我們能把設計做的足夠明確、足夠有節奏感的時候，就可以減少一定的稚嫩，使設計更穩更成熟！

原文地址：菜心設計鋪（公眾號）

作者：菜心設計鋪

轉載請注明：學UI網》做設計有一道及格線，標準肯定是“它”

藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。

藍藍設計( www.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務