[譯] 如何簡化你的設計

• 原文地址：How to simplify your design
• 原文作者：Taras Bakusevych
• 譯文出自：掘金翻譯計劃
• 本文永久連結：github.com/xitu/gold-m…
• 譯者：shixi-li
• 校對者：ezioyuan, renyuhuiharrison

20+ 易於遵循的圖示

各個公司都一直致力於打造簡單實用的產品。並在輕量且易於使用的框架下，它們開發出更多的特性、新的技術和更高階的功能。通常來說，簡單反而是最困難的事情。

什麼是 “簡單”?

我們可以這樣定義“簡單” — 沒有任何困難就可以理解和完成的事物。我們無法定義簡單，它是一個主觀的概念，一個人認為簡單的事物對於另一個人來說可能並不簡單。通常，我們會在三個階段的過程中快速的形成我們對於簡單和困難的個人觀感：

消除那些阻礙使用者實現目標的困難 — 將幫助你將產品變得簡單。在簡單法則中，John Maeda 提供了十條法則用於平衡業務，技術和設計的複雜程度，這正是少即多的準則。

Maeda — 一名麻省理工學院媒體實驗室的教授，也是世界知名的平面設計師 — 探討了應該怎麼來重新定義“提升”這個概念，讓它不總只是意味著更多。這本書真的挺不錯，我強烈推薦你看看。

複雜又是什麼樣子？
討論簡單的同時我們當然也應該討論一下它的對立面。通常意義上的複雜是一個主觀的感受。通過適當的學習，就算是火箭科學也不是那麼的困難。但是有幾個因素卻會讓最簡單的事情也變得很複雜。它們應該在實際的產品設計中儘可能被避免：

那麼我們應該怎麼將這些理念應用到產品設計？

1. 專注打造產品的核心價值

有太多的軟體試圖為受眾做到太多的事情，它們都希望成為一個行業的瑞士軍刀。但是如果你希望讓你的產品變得簡單，你需要為你的產品定義一個真正核心的價值並且確定該產品的真正目標使用者。並不是每一個產品都需要內建一個 Facebook。

2. 移除所有不必要的東西

實現簡單最容易的方式就是在深思熟慮後做減法。當你心存疑慮，請果斷刪除。比如次要資訊，不常使用的控制元件和分散注意力的樣式。就這樣簡單。一旦你使用這個原則，你將會馬上看到效果。但是在做減法的時候一定得小心。

“簡單不是沒有雜亂，那只是簡單的一個結果。簡單是在某種程度上描述了事物和產品的位置和目的。沒有雜亂只能稱作一個沒有雜亂的產品。但那並不是簡單。” — Jonathan Ive

3. 將資料轉化為有意義的格式

我們每天設計的大多數產品都在關注使用者需要使用的大量資料，以便有效地執行他們的日常工作。但是你的使用者如果是對資料的趨勢和變化更加感興趣，請用視覺化的展示呈現給他們而不僅僅是一堆數字。你可以按需展示所需要的額外資料。請儘量從你有的資料中提取出有意義的部分並將其展示在使用者前面。

4.支援快速決策

面對接踵而來的各種選擇，使用者不得不花時間去理解和判斷，這是他們不喜歡乾的事兒。這件事在著名的希克定律（Hick’s Law）中得到解釋。希克定律（Hick’s Law）認為決策本身所需要耗費的時間和精力隨著選擇的增加而增加。所以如果你希望你的使用者體驗變得更加簡單，那麼你得讓使用者能夠快速選擇，這樣的設計要儘可能的多些。去掉那些並不需要的決策、指引和使用者操作。

5. 太多的選擇會嚇跑客戶

目前的心理學理論和研究認為通過個人選擇會產生積極的情感和後果。這些發現導致了一個流行的觀念，就是選擇越多越好 — 人類的決策能力和對選擇的渴望似乎是無窮無盡的。但是事實上研究證明了正好相反：

果醬實驗（Jam Experiment）是消費心理學中最著名的實驗之一，它表明提供較少的選擇更加有助於銷售。至關重要的是，它表明了精確提供較少的選擇可能會更加有助於你的銷售。

這個實驗表明，與那些有很多選擇的客戶相比，選擇較少的客戶購買的可能性似乎要高10倍。這一直是作為證明讓選擇不要過多的關鍵例子，因為為使用者提供太多的選擇實際上會抑制使用者的購買慾望。

6. 提供多個選擇的建議

