雨涵：好的設計原則對任何人來說都有用。這個指南會告訴你一些基礎設計原則，立即就能用得上并分享給別人。

如果你不相信自己能夠做好設計，那么請記住傳說中的人物David Eric Grohl說過的這段話：

我從不學習打鼓課程，從不學習吉他課程，我靠自己摸索。我認為倘若你真的對什么東西有所熱誠，你就會有動力，你就會集中注意力，你可以做任何你想做的事情?！狣ave Grohl，噴火戰機樂隊

記著上面那段話，你準備好要開始速成課了嗎？讓我們開始吧（沒有特定順序）：

1. 足夠強烈的色彩對比

背景和字體必須有足夠區分，閱讀起來不傷眼睛。白底黑字是最容易辨認的。最好不要使用淺灰、黃色或綠色。如果別人必須瞇著眼睛才能看清文字，那肯定是有問題的。

看完這篇你絕對能用好「對比原則」：《設計基礎功！幫你徹底掌握設計四大原則中的對比原則》

進階版的對比方法：《實例教學！利用「對比原則」做出搶眼設計的20個方法》

2. 深灰比黑色更好

如果可以的話，嘗試使用#333333 RGB（51, 51, 51)，而不是黑色，作為文字顏色。黑白對比晃眼睛，讓人更難集中注意力。

3. 重要內容放在前面

布局是幫助使用App或網站的重要信息。重要的內容應該是第一眼可見的，不需要縮放、滾動或點擊。

讓我們看看幾個視覺層級設計的正面實例。

Instagram（下圖左側）將讓用戶發布的圖片/視頻作為焦點。

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。這樣做可以節約好幾個小時的爭論、糾結的時間。

也可以選擇一些專門提供色板的網站，比如這個專門提供扁平化色板：《專屬扁平化設計的PS色板（配色庫）》。這個《自動生成上千款熱門配色色板的COOLORS》里面有1000+的色板。

如果想自己做色板，可以來看看這篇教程：《教你在PS里通過照片創建色板》

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

這兩家公司都有很棒的資源幫助任何人搭建Android或iOS的App。

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

學習筆記：

1. 《Material Design從這11個方面打破了我的思維局限》
2. 《學霸的自學筆記！Material Design設計規范學習心得》
3. 《重磅教程！幫你全面徹底搞定MATERIAL DESIGN的學習筆記》

Apple則有HIG（Human Interface Guideline），里面羅列了有所有設計iOS平臺App所需要知道的東西。

中文版地址：

1. 《UI設計師必讀的IOS 10人機界面設計指南 （一）》
2. 《UI設計師必讀的IOS 10人機界面設計指南 （二）》
3. 《UI設計師必讀的IOS 10人機界面設計指南 （三）》
4. 《UI設計師必讀的IOS 10人機界面設計指南 （四）》

記住，設計需要練習！

需要一些時間和練習才能夠訓練出一雙辨別設計的銳眼，但是你會發現上面的建議會大大提高你的設計。

原文地址：《How to not suck at design, a 5 minute guide for the non-designer》
譯文地址：zhuanlanzhihu

【優設網 原創文章 投稿郵箱：yuan@uisdc.com】

================關于優設網================
"優設網uisdc.com"是國內人氣最高的網頁設計師學習平臺，專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書：史上最全的設計師圖書導航：http://hao.uisdc.com/book/。
設計微博：擁有粉絲量200萬的人氣微博@優秀網頁設計 ，歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航：全球頂尖設計網站推薦，設計師必備導航：http://hao.uisdc.com