優秀網站設計師應該知道的20個原則

　　世界級圖形設計大師Paul Rand（保羅.蘭 德）曾經說過：“設計絕不是簡單的排列組 合與簡單地再編輯，它應當充滿著價值和意義，去說明道理，去刪繁就簡，去闡明演繹，去修飾美化，去讚美褒揚，使其有戲劇意味，讓人們信服你所言……”，由此可見，設計絕非輕而易舉之事，優秀的設 計更是難上加難，今日小編偶然發現一篇 介面設計師Joshua Porter部落格當中的一篇 文章——《Principles of User Interface Design》，文章中列舉了20大UI設計原 則，看完之後，覺得挺受啟發，於是試著 將其編譯，希望能夠給廣大設計師——特 別是剛入門的初級設計師，提供較好的學 習機會。全文編譯如下：

1.清晰度是首要工作

　　清晰度是介面設計中，第一步也是最重要 的工作。要想你設計的介面有效並被人喜 歡，首先必須讓使用者能夠識別出它？讓用 戶知道為什麼會使用它？比如當使用者使用 時，能夠預料到發生什麼，併成功的與它 互動。有的介面設計得不是太清晰，雖然 能夠滿足使用者一時的需求，但並非長久之 計，而清晰的介面能夠吸引使用者不斷地重 復使用。

2.介面是為促進互動而存在的

　　介面的存在，促進了使用者和我們的世界之 間的互動。優秀的介面不但能夠讓我們做 事有效率，還能夠激發、喚起和加強我們 與這個世界的聯絡。

3.保護和尊重使用者的注意力

　　我們在閱讀的時候，總是會有許多事物分 散我們的注意力，使得我們很難集中注意 力安靜地閱讀。因此，在進行介面設計的 時候，能夠吸引使用者的注意力是很關鍵 的，所以千萬不要將你應用的周圍設計得 亂七八糟分散人的注意力，謹記螢幕整潔 能夠吸引注意力的重要性。如果你非要顯 示廣告，那麼請在使用者閱讀完畢之後再顯 示。尊重使用者的注意力，不僅讓使用者更快 樂，而且你的廣告效果也會更佳。因此要 想設計好的介面，保護和尊重使用者的注意 力是先決條件。

4.讓介面處在使用者的掌控之中

　　人類往往對能夠掌控自己和周圍的環境感 到很舒心。不考慮使用者感受的軟體往往會 讓這種舒適感消失，迫使使用者不得不進入 計劃外的互動，這會讓使用者很不舒服。保 證介面處在使用者的掌控之中，讓使用者自己 決定系統狀態，稍加引導，我想你會達到 你希望的目標。

5.直接操作的感覺是最好的

　　當我們能夠直接操作物體時，使用者的感覺 是最棒的，但這並不太容易實現，因為在 介面設計時，我們增加的圖示往往並不是 必須的，比如我們過多的使用按鈕、圖 形、選項、附件等等其他繁瑣的東西以便 我們最終操縱UI元素而不是重要的事情。 而最初的目標呢？就是希望簡化而能夠直 接操縱……因此在進行介面設計時，我們 要儘可能多的瞭解一些人類自然手勢。理 想情況下，介面設計要簡潔，讓使用者有一 個直接操作的感覺。

6.每個螢幕需要一個主題

　　我們設計的每一個畫面都應該有單一的主 題，這樣不僅能夠讓使用者使用到它真正的 價值，也使得上手容易，使用起來也更方 便，在必要的時候更容易進行修改。如果 一個螢幕支援兩個或兩個以上的主題，立 馬會讓整個介面看起來混亂不堪。正如文 章應該有一個單一的主題以及強有力的論 點，我們的介面設計也應該如此，這也是 介面存在的理由。

7.勿讓次要動作喧賓奪主

　　每個螢幕包含一個主要動作的同時，可以 有多個次要動作，但儘量不要讓它們喧賓 奪主！文章的存在是為了讓人們去閱讀 它，並不是讓人們在Twitter上面分享它。 所以在設計介面的時候，儘量減弱次要動 作的視覺衝擊力，或者在主要動作完成之 後再顯示出來。

8.自然過渡

　　介面的互動都是環環相扣的，所以設計 時，要深思熟慮地考慮到互動的下一步。 考慮到下一步的互動是怎樣的，並且通過 設計將其實現。這就好比我們的日常談 話，要為深入交談提供話由。當使用者已經 完成該做的步驟，不要讓他們不知所措， 給他們自然而然繼續下去的方法，以達成 目標。

9.外觀追隨功能（類似於形式追隨功能）

　　人總是對符合期望的行為最感舒適。當其 他人、動物、事物或者軟體的行為始終符 合我們的期望時，我們會感到與之關係良 好。這也是與人打交道的設計應該做到 的。在實踐中，這意味著使用者只要看一眼 就可以知道接下來將會有什麼的動作發 生，如果它看上去像個按鈕，那麼它就應 該具備按鈕的功能。設計師不應該在基本 的互動問題上耍小聰明，要在更高層次的 問題上發揮創造力。

10.區分重點

　　如果螢幕元素各自的功能不同，那麼它們的外觀也理應不同。反之，如果功能相同 或相近，那麼它們看起來就應該是一樣 的。為了保持一致性，初級設計師往往對應該加以區分的元素採用相同的視覺處理 效果，其實採用不同的視覺效果才是合適 的。

