給初學者的五分鐘設計指南-當即提高設計檔次

 如下內容由Mockplus團隊翻譯整理，僅供學習交流，Mockplus是更快更簡單的原型設計工具。

對於剛進入設計行業的新人來講，每每會忽略一些廣泛性的設計原則。然而，好的設計原則是可以被全部人理解並運用到本身的設計中的。今天給你們分享一些關於設計的小訣竅，你立馬就能夠靈活的應用到實際的工做中，而且有助提高你的設計檔次。

若是你不相信本身可以作好設計，那麼請記住咱們傳說人物-David Eric Grohl說過的這段話：

我從不學習打鼓課程，從不學習吉他課程，我靠的僅僅是我的的摸索。我認爲假若你真的對什麼東西充滿激情，你就會有動力，你就會集中注意力的去學習，這樣，你能夠作任何你想作的事情。——Dave Grohl，噴火戰機樂隊

把這句話放在內心，你準備好學習速成課了嗎？讓咱們開始吧（沒有特定順序）：

1. 利用足夠的色彩對比

在咱們的平常設計工做中，請確保素材背景和字體顏色有足夠的色彩對比，以避免形成視覺效果上的障礙。如：白底黑字是最容易辨認的，這樣顯示的效果會比較鮮明。最好不要使用淺灰、黃色或綠色。這些顏色相近的色彩在視覺感覺上不容易辨認。

2. 深灰色比黑色更好

咱們在文字排版的時候，能夠嘗試使用深灰色#333333 RGB（51, 51, 51)。而不是純黑色，由於，純黑色會與純白背景造成鮮明對比，會顯得很刺眼。而深灰色顯得更加柔和，讓人更容易集中注意力閱讀。

3. 把重要內容放在前面

在佈局網頁或者設計App時，要把重點內容突出展現。重要的內容應該是不須要縮放、滾動或點擊等操做就能夠看到的。

讓咱們看看幾個視覺層級設計的實例。

Instagram（下圖左側），很好的將用戶發佈的圖片/視頻展示在整個屏幕上。

Pinterest（右下方），將搜索欄固定到頂部來建立視覺層次結構，而後搜索欄在下面放置網格。 有意將搜索框做爲頁面上的首項。

搜索是這款App 的核心功能，人們使用Pinterest來發現和瀏覽本身想要的頁面。

再來看其餘的兩個實例。

Spotify（下圖左側）很顯眼的把唱片封面和音樂標題放在第一位，將用戶操做按鈕放在第二位。儘管操做是第二位，Spotify仍然保證播放暫停按鈕比前進後退按鈕更顯眼。

Facebook（下圖右側）看起與Instagram很是類似，將好友發佈的內容放到前面和屏幕中間。

4. 對齊

若是說有一個能夠快速提高你設計檔次的方法，那就是將你的設計素材對齊。

這也是爲何設計師會使用「柵格」來提醒本身對齊，一個好的排版會給用戶帶來不一樣的用戶體驗。

確保元素對齊是改進任何App或網站最簡單的方法，能夠立馬讓視覺效果提高10倍。

讓咱們再看看其它對齊案例，此次實例是Medium。

下面是一個Medium的頁面，你以爲看起來如何？

是否是感受哪裏不順眼？

提示：注意左側的對齊狀況，你看起來怎麼樣？

左邊，我突出顯示了很差的排版方式，在右邊，我僅僅將內容左側對齊了。

左邊未對齊方式給人帶來視覺衝擊，右邊是始終保持對齊

左邊是很差的對齊方式，右邊是固定對齊方式

5. 文字尺寸和留白

咱們的設計是給人看的，而不是給螞蟻設計的。增長文字尺寸並多留些空白可以保證內容更加易讀。

好的文字尺寸VS很差的文字尺寸

好的留白VS很差的留白

6. 若是順序很重要的話，使用列表

大部分移動/網頁App都設計有搜索功能，對於應該如何展現搜索結果，可能有些爭議。

若是結果順序很重要，那麼列表是最有效的展現方式。

若是結果順序不重要，而且還鼓勵用戶瀏覽探索更多（像是Pinterest或Airbnb），那麼網格視圖就能夠提供更多的信息，更方便用戶瀏覽搜索結果。

7. 先作黑白設計，再上色

在設計應用界面的時候，使用黑白設計，這樣可以讓咱們更好的關注核心用戶體驗。

若是在設計的時候直接使用其餘色彩，會很容易影響設計師情感並下降專一度。

8. 讓設計用起來舒服

手的使用是一個很現實的問題，Luke畫出了手機上最容易接觸和使用的區域（對於右手來講）——我挺喜歡那些能夠設置左右手功能的App。

不少高效的手機App都會把導航欄和主要操做按鈕放置在手機的底部。

9. 借用調色板

色彩是一種讓人難以捉摸的藝術。我強烈推薦你們去Dribbble搜索「Color Palettes」或者使用調色板編輯器，如Coolors或者Color Claim。這樣能夠給你節約幾個小時的爭論和糾結時間。

10. 使用Apple和Google的系統設計規範

蘋果和谷歌公司都編寫了很好的設計資源，能夠幫助任何人搭建Android或iOS的App。

例如，Google的Material裏有設計原則、資源、色彩、圖標和控件，可以幫助你快速開始App設計。

蘋果公司的《人機交互指南》，在這裏面，你能夠找到設計一款iOS應用程序的一切要點。

谷歌公司《材料設計》和蘋果公司《人機交互指南》部分截圖

最後，設計須要多練習

只有將知識運用起來才能真正幫助你提高本身的設計水平。雖然，將目光和注意力聚焦在不一樣的設計問題上，很費時間與精力，可是你會發現這是成爲真正偉大設計師的必經之路。

原文做者：Marc Hemeon

原文地址：https://medium.com/startup-grind/how-to-not-suck-at-design-a-5-minute-guide-for-the-non-designer-291efac43037

 Mockplus作原型，更快更簡單，如今下載Mockplus，免費體驗暢快的原型設計之旅。