如果無法避免選擇，請嘗試限制它們。可以提供一個你個人的建議或者分享其他消費者更喜歡的內容。明確告訴使用者不同選項之間有什麼差別。這個方案通常應用於計算價格的頁面。

7. 吸引使用者的注意力到正確的方向

當你瞭解你的使用者實現目標的過程後，那麼在這個過程的每個階段都有著與那個目標更加相關的事情。找到那些關鍵的領域並將使用者的注意力轉向它們。

8. 使用顏色和佈局來表達內容的層次結構

你聽過多少次這句話 — “使用者是不會浪費時間在閱讀上”。這並不是假話，我們只會閱讀那些我們需要去記憶或者實際瞭解的東西。如果你沒有讀過一個單詞就接受了大量的使用者條約，那你就應該明白我說的什麼意思。有很多特徵可以用來對交流產生影響：字型樣式，大小，字距，前導，大小寫和顏色。可以用它們來傳遞內容的層次和結構。正確的使用顏色和排版可以讓你的產品反映出易於識別的品牌形象，並且更加具有吸引力和讓人難忘。

9. 讓系統有序組織，簡單且更易管理

讓我們來做一個簡單的測試吧。以下我們有兩張圖片。使用秒錶來測量你計算這兩張圖片中的黑點數量所需的時間（和精力）。

完成了嗎？結果正如你自己所看到的那樣，計算無序的點陣會耗費更多的時間，並且還會給你帶來更多認知上的負擔。但如果方塊的點數相同，為什麼我們還會得到這個結果呢？

將點對映到特定矩陣會幫助我們直觀地瀏覽它們並在計數時進行分組。在無序的方塊上我們不得不一個一個地數數。此外，大多數人可能都會錯誤的估計或者被迫用左圖去檢查你的答案。

元素的組織不僅提高了識別率，而且還使其更容易記憶。操作任何機器時，記住所有控制元件的位置和功能都非常重要。讓我們來做另一個小練習。就在一分鐘以前你剛才計算了兩張圖片裡面的點數，現在請回想這兩張圖片裡面所有黑點的位置。對於大多數人來說記住無序的結構幾乎都是不可能的。

10. 對相關內容分組

通常，一個簡化複雜頁面的簡單方法就是開始對元件進行分組。這樣使用者處理的就是少數幾組而不是大量不相關的元件。在元素或者一組元素周圍設定邊框（創造共同區域）是將周圍元素分離的一個簡單方法。在格式塔心理學中有多種原則可以幫助元素構建相關性：接近性，相似性，連續性，閉合性和連通性。

11. 將大型任務拆解為小步驟，並且嘗試單列布局

幾乎在任何產品中都存在不同形式的表格。這是你獲取使用者資訊的方式。甚至有的時候已經移除掉所有不必要的東西之後，但表格內容依然非常龐大。使用者可能非常不想完成這些表格。所以我們能做的就是把這個巨大的任務分解成一系列較小的任務。這會讓人突然覺得好像會輕鬆很多的去完成這個任務。完成小的子任務會為使用者提供一些內啡肽和滿足感來繼續下去。

設計表單時，請使用一列布局而不是多列。單列布局更容易填寫。這樣，使用者無需考慮接下來要填寫的內容，只需徑直向下移動頁面即可。

12. 對流程進展和系統狀態保持透明

不確定性會使我們感到焦慮，所以應當儘可能避免這種情況。這也就是為什麼除非是顯而易見的情況，在任何時候使用者都應該能夠了解到他目前在流程的什麼位置，過去已經發生了什麼以及他還需要去做什麼。儲存先前提供的資訊摘要也是一個好辦法，它讓使用者不用記憶太多東西並且也無需返回以仔細檢查先前的步驟。

13. 幫助使用者做算術

人類的大腦不擅長進行原始計算。與算術運算相比，進化的壓力更有利於優化大腦識別物體的能力。所以應當嘗試利用系統來代替使用者進行所有計算。

14. 通過漸進式的展現來隱藏複雜

漸進式的披露是使用者體驗設計中的一個設計模式，用來更好的將使用者介面對使用者進行解釋。它通過跨多個螢幕對資訊和操作進行排序以免使使用者不知所措或隱藏無關資訊，直至資訊變得相關。漸進式披露遵循從“抽象到具體”的典型概念，包括使用者行為或人機互動的順序。漸進式披露的一個很好的例子是iOS巢狀導航。

15. 基於普遍接受的模式和互動方式

