"設計師在呈現設計方案時，有哪些設計法則和設計模型可以讓你的設計更加有理有據，無可挑剔呢？本文將為大家呈現一份有效的設計法則應用指南，幫助大家解決這個問題，enjor~
設計師在呈現設計方案時，有哪些設計法則和設計模型可以讓你的設計更加有理有據，無可挑剔呢？本文將為大家呈現一份有效的設計法則應用指南，幫助大家解決這個問題，enjor~
作為設計師，在傳達我們的設計理念，呈現我們設計方案時，我們經常會援引一些設計法則和設計模型，以此來彰顯我們設計推導過程及方案的嚴謹性與合理性。
可是網上設計法則眾說紛紜，百家爭鳴，到底哪些法則才是我們在設計中最常使用，溝通中最常提及，宣講中最常引用，反饋中最常被認可的設計法則呢？我們在各個設計階段，又該如何運用這些設計法則呢？
今天，筆者將結合自身工作經驗，為你呈現一份最有效的設計法則應用指南，讓你的設計更加有理有據，無可挑剔。
設計法則總覽
首先，我們來瞄一眼，設計師日常遵從的設計法則都有哪些呢？
"設計師在呈現設計方案時，有哪些設計法則和設計模型可以讓你的設計更加有理有據，無可挑剔呢？本文將為大家呈現一份有效的設計法則應用指南，幫助大家解決這個問題，enjor~
作為設計師，在傳達我們的設計理念，呈現我們設計方案時，我們經常會援引一些設計法則和設計模型，以此來彰顯我們設計推導過程及方案的嚴謹性與合理性。
可是網上設計法則眾說紛紜，百家爭鳴，到底哪些法則才是我們在設計中最常使用，溝通中最常提及，宣講中最常引用，反饋中最常被認可的設計法則呢？我們在各個設計階段，又該如何運用這些設計法則呢？
今天，筆者將結合自身工作經驗，為你呈現一份最有效的設計法則應用指南，讓你的設計更加有理有據，無可挑剔。
設計法則總覽
首先，我們來瞄一眼，設計師日常遵從的設計法則都有哪些呢？
大師設計法則概覽
主要包括“易用之王”雅各布·尼爾森經典的【尼爾森10大可用性原則】，著有《GUI設計禁忌》的易用性資訊公司UI Wizards的總裁傑夫·約翰遜的【約翰遜9大界面設計準則】，以及美國計算機科學家和教授本·斯奈德曼的《斯奈德曼8大界面設計黃金法則》。
除了這三位大師級人物總結的設計原則之外，以下這些也是我們作為設計師經常為參考和遵從的設計原則。它們分別是【IOS 6大設計原則】【Android 5大設計原則】【格式塔原理】和我整理的設計師常用的【其他11大設計法則】。
"設計師在呈現設計方案時，有哪些設計法則和設計模型可以讓你的設計更加有理有據，無可挑剔呢？本文將為大家呈現一份有效的設計法則應用指南，幫助大家解決這個問題，enjor~
作為設計師，在傳達我們的設計理念，呈現我們設計方案時，我們經常會援引一些設計法則和設計模型，以此來彰顯我們設計推導過程及方案的嚴謹性與合理性。
可是網上設計法則眾說紛紜，百家爭鳴，到底哪些法則才是我們在設計中最常使用，溝通中最常提及，宣講中最常引用，反饋中最常被認可的設計法則呢？我們在各個設計階段，又該如何運用這些設計法則呢？
今天，筆者將結合自身工作經驗，為你呈現一份最有效的設計法則應用指南，讓你的設計更加有理有據，無可挑剔。
設計法則總覽
首先，我們來瞄一眼，設計師日常遵從的設計法則都有哪些呢？
大師設計法則概覽
主要包括“易用之王”雅各布·尼爾森經典的【尼爾森10大可用性原則】，著有《GUI設計禁忌》的易用性資訊公司UI Wizards的總裁傑夫·約翰遜的【約翰遜9大界面設計準則】，以及美國計算機科學家和教授本·斯奈德曼的《斯奈德曼8大界面設計黃金法則》。
除了這三位大師級人物總結的設計原則之外，以下這些也是我們作為設計師經常為參考和遵從的設計原則。它們分別是【IOS 6大設計原則】【Android 5大設計原則】【格式塔原理】和我整理的設計師常用的【其他11大設計法則】。
經典設計法則概覽
一下子看到如此多的法則是不是有點頭大？這麼多法則，它們之間有什麼關聯？我們在具體的設計中又是如何應用的呢？下面請跟隨筆者的步伐逐一來看：
"設計師在呈現設計方案時，有哪些設計法則和設計模型可以讓你的設計更加有理有據，無可挑剔呢？本文將為大家呈現一份有效的設計法則應用指南，幫助大家解決這個問題，enjor~
作為設計師，在傳達我們的設計理念，呈現我們設計方案時，我們經常會援引一些設計法則和設計模型，以此來彰顯我們設計推導過程及方案的嚴謹性與合理性。
可是網上設計法則眾說紛紜，百家爭鳴，到底哪些法則才是我們在設計中最常使用，溝通中最常提及，宣講中最常引用，反饋中最常被認可的設計法則呢？我們在各個設計階段，又該如何運用這些設計法則呢？
今天，筆者將結合自身工作經驗，為你呈現一份最有效的設計法則應用指南，讓你的設計更加有理有據，無可挑剔。
設計法則總覽
首先，我們來瞄一眼，設計師日常遵從的設計法則都有哪些呢？
大師設計法則概覽
主要包括“易用之王”雅各布·尼爾森經典的【尼爾森10大可用性原則】，著有《GUI設計禁忌》的易用性資訊公司UI Wizards的總裁傑夫·約翰遜的【約翰遜9大界面設計準則】，以及美國計算機科學家和教授本·斯奈德曼的《斯奈德曼8大界面設計黃金法則》。
除了這三位大師級人物總結的設計原則之外，以下這些也是我們作為設計師經常為參考和遵從的設計原則。它們分別是【IOS 6大設計原則】【Android 5大設計原則】【格式塔原理】和我整理的設計師常用的【其他11大設計法則】。
經典設計法則概覽
一下子看到如此多的法則是不是有點頭大？這麼多法則，它們之間有什麼關聯？我們在具體的設計中又是如何應用的呢？下面請跟隨筆者的步伐逐一來看：
設計師常用設計法則
為了便於理解，我將我們設計師日常的設計工作，簡單拆解為佈局設計和互動設計兩大類。我們現在分別來看，在這兩大類的主要工作中，常用的設計原則分別有哪些？
佈局設計
任何互動設計的元素，都是內嵌到某個具體的頁面內的。所以，在講互動設計之前，我們必須要先要了解界面佈局設計的基礎原則。根據經典的【交互設計四策略】，我將所有的設計原則歸納在合理刪除、分層組織、適時隱藏和巧妙轉移四大設計策略之下。
合理刪除
在著手進行佈局之前，我們首先要進行的工作，是要校驗所有需要佈局的元素，確保所有展示在界面上的元素，都是用戶需要和可理解的。
這裡利用到的設計原則就是【奧卡姆剃刀原理】——如無必要，勿增實體。不僅包括功能，也包括設計中常見的裝飾（如分割線、圖標、引導語等），任何沒有必要顯示給用戶的元素，都不要顯示出來給用戶添加視覺負擔（同時也是增加項目成員設計、開發、維護的成本）。
分層組織
分層組織是界面佈局的重點，我會從整體佈局和元素佈局上來拆解設計師經常會用到的設計原則。
整體佈局——三種典型的視覺流模型
整體佈局主要是要考慮用戶典型的視覺流，如果沒有特殊的視覺流引導趨向，那我們則儘量順應用戶的視覺流方向，以便讓我們的設計更好的契合用戶的瀏覽習慣。
首先出場的是【尼爾森F型視覺模型】，經過長期網站佈局教育所形成的瀏覽習慣，多數用戶在查看信息類產品時，視覺會遵從F型方式進行流動。所以，我們在考慮文本為主的信息類頁面佈局時，通常會將重要的信息、導航放置在頁面的F型位置處。
"設計師在呈現設計方案時，有哪些設計法則和設計模型可以讓你的設計更加有理有據，無可挑剔呢？本文將為大家呈現一份有效的設計法則應用指南，幫助大家解決這個問題，enjor~
作為設計師，在傳達我們的設計理念，呈現我們設計方案時，我們經常會援引一些設計法則和設計模型，以此來彰顯我們設計推導過程及方案的嚴謹性與合理性。
可是網上設計法則眾說紛紜，百家爭鳴，到底哪些法則才是我們在設計中最常使用，溝通中最常提及，宣講中最常引用，反饋中最常被認可的設計法則呢？我們在各個設計階段，又該如何運用這些設計法則呢？
今天，筆者將結合自身工作經驗，為你呈現一份最有效的設計法則應用指南，讓你的設計更加有理有據，無可挑剔。
設計法則總覽
首先，我們來瞄一眼，設計師日常遵從的設計法則都有哪些呢？
大師設計法則概覽
主要包括“易用之王”雅各布·尼爾森經典的【尼爾森10大可用性原則】，著有《GUI設計禁忌》的易用性資訊公司UI Wizards的總裁傑夫·約翰遜的【約翰遜9大界面設計準則】，以及美國計算機科學家和教授本·斯奈德曼的《斯奈德曼8大界面設計黃金法則》。
除了這三位大師級人物總結的設計原則之外，以下這些也是我們作為設計師經常為參考和遵從的設計原則。它們分別是【IOS 6大設計原則】【Android 5大設計原則】【格式塔原理】和我整理的設計師常用的【其他11大設計法則】。
經典設計法則概覽
一下子看到如此多的法則是不是有點頭大？這麼多法則，它們之間有什麼關聯？我們在具體的設計中又是如何應用的呢？下面請跟隨筆者的步伐逐一來看：
設計師常用設計法則
為了便於理解，我將我們設計師日常的設計工作，簡單拆解為佈局設計和互動設計兩大類。我們現在分別來看，在這兩大類的主要工作中，常用的設計原則分別有哪些？
佈局設計
任何互動設計的元素，都是內嵌到某個具體的頁面內的。所以，在講互動設計之前，我們必須要先要了解界面佈局設計的基礎原則。根據經典的【交互設計四策略】，我將所有的設計原則歸納在合理刪除、分層組織、適時隱藏和巧妙轉移四大設計策略之下。
合理刪除
在著手進行佈局之前，我們首先要進行的工作，是要校驗所有需要佈局的元素，確保所有展示在界面上的元素，都是用戶需要和可理解的。
這裡利用到的設計原則就是【奧卡姆剃刀原理】——如無必要，勿增實體。不僅包括功能，也包括設計中常見的裝飾（如分割線、圖標、引導語等），任何沒有必要顯示給用戶的元素，都不要顯示出來給用戶添加視覺負擔（同時也是增加項目成員設計、開發、維護的成本）。
分層組織
分層組織是界面佈局的重點，我會從整體佈局和元素佈局上來拆解設計師經常會用到的設計原則。
整體佈局——三種典型的視覺流模型
整體佈局主要是要考慮用戶典型的視覺流，如果沒有特殊的視覺流引導趨向，那我們則儘量順應用戶的視覺流方向，以便讓我們的設計更好的契合用戶的瀏覽習慣。
首先出場的是【尼爾森F型視覺模型】，經過長期網站佈局教育所形成的瀏覽習慣，多數用戶在查看信息類產品時，視覺會遵從F型方式進行流動。所以，我們在考慮文本為主的信息類頁面佈局時，通常會將重要的信息、導航放置在頁面的F型位置處。
尼爾森F型視覺模型
【尼爾森F型視覺模型】的主要特點是：視覺首先會從頂部開始從左到右水平移動。然後，目光再下移開始從左到右觀察但是長度會相對短些。再後是以較短的長度向下掃視，形成一個 F形狀。
接著，我們再看另一類經典的視覺流【古騰堡圖表法】，它又被稱之為“對角線平衡的和諧狀態”。
它指出：人們在瀏覽頁面或佈局時視線趨於從左上角移動到右下角，參見下圖：
"設計師在呈現設計方案時，有哪些設計法則和設計模型可以讓你的設計更加有理有據，無可挑剔呢？本文將為大家呈現一份有效的設計法則應用指南，幫助大家解決這個問題，enjor~
作為設計師，在傳達我們的設計理念，呈現我們設計方案時，我們經常會援引一些設計法則和設計模型，以此來彰顯我們設計推導過程及方案的嚴謹性與合理性。
可是網上設計法則眾說紛紜，百家爭鳴，到底哪些法則才是我們在設計中最常使用，溝通中最常提及，宣講中最常引用，反饋中最常被認可的設計法則呢？我們在各個設計階段，又該如何運用這些設計法則呢？
今天，筆者將結合自身工作經驗，為你呈現一份最有效的設計法則應用指南，讓你的設計更加有理有據，無可挑剔。
設計法則總覽
首先，我們來瞄一眼，設計師日常遵從的設計法則都有哪些呢？
大師設計法則概覽
主要包括“易用之王”雅各布·尼爾森經典的【尼爾森10大可用性原則】，著有《GUI設計禁忌》的易用性資訊公司UI Wizards的總裁傑夫·約翰遜的【約翰遜9大界面設計準則】，以及美國計算機科學家和教授本·斯奈德曼的《斯奈德曼8大界面設計黃金法則》。
除了這三位大師級人物總結的設計原則之外，以下這些也是我們作為設計師經常為參考和遵從的設計原則。它們分別是【IOS 6大設計原則】【Android 5大設計原則】【格式塔原理】和我整理的設計師常用的【其他11大設計法則】。
經典設計法則概覽
一下子看到如此多的法則是不是有點頭大？這麼多法則，它們之間有什麼關聯？我們在具體的設計中又是如何應用的呢？下面請跟隨筆者的步伐逐一來看：
設計師常用設計法則
為了便於理解，我將我們設計師日常的設計工作，簡單拆解為佈局設計和互動設計兩大類。我們現在分別來看，在這兩大類的主要工作中，常用的設計原則分別有哪些？
佈局設計
任何互動設計的元素，都是內嵌到某個具體的頁面內的。所以，在講互動設計之前，我們必須要先要了解界面佈局設計的基礎原則。根據經典的【交互設計四策略】，我將所有的設計原則歸納在合理刪除、分層組織、適時隱藏和巧妙轉移四大設計策略之下。
合理刪除
在著手進行佈局之前，我們首先要進行的工作，是要校驗所有需要佈局的元素，確保所有展示在界面上的元素，都是用戶需要和可理解的。
這裡利用到的設計原則就是【奧卡姆剃刀原理】——如無必要，勿增實體。不僅包括功能，也包括設計中常見的裝飾（如分割線、圖標、引導語等），任何沒有必要顯示給用戶的元素，都不要顯示出來給用戶添加視覺負擔（同時也是增加項目成員設計、開發、維護的成本）。
分層組織
分層組織是界面佈局的重點，我會從整體佈局和元素佈局上來拆解設計師經常會用到的設計原則。
整體佈局——三種典型的視覺流模型
整體佈局主要是要考慮用戶典型的視覺流，如果沒有特殊的視覺流引導趨向，那我們則儘量順應用戶的視覺流方向，以便讓我們的設計更好的契合用戶的瀏覽習慣。
首先出場的是【尼爾森F型視覺模型】，經過長期網站佈局教育所形成的瀏覽習慣，多數用戶在查看信息類產品時，視覺會遵從F型方式進行流動。所以，我們在考慮文本為主的信息類頁面佈局時，通常會將重要的信息、導航放置在頁面的F型位置處。
尼爾森F型視覺模型
【尼爾森F型視覺模型】的主要特點是：視覺首先會從頂部開始從左到右水平移動。然後，目光再下移開始從左到右觀察但是長度會相對短些。再後是以較短的長度向下掃視，形成一個 F形狀。
接著，我們再看另一類經典的視覺流【古騰堡圖表法】，它又被稱之為“對角線平衡的和諧狀態”。
它指出：人們在瀏覽頁面或佈局時視線趨於從左上角移動到右下角，參見下圖：
古騰堡圖表法
在一些圖片、浮層或者其他一屏可見的頁面佈局中，用戶獲取信息總是習慣從左到右，從上到下，以完成這個頁面的瀏覽。
但並不是四個角都能獲得同等的視覺關注度，往往作為開始和結束的對角線位置，會獲得用戶更高的關注。所以，在這種簡單頁面的佈局中，建議將用戶重點關注的元素和操作，放在左上角的視覺起點和右下角的視覺落腳點，以順應用戶的視覺流。
最後再來說一個【中區偏見】，它指的是位於屏幕中間的位置的元素，更容易獲得人們的注意力。
它的應用場景通常是一些相對獨立的元素聚合在一起時，各個元素都有鮮明的特徵，形態各異，百花齊放，但人們往往會首先注意頁面中間的元素。所以，在設計一些運營類場景畫面時，我們通常把最想用戶關注的元素放置在頁面中間區域，以引起用戶的重點關注。
"設計師在呈現設計方案時，有哪些設計法則和設計模型可以讓你的設計更加有理有據，無可挑剔呢？本文將為大家呈現一份有效的設計法則應用指南，幫助大家解決這個問題，enjor~
作為設計師，在傳達我們的設計理念，呈現我們設計方案時，我們經常會援引一些設計法則和設計模型，以此來彰顯我們設計推導過程及方案的嚴謹性與合理性。
可是網上設計法則眾說紛紜，百家爭鳴，到底哪些法則才是我們在設計中最常使用，溝通中最常提及，宣講中最常引用，反饋中最常被認可的設計法則呢？我們在各個設計階段，又該如何運用這些設計法則呢？
今天，筆者將結合自身工作經驗，為你呈現一份最有效的設計法則應用指南，讓你的設計更加有理有據，無可挑剔。
設計法則總覽
首先，我們來瞄一眼，設計師日常遵從的設計法則都有哪些呢？
大師設計法則概覽
主要包括“易用之王”雅各布·尼爾森經典的【尼爾森10大可用性原則】，著有《GUI設計禁忌》的易用性資訊公司UI Wizards的總裁傑夫·約翰遜的【約翰遜9大界面設計準則】，以及美國計算機科學家和教授本·斯奈德曼的《斯奈德曼8大界面設計黃金法則》。
除了這三位大師級人物總結的設計原則之外，以下這些也是我們作為設計師經常為參考和遵從的設計原則。它們分別是【IOS 6大設計原則】【Android 5大設計原則】【格式塔原理】和我整理的設計師常用的【其他11大設計法則】。
經典設計法則概覽
一下子看到如此多的法則是不是有點頭大？這麼多法則，它們之間有什麼關聯？我們在具體的設計中又是如何應用的呢？下面請跟隨筆者的步伐逐一來看：
設計師常用設計法則
為了便於理解，我將我們設計師日常的設計工作，簡單拆解為佈局設計和互動設計兩大類。我們現在分別來看，在這兩大類的主要工作中，常用的設計原則分別有哪些？
佈局設計
任何互動設計的元素，都是內嵌到某個具體的頁面內的。所以，在講互動設計之前，我們必須要先要了解界面佈局設計的基礎原則。根據經典的【交互設計四策略】，我將所有的設計原則歸納在合理刪除、分層組織、適時隱藏和巧妙轉移四大設計策略之下。
合理刪除
在著手進行佈局之前，我們首先要進行的工作，是要校驗所有需要佈局的元素，確保所有展示在界面上的元素，都是用戶需要和可理解的。
這裡利用到的設計原則就是【奧卡姆剃刀原理】——如無必要，勿增實體。不僅包括功能，也包括設計中常見的裝飾（如分割線、圖標、引導語等），任何沒有必要顯示給用戶的元素，都不要顯示出來給用戶添加視覺負擔（同時也是增加項目成員設計、開發、維護的成本）。
分層組織
分層組織是界面佈局的重點，我會從整體佈局和元素佈局上來拆解設計師經常會用到的設計原則。
整體佈局——三種典型的視覺流模型
整體佈局主要是要考慮用戶典型的視覺流，如果沒有特殊的視覺流引導趨向，那我們則儘量順應用戶的視覺流方向，以便讓我們的設計更好的契合用戶的瀏覽習慣。
首先出場的是【尼爾森F型視覺模型】，經過長期網站佈局教育所形成的瀏覽習慣，多數用戶在查看信息類產品時，視覺會遵從F型方式進行流動。所以，我們在考慮文本為主的信息類頁面佈局時，通常會將重要的信息、導航放置在頁面的F型位置處。
尼爾森F型視覺模型
【尼爾森F型視覺模型】的主要特點是：視覺首先會從頂部開始從左到右水平移動。然後，目光再下移開始從左到右觀察但是長度會相對短些。再後是以較短的長度向下掃視，形成一個 F形狀。
接著，我們再看另一類經典的視覺流【古騰堡圖表法】，它又被稱之為“對角線平衡的和諧狀態”。
它指出：人們在瀏覽頁面或佈局時視線趨於從左上角移動到右下角，參見下圖：
古騰堡圖表法
在一些圖片、浮層或者其他一屏可見的頁面佈局中，用戶獲取信息總是習慣從左到右，從上到下，以完成這個頁面的瀏覽。
但並不是四個角都能獲得同等的視覺關注度，往往作為開始和結束的對角線位置，會獲得用戶更高的關注。所以，在這種簡單頁面的佈局中，建議將用戶重點關注的元素和操作，放在左上角的視覺起點和右下角的視覺落腳點，以順應用戶的視覺流。
最後再來說一個【中區偏見】，它指的是位於屏幕中間的位置的元素，更容易獲得人們的注意力。
它的應用場景通常是一些相對獨立的元素聚合在一起時，各個元素都有鮮明的特徵，形態各異，百花齊放，但人們往往會首先注意頁面中間的元素。所以，在設計一些運營類場景畫面時，我們通常把最想用戶關注的元素放置在頁面中間區域，以引起用戶的重點關注。
中區偏見
元素佈局——四大基本佈局原則親密、對齊、對比、重複
細節元素的佈局設計，往往是體現一個設計師專業性的首要因素。每一個元素的顯示狀態，和其他元素的相對位置、色彩、形狀等，都蘊含在細節設計中。
好的細節元素佈局設計，可以讓用戶在不看內容的前提下，對頁面關係、信息層級一目瞭然。
根據Robbins William提煉的四大基本佈局設計原則【親密、對齊、對比、重複】，我把常用的設計原則也歸納其下：
親密
親密是指將一個頁面的所有信息按照邏輯進行分組，並確定這些組之間的關係，然後通過組與組之間位置（接近性）和形式（相似性）的親密性來表現這些關係。
如果多個項相互之間存在很近的親密性，他們就會形成一個整體的視覺單元，而不是獨立的設計元素，從而為用戶提供簡單清晰的信息結構。
【親密】親密性可以看著是格式塔原理【相似性】和【接近性】的綜合運用，對於有親密性（相似性）的功能，我們通常在佈局設計上，也會考慮位置的親密性（接近性）。
親密性原則建議我們將相關項放置在一起，因為位置接近就意味存在著關聯。我們在設計時一定要注意，千萬不要把沒有任何共同點的兩個功能放置在一起。
多個親密性的功能/選項在一起排序時，還要考慮【序列效應】。因為在列舉信息時，排在最前面和最後面的元素，會比中間的元素更加容易被記住。所以，多個相似元素進行排序時，不能僅僅根據重要程度進行線性排序，要考慮序列效應，將重要的功能適當的首尾分佈，可以更好的獲得用戶的關注，並方便用戶點擊（原因可參見費茨定律）。
對齊
對於設計師來說，任何兩個元素的位置和對齊方式都是經過深思熟慮的。每個元素都應當與頁面上的另一個元素有某種視覺聯繫。這樣規律的對齊原則能建立一種清晰的、精巧而且清爽的外觀，讓用戶的視覺流更加順暢，並提高用戶的瀏覽效率。
在所有對齊方式中，我們在界面設計時，最常用的是左對齊，居中對齊和右對齊相對較少，如果想要在界面中採用居中對齊或者右對齊的方式，一定要考慮這種對齊方式的必要性及特殊意義，而且在整個產品中，貫穿這種對齊原則，讓用戶理解並適應產品的對齊方式。
此外，還有一種容易被大家忽略的對齊方式【區域對齊】，當需要對齊的元素形狀各異，而且不對稱時，如果採用居左、居右或者居中對齊的方式，會導致視覺重心參差不齊。
這種情況下，就有必要採用【區域對齊】——即中軸線對齊，將要對齊的元素順著中軸線擺放，讓中軸線兩邊的視覺重心或者面積相等，這樣雖然邊線沒有對齊，但整體感覺卻是對齊的。
"設計師在呈現設計方案時，有哪些設計法則和設計模型可以讓你的設計更加有理有據，無可挑剔呢？本文將為大家呈現一份有效的設計法則應用指南，幫助大家解決這個問題，enjor~
作為設計師，在傳達我們的設計理念，呈現我們設計方案時，我們經常會援引一些設計法則和設計模型，以此來彰顯我們設計推導過程及方案的嚴謹性與合理性。
可是網上設計法則眾說紛紜，百家爭鳴，到底哪些法則才是我們在設計中最常使用，溝通中最常提及，宣講中最常引用，反饋中最常被認可的設計法則呢？我們在各個設計階段，又該如何運用這些設計法則呢？
今天，筆者將結合自身工作經驗，為你呈現一份最有效的設計法則應用指南，讓你的設計更加有理有據，無可挑剔。
設計法則總覽
首先，我們來瞄一眼，設計師日常遵從的設計法則都有哪些呢？
大師設計法則概覽
主要包括“易用之王”雅各布·尼爾森經典的【尼爾森10大可用性原則】，著有《GUI設計禁忌》的易用性資訊公司UI Wizards的總裁傑夫·約翰遜的【約翰遜9大界面設計準則】，以及美國計算機科學家和教授本·斯奈德曼的《斯奈德曼8大界面設計黃金法則》。
除了這三位大師級人物總結的設計原則之外，以下這些也是我們作為設計師經常為參考和遵從的設計原則。它們分別是【IOS 6大設計原則】【Android 5大設計原則】【格式塔原理】和我整理的設計師常用的【其他11大設計法則】。
經典設計法則概覽
一下子看到如此多的法則是不是有點頭大？這麼多法則，它們之間有什麼關聯？我們在具體的設計中又是如何應用的呢？下面請跟隨筆者的步伐逐一來看：
設計師常用設計法則
為了便於理解，我將我們設計師日常的設計工作，簡單拆解為佈局設計和互動設計兩大類。我們現在分別來看，在這兩大類的主要工作中，常用的設計原則分別有哪些？
佈局設計
任何互動設計的元素，都是內嵌到某個具體的頁面內的。所以，在講互動設計之前，我們必須要先要了解界面佈局設計的基礎原則。根據經典的【交互設計四策略】，我將所有的設計原則歸納在合理刪除、分層組織、適時隱藏和巧妙轉移四大設計策略之下。
合理刪除
在著手進行佈局之前，我們首先要進行的工作，是要校驗所有需要佈局的元素，確保所有展示在界面上的元素，都是用戶需要和可理解的。
這裡利用到的設計原則就是【奧卡姆剃刀原理】——如無必要，勿增實體。不僅包括功能，也包括設計中常見的裝飾（如分割線、圖標、引導語等），任何沒有必要顯示給用戶的元素，都不要顯示出來給用戶添加視覺負擔（同時也是增加項目成員設計、開發、維護的成本）。
分層組織
分層組織是界面佈局的重點，我會從整體佈局和元素佈局上來拆解設計師經常會用到的設計原則。
整體佈局——三種典型的視覺流模型
整體佈局主要是要考慮用戶典型的視覺流，如果沒有特殊的視覺流引導趨向，那我們則儘量順應用戶的視覺流方向，以便讓我們的設計更好的契合用戶的瀏覽習慣。
首先出場的是【尼爾森F型視覺模型】，經過長期網站佈局教育所形成的瀏覽習慣，多數用戶在查看信息類產品時，視覺會遵從F型方式進行流動。所以，我們在考慮文本為主的信息類頁面佈局時，通常會將重要的信息、導航放置在頁面的F型位置處。
尼爾森F型視覺模型
【尼爾森F型視覺模型】的主要特點是：視覺首先會從頂部開始從左到右水平移動。然後，目光再下移開始從左到右觀察但是長度會相對短些。再後是以較短的長度向下掃視，形成一個 F形狀。
接著，我們再看另一類經典的視覺流【古騰堡圖表法】，它又被稱之為“對角線平衡的和諧狀態”。
它指出：人們在瀏覽頁面或佈局時視線趨於從左上角移動到右下角，參見下圖：
古騰堡圖表法
在一些圖片、浮層或者其他一屏可見的頁面佈局中，用戶獲取信息總是習慣從左到右，從上到下，以完成這個頁面的瀏覽。
但並不是四個角都能獲得同等的視覺關注度，往往作為開始和結束的對角線位置，會獲得用戶更高的關注。所以，在這種簡單頁面的佈局中，建議將用戶重點關注的元素和操作，放在左上角的視覺起點和右下角的視覺落腳點，以順應用戶的視覺流。
最後再來說一個【中區偏見】，它指的是位於屏幕中間的位置的元素，更容易獲得人們的注意力。
它的應用場景通常是一些相對獨立的元素聚合在一起時，各個元素都有鮮明的特徵，形態各異，百花齊放，但人們往往會首先注意頁面中間的元素。所以，在設計一些運營類場景畫面時，我們通常把最想用戶關注的元素放置在頁面中間區域，以引起用戶的重點關注。
中區偏見
元素佈局——四大基本佈局原則親密、對齊、對比、重複
細節元素的佈局設計，往往是體現一個設計師專業性的首要因素。每一個元素的顯示狀態，和其他元素的相對位置、色彩、形狀等，都蘊含在細節設計中。
好的細節元素佈局設計，可以讓用戶在不看內容的前提下，對頁面關係、信息層級一目瞭然。
根據Robbins William提煉的四大基本佈局設計原則【親密、對齊、對比、重複】，我把常用的設計原則也歸納其下：
親密
親密是指將一個頁面的所有信息按照邏輯進行分組，並確定這些組之間的關係，然後通過組與組之間位置（接近性）和形式（相似性）的親密性來表現這些關係。
如果多個項相互之間存在很近的親密性，他們就會形成一個整體的視覺單元，而不是獨立的設計元素，從而為用戶提供簡單清晰的信息結構。
【親密】親密性可以看著是格式塔原理【相似性】和【接近性】的綜合運用，對於有親密性（相似性）的功能，我們通常在佈局設計上，也會考慮位置的親密性（接近性）。
親密性原則建議我們將相關項放置在一起，因為位置接近就意味存在著關聯。我們在設計時一定要注意，千萬不要把沒有任何共同點的兩個功能放置在一起。
多個親密性的功能/選項在一起排序時，還要考慮【序列效應】。因為在列舉信息時，排在最前面和最後面的元素，會比中間的元素更加容易被記住。所以，多個相似元素進行排序時，不能僅僅根據重要程度進行線性排序，要考慮序列效應，將重要的功能適當的首尾分佈，可以更好的獲得用戶的關注，並方便用戶點擊（原因可參見費茨定律）。
對齊
對於設計師來說，任何兩個元素的位置和對齊方式都是經過深思熟慮的。每個元素都應當與頁面上的另一個元素有某種視覺聯繫。這樣規律的對齊原則能建立一種清晰的、精巧而且清爽的外觀，讓用戶的視覺流更加順暢，並提高用戶的瀏覽效率。
在所有對齊方式中，我們在界面設計時，最常用的是左對齊，居中對齊和右對齊相對較少，如果想要在界面中採用居中對齊或者右對齊的方式，一定要考慮這種對齊方式的必要性及特殊意義，而且在整個產品中，貫穿這種對齊原則，讓用戶理解並適應產品的對齊方式。
此外，還有一種容易被大家忽略的對齊方式【區域對齊】，當需要對齊的元素形狀各異，而且不對稱時，如果採用居左、居右或者居中對齊的方式，會導致視覺重心參差不齊。
這種情況下，就有必要採用【區域對齊】——即中軸線對齊，將要對齊的元素順著中軸線擺放，讓中軸線兩邊的視覺重心或者面積相等，這樣雖然邊線沒有對齊，但整體感覺卻是對齊的。
區域/中軸線對齊
對比
對比的基本思想是：要避免頁面上的元素太過相似。如果元素（字體、顏色、大小、線寬、形狀、空間等）需要有所不同，那就讓它們截然不同，這與Android的系統提倡的鮮明異曲同工。
重複
讓設計中的視覺要素在整個作品中重複出現。可以重複顏色、形狀、材質、空間關係、線寬、字體、大小和圖片等，這樣可以增強模塊與模塊之間的相似性，延續用戶的瀏覽習慣和認知習慣，降低用戶的學習成本。同時提高信息的獲取效率，也讓頁面整體佈局更加統一有節奏。
適時隱藏
考慮到界面佈局的簡潔性和用戶認知的侷限性，漸進式設計越來越盛行。
這其實就是【適時隱藏】原則的應用，把用戶需要的信息和功能在用戶需要的時機適時地展示出來，其他時候則隱藏起來，減少用戶視覺及認知負擔。
這樣做的原因主要是因為【4±1原則】，用戶一次性能記住的事物上限只有4±1，如果我們提供的信息超過這個上限，用戶就只能記住其中的一部分，就可能無法順利的完成下一步的操作任務，造成用戶需要反覆操作以確認自己的信息。
同時，根據【希克定律】，我們提供的信息越多，用戶的選擇障礙也就越大，決策時間也越長，反而會促使更多的用戶放棄決策，中斷任務。
巧妙轉移
巧妙轉移，一般是指任務支持多平臺協作時，將某些複雜的功能轉移至其他平臺進行處理，讓各平臺互相聯動，共同發力。這對於多平臺聯動的工具來說非常適用。
此外，巧妙轉移，還可以用在用戶任務和項目任務的轉移。很多時候，我們其實是可以通過項目的開發或項目人員的後臺處理，來幫助用戶更好的解決當前問題，通過將成本轉移至項目組，從而降低用戶的使用成本。
不管你採用何種佈局形式，採用什麼設計法則，最終完成整體佈局和細節設計之後，請一定利用【美即適用】原則進行檢驗，看看整體頁面的設計是否有某種節奏感和韻律感。一個糟糕的第一印象往往會拒用戶於千里之外，還來不及品味你的內容和細節，就直接退出了你的產品，所以這一步必不可少。
佈局設計說到這裡就告一段落了，下面我們來看一下，另一大類互動設計。
互動設計
為了方便大傢俱體的設計運用和設計檢驗，我將所有的互動設計原則都歸納到互動旅程——操作前有預期，操作時有反饋，和操作後可撤銷裡。大家可以根據互動的階段，有效的利用以下這些設計法則進行思考和檢驗。
操作前有預期
為了讓用戶在操作前有預期，我們可以採用的設計原則有【隱喻】【一致性】【功能可見性】【易取選擇】【識別勝過記憶】【易掃原則】。
在設計創造一個新的功能/概念時，我們可以先考慮【隱喻】/【擬物】的設計手法，借鑑現實生活中的一些元素及模型，來增加用戶對新生事物的熟悉感和操作預期，這是一種非常有效的設計方式。各大平臺、軟件最初和現在都在積極的運用這種手法，並取得了顯著的成效。
比如：Window的桌面圖標設計、IOS系統的擬物化設計、Android系統的material design、QQ的漂流瓶，Whchat的搖一搖，網易的留聲機播放界面等等。
隱喻/擬物其實也是著名的MAYA(Most advanced yet acceptable)原則的應用，在設計中兼顧熟悉性和新奇性，把用戶原本熟悉的事物在一個新的環境/平臺中進行設計呈現，這樣熟悉而又新鮮的組合——也就是我們常說的創意（舊元素的新組合），往往會帶來意想不到的傳播效果。
對於一個非新生的事物和概念，我們在設計之前，一定要先了解一下行業內都是如何進行設計表達的。如果在整個行業內，大家的設計已經形成了某種合理的共通性，那我們在設計時，應遵守【一致性】原則，儘可能借鑑它們的處理方式。
設計講求創新，但並不需要在所有的地方都創新，更切記不要重複發明輪子，對於用戶已有概念的心理模型，我們最好的方式是順應而非改變它。就像著名的交互設計大師諾曼所說，除非有更好的設計方式，否則就請準守標準。
要做到操作前有預期，一個很重要的起點就在於【功能可見性】，如果一個功能對於用戶來說不可見，那麼這個功能很有可能等同於不存在。
要做到功能可見性有兩種表現方式：
一是直接可見，即在用戶需要用到此功能的場景/頁面，直觀的呈現該功能入口（這個功能入口最好還要遵守標準化和一致性原則，放在用戶習慣的位置上，這樣能提升用戶檢索的效率和成功率）。
如果一個功能不能做到在頁面上直觀可見，那麼也需要考慮標準化和一致性原則，讓用戶可以根據自己的經驗，沿著特定的路徑尋找到它，這也是標準化和一致性設計的功勞，雖然在用戶眼前不可見，但在用戶的心理是可見的。
【識別勝過記憶】和功能可見性類似，只是應用的對象有所區別（通常指信息而非功能）對於當前頁面用戶需要的決策信息，應該直接羅列出來，而非讓用戶去其他界面查找。
因為工作記憶的侷限性，和環境的干擾性，用戶可能會快就會丟失掉剛剛獲取的信息，在需要用戶決策的頁面，直接呈現相關的決策信息，可以有效的降低用戶的決策成本和操作負擔，這也是【易取】原則的具體應用之一。
【易取】原則在【功能可見性】的基礎上，還提出了更高的要求——易取。不但可見，還要易取，查找路徑、操作路徑都要儘可能的短，儘可能的減少用戶的認知負擔和操作成本。
【易掃】原則主要是前面佈局設計中提到的，要將界面佈局按照經典和一致的佈局結構進行設計，讓用戶可以根據自己的經驗和習慣，直接在特定位置上找到需要的信息，而不是每打開一個界面，都要重新思考和掃描全屏去獲取信息。
操作時有反饋
當用戶進行操作時，最重要的設計原則是【用戶控制原則】。
為了達到這個目標，我們在設計過程中要時時刻刻以用戶為中心，並採用一系列的細分設計原則，才能真正讓用戶產生控制感。
第一是【採用用戶的語言】，以用戶可以理解的語言進行信息表達，讓用戶可以很有信心的理解並選擇對應的信息進行認知加工和操作。
第二是【專注於用戶任務，而非技術】，並【為常見情況而設計】，儘可能簡化用戶頻繁操作的任務流程，並根據用戶的目標任務進行界面設計，把任務流程按照用戶的心理模型進行組織，而非技術或系統模型的直接外顯。
在信息設計中，還要注意【傳遞信息，而非數據】，把系統運行的內在數據和狀態，轉化成用戶可以看懂的信息，涉及到計算時，直接為用戶呈現計算的結果。涉及到操作時，考慮【費茨定律】，時時刻刻以用戶為中心，不要讓用戶思考，也不要讓用戶勞累，能省則省，能簡則簡。
當用戶與產品發生交互行為時，發生交互行為的元素要實時響應用戶的行為，並將這種響應狀態以直觀的形式表現出來——即反饋的【狀態可見性】。
如果當前元素不便於直接發生變化，需要有其他新元素來體現反饋的狀態，則新元素出現的位置首先要遵從【就近原則】，儘可能在操作元素附近1~2cm範圍內出現，以保證用戶能夠注意到它。
同時，新元素狀態還要遵守【環境貼切原則】，以合適的形式進行展現，以符合用戶的心理預期。當用戶的操作涉及到多個元素時，多個元素要同時出現響應狀態，即符合【共同命運】原則。
在用戶與產品發生交互時，如果用戶可能會犯錯，就一定會有用戶犯錯，所以我們在設計時，要優先考慮是否有更合理的設計，可以避免用戶犯錯——即【防錯原則】。
比如：選擇將來的日期時，控件範圍就只能從將來開始，從而避免用戶選擇過去的日期。同時，如果無法在設計上避免用戶犯錯，我們則可以採取一定的【容錯原則】，儘可能包容用戶的錯誤，並提供正確的反饋及結果，比如輸入銀行卡號時，可以自動忽略卡號中間的空格等。
操作後可撤銷
操作後可撤銷即【撤銷重做原則】，顧名思義，指的是：任何時候，我們都應該給用戶提供反悔的機會，讓用戶可以取消剛才的一個甚至一系列的操作行為。
這樣可以讓用戶更有安全感，可以毫無顧慮的自由探索我們的整個產品。這種安全感既可以增強用戶探索的廣度，也可以提升用戶體驗的深度，對於提升用戶對產品的安全感和滿意度非常有助益。
設計師常用的設計原則就介紹到這裡啦，作為設計師的你，是否還有你常用的其他設計原則呢，歡迎留言一起交流哦~~
本文由@悅悅兔 原創發佈於人人都是產品經理，未經許可，禁止轉載。
題圖來自Unsplash, 基於CC0協議。
"