11.強烈的視覺層次感

　　如果要讓螢幕的視覺元素具有清晰的瀏覽次序，那麼應該通過強烈的視覺層次感來 實現。也就是說，如果使用者每次都按照相 同的順序瀏覽同樣的東西，視覺層次感不 明顯的話，使用者不知道哪裡才是目光應當 停留的重點，最終只會讓使用者感到一團 糟。在不斷變更設計的情況下，很難保持 明確的層次關係，因為所有的元素層次關 系都是相對的：如果所有的元素都突出顯 示，最後就相當於沒有重點可言。如果要 新增一個需要特別突出的元素，為了再次 實現明確的視覺層級，設計師可能需要重 新考慮每一個元素的視覺重量。雖然多數人不會察覺到視覺層次，但這是增強設計 的最簡單的方法。

12.恰當的組織視覺元素，減輕使用者的認知負荷

　　正如註明設計師John Maeda在其著作 《Simplicity》中所言，恰當地組織視覺元 素能夠化繁為簡，幫助他人更加快速簡單 地理解你的表達，比如內容上的包含關 系。用方位和方向上的組織可以自然地表 現元素間的關係。恰如其分地組織內容可 以減輕使用者的認知負荷，他們不必再琢磨 元素間的關係，因為你已經表現出來了。 不要迫使使用者做出分辨，而是設計者用組 織表現出來。不要迫使使用者自己去把問題 搞明白，設計師應當直接在

13.色彩不是決定性的因素

　　物體的色彩會隨光線改變而改變。豔陽高 照與夕陽西沉時，我們看到的景物會有很 大反差。換句話說，色彩很容易被環境改 變，因此，設計的時候不要將色彩視為決 定性因素。色彩可以醒目，作為引導，但 不應該是做區別的唯一元素。在長篇閱讀 或者長時間面對電腦螢幕的情況下，除了 要強調的內容，應採用相對暗淡或柔和的 背景色。當然，視讀者而定，也可採用明 亮的背景色。

14.循序展現

　　每個螢幕只展現必需的內容。如果使用者需 要作出決定，則展現足夠的資訊供其選 擇，他們會到在下一屏找到所需細節。避 免過度闡釋或把所有一次展現，如果可 能，將選擇放在下一屏以有步驟地展示信 息。這會使你的介面互動更加清晰。

15.內嵌“幫助”選項

　　在理想的使用者介面，“幫助”選項是不必要 出現的，因為使用者介面能夠有效地指引用 戶學習。類似“下一步”實際上就是在上下 文情境中內嵌的“幫助”，並且只在使用者需 要的時候出現在適當的位置，其他時候都 是隱藏的。

　　設計者的任務不是在使用者有需要的地方建 立一個幫助系統，把發現使用者需要的義務 推諉給使用者，讓使用者去在幫助系統中尋找 他們問題的答案。而是應該確保使用者知道 如何使用你提供的介面，讓使用者在介面中 得到指導並學習。

16.關鍵時刻：零狀態

　　使用者對一個介面的首次體驗是非常重要 的，而這常常被設計師忽略。為了更好的 幫助使用者快速適應我們的設計，設計應該 處於零狀態，也就是什麼都沒有發生的狀 態。但這個狀態不是一塊空白的畫布，它 應該能夠為使用者提供方向和指導，以此來 幫助使用者快速適應設計。在初始狀態下的 互動過程中會存在一些摩擦，一旦使用者了 解了各種規則，那將會有很高的機會獲得 成功。

17. 針對現有問題去完善介面

　　人們總是尋求各種方案去解決已經存在的 問題，而不是潛在的或者未來的問題。所 以，不要為假設的問題設計介面，我們應 該觀察現有的行為和設計，解決現存的問 題。這確實不是件能夠讓人興奮的事情， 但卻是最有價值的事情，因為一旦你的用 戶介面愈加完善，會有更多的使用者願意使 用你的介面。

18.優秀的設計是無形的

　　優秀的設計有個古怪的屬性，它通常會被 它的使用者所忽略。其中的一個原因是這個 設計非常成功，以至於它的使用者專注於完 成自己的目標而忽略了自己面對的介面， 使用者順利達成自己的目標後，他們會很滿 意地退出介面。但是作為設計師，這可能 會有點不公平，當我們的設計很優秀的時 候，我們不會受到很多阿諛奉承。當然， 優秀的設計師不會去介意這些，因為他們 心裡明白，滿意的使用者往往都是沉默的。

19.多領域學習，借鑑其他學科

　　視覺、平面設計、排版、文案、資訊結構 以及視覺化，所有的這些知識領域都應該 是介面設計應該包含的內容，設計師對這 些知識都應該有所涉獵或者比較專長。不 要看不起這些知識：要從中獲取許多值得 學習的東西，以此來提高你的工作能力。 設計師的眼光要長遠，要能從看似無關的 學科中學習，比如出版、程式設計、裝訂、滑 板、消防甚至空手道。

20.介面的存在必須有所用途

　　在大多數設計領域，介面設計成功的要素 就是有使用者使用它。打個比方，一把漂亮 的椅子，雖然精美但坐著不舒服，那麼用 戶不會選擇使用它，它也就是失敗的設 計。因此，介面設計不僅僅是設計一個使 用環境，還需要是創造一個值得使用的藝 術品。介面設計僅僅能夠滿足其設計者的 虛榮心是不夠的：它必須要有用！