使用者的大部分時間其實是花費在其他產品上。這就意味著使用者更希望你的網站互動方式能夠跟其他他們用過的網站差不多，所以這也就讓他們對產品的外觀和行為有著特定的期望。這種說法反應了消費者的心態，並且適用於從社交網路到冰箱的任何虛擬或現實產品。但這並不意味著你應該停止創新，但應該更謹慎的評估怎麼去更改傳統意義上的導航或者控制，向使用者證明改變他們的心理模型是正確的。

16. 讓初次體驗變得簡單

任何設計的主要目標都應該是儘快將使用者與提供的價值產品聯絡起來。好好考慮下這一點吧。因此，使用者和作業系統之間存在的其他東西除非是功能需要，否則都是障礙。在任何過程的首次體驗都是非常重要的，如果不滿意的話，人們會很快地對產品形成看法並立刻離開。

在你初次嘗試的時候，即使是簡單的任務也很具有挑戰性。在我們操作產品之前，有時需要額外的培訓。在數字產品的設計中我建議不要太關注手動操作，使用者期望產品應該是簡單易懂的，並且只有在出現問題或者他們需要時才提供幫助。而且應該是基於上下文的情形提供幫助，而不是通過過多的學習資料給使用者傳授空洞的概念。

17. 考慮人體工程學和使用產品的環境

我們已經定義的簡單就是使用產品的難易程度，這也就是基於人體工程學。人體工程學是設計或安排工作場所，產品和系統的過程，以便適合人們的操作。大多數人認為這與座椅或汽車控制裝置和儀器的設計有關 — 但是不僅僅如此。人體工程學適用於涉及人的任何設計，包括數字產品。 在 1954 年，心理學家保羅菲茨測試人體運動系統，表明移動到目標所需的時間取決於與目標的距離，並與其大小成反比。所以請保證較大的常用元素放在儘可能靠近使用者的位置。

18. 支援行內編輯和自動提示

移除每一個過程中不必要的互動、檢視和步驟。使用者應該以最佳速度作業系統，這被稱為“流暢”。不要用彈出視窗打破這種流程。對於以後所有支援更改的操作或值，請儘可能的支援行內編輯。當有大量可用的值時可以進行自動提示。

19. 通過智慧設定預設值來減少認知上的負擔

智慧設定就是將選項的答案預設進行選擇。這能幫助使用者儘快的完成表單。填寫表單需要使用者去解析表單，編輯答案，然後將他們的結果輸入到表格提供的位置上。而定義相關預設值時，設計人員需要了解使用者以及他們將使用產品的上下文。只有通過深入研究和測試，才有可能理解使用者並根據使用者的歷史資料和使用模式調整預設值。當需要明確選擇時，始終將絕大多數使用者（例如，90 - 95％）會選擇的選項設定為預設值。

20. 減少錯誤提示

錯誤資訊會帶來很多壓力，並讓使用者覺得他搞砸了或者沒有完成任務。所以請確保自動檢查輸入的資料，併為異常的輸入提供警報或提醒以減少錯誤。要麼消除容易出錯的情況，要麼檢查它們並在使用者提交操作之前向使用者再次進行確認。並且應該通過強制功能來保護破壞性和不可恢復的行為，以確保使用者意識到他們的選擇將產生的影響。

21. 可訪問性設計

作為設計師，您的目標是支援可訪問性，確保你的產品能被廣泛的受眾使用，而沒有特例。全世界有超過 10 億人患有殘疾。所以不要使用顏色作為傳達資訊的唯一視覺手段。還可以確保文字與其背景之間有足夠的對比度，支援鍵盤導航等等。可訪問性不僅僅針對於具有不同能力的一組使用者，當你設計可訪問性時，您應該改善使用該產品的每個人的體驗。

總結

設計簡單好用並且易於理解的產品並不容易，但這是我們需要做的事，並且有這些竅門能幫我們走向簡單。

如果發現譯文存在錯誤或其他需要改進的地方，歡迎到 掘金翻譯計劃 對譯文進行修改並 PR，也可獲得相應獎勵積分。文章開頭的 本文永久連結 即為本文在 GitHub 上的 MarkDown 連結。

---

掘金翻譯計劃 是一個翻譯優質網際網路技術文章的社群，文章來源為 掘金 上的英文分享文章。內容覆蓋 Android、iOS、前端、後端、區塊鏈、產品、設計、人工智慧等領域，想要檢視更多優質譯文請持續關注 掘金翻譯計劃、官方微博、知乎專欄。