編輯導語：怎么樣讓設(shè)計出來的產(chǎn)品更加美觀，更加符合大眾審美呢？設(shè)計師有一些理論上的知識可以引用，本文作者分享了關(guān)于交互設(shè)計的七大定律法則，我們一起來了解一下。

有時在一些設(shè)計師討論分享會，或者和一些非設(shè)計師同事朋友交流，會碰到下述一些疑問……

阿里巴巴 UCAN2019 大會主題《設(shè)計，讓商業(yè)美而簡單》。我個人很喜歡這個口號，這是我們 UX 設(shè)計師朋友們每天都在做的事情，也是我們價值的體現(xiàn)。那怎么樣讓我們的設(shè)計，能讓商業(yè)美而簡單，有沒有什么方法、理論、技巧、原則的東西指導我們進行設(shè)計呢？

下面七條定律和原則也許可以幫助你更好地做好產(chǎn)品設(shè)計：

米勒定律

米勒定律是美國心理學家喬治·米勒(George A.Miller)對短時記憶能力進行了定量研究后提出：人的短時記憶能力廣度為 7±2 個信息項，超過該范圍就容易出錯。提及到人的大腦短時記憶容量約為"7"，并在 7+2 與 7-2 之間浮動，因此這個神奇的記憶容量規(guī)律也稱為"7±2 法則"。

我們做個試驗：讀一遍下圖中的隨機字母，然后移開眼睛回憶一下，看你能回想起幾個：

再試試這個，同樣重頭到尾讀一遍，然后移開眼睛回憶：

你能記幾個？結(jié)果會發(fā)現(xiàn)：通常會記憶起 5~9 個，即 7±2 個，這個有趣的現(xiàn)象就是 7±2 效應。

但是，后來在《設(shè)計師要懂心理學》一書中又被提到，這一理論實際上缺乏足夠的科學依據(jù)，不少學者通過大量研究，發(fā)現(xiàn)那個神奇的數(shù)字其實是"4"。如果人能夠注意力集中，其處理信息的過程也不受干擾，那么其工作記憶中能保存 4 項左右事務；所以建議在給用戶展示信息時，盡可能限制在 4 以內(nèi)，合理利用分類與歸納減少信息數(shù)量。

米勒定律及其所引發(fā)后人的研究結(jié)論，其實這一思考常常被運用到產(chǎn)品設(shè)計當中，如：

示例一：現(xiàn)在很多手機號、銀行卡號、身份證號等這種長字符內(nèi)容，會進行分段顯示，對比之下你會發(fā)現(xiàn)閱讀起來會大大提升易讀性。

示例二：以前我們要輸 6 位數(shù)字驗證碼要切換出去看短信，憑記憶輸入，通常要切兩三次才能全部填完，后來在技術(shù)支持下，直接提取短信中的驗證碼在鍵盤上顯示點擊即可，大大減少用戶的輸錯幾率及記憶成本。

席克定律

席克定律是一種心理物理學定律。它主要體現(xiàn)出兩個參數(shù)：數(shù)量和時間；當所面臨的選擇數(shù)量越多，所作出選擇決策的時長花費就會長。

這定律更簡單一點歸納就是：盡可能減少選項的數(shù)量，Don't make me think！

決策效率是一個產(chǎn)品導致用戶流失的重要原因之一，用戶遲遲不能做出選擇，付出的成本越大自然選擇放棄的幾率就越大，所以我們要將做決定的選項在滿足產(chǎn)品業(yè)務訴求的情況下，盡可能精簡，以減少所需反應的時間。如何提高用戶的選擇和獲取效率？這就考驗對產(chǎn)品設(shè)計的權(quán)衡，哪些內(nèi)容必須要保留？哪些內(nèi)容可以精簡？哪些內(nèi)容可以前置后移？

示例一：大家都還記得早前的電視遙控器吧，功能齊全應有盡有，可以回想下我們平時使用最頻繁的是哪些？再看現(xiàn)在比如小米蘋果等電視機的遙控器，把開關(guān)、音量、頻道、菜單等最最頻繁的幾個按鍵外放，其他更多的操作藏在菜單中，沒有過多干擾，大大減少用戶做選擇的時間。

示例二：蘋果的產(chǎn)品也都是義無反顧地遵循著席克定律，不遺余力地縮減給予用戶的選擇，無論是在軟件產(chǎn)品和智能硬件產(chǎn)品上都是足夠精簡；如下圖 App store 有之前精品推薦還是展示很多 App，后來改版直接通過這種大卡片樣式把"精品"的 app 足夠放大讓你快速獲取。

示例三：Mac 版 QQ 客戶端的登錄框，輸完賬號密碼直接登錄很順暢的完成登錄操作，把更多那些注冊、忘記密碼等事項做收起處理，使得整個界面給人比較簡潔清爽的感覺。

費茨定律

費茨定律主要體現(xiàn)出三個參數(shù)：時間、距離和大?。蝗我庖稽c移動到目標位置所需要的時間，與目標距離正相關(guān)，距離越長所需時間越長，與目標大小負相關(guān)，體積越大越寬所需時間越短。這定律核心要點更簡單一點歸納就是：放大目標對象，減少目標距離。

示例一：你會看到現(xiàn)在很多產(chǎn)品廠商，他們的產(chǎn)品宣傳廣告圖，都是把產(chǎn)品圖放大，然后才是宣傳標題和內(nèi)容。目標就是通過大圖片，強烈的視覺沖擊，先吸引到你的眼球，讓你第一眼有印象，然后再展開看具體的細項內(nèi)容。

示例二：很多產(chǎn)品也會把比較密切的關(guān)聯(lián)信息，距離放得比較近，方便用戶做即將進行的關(guān)聯(lián)操作，如微信：長按復制某項內(nèi)容，復制后關(guān)聯(lián)操作內(nèi)容會跟復制項距離挨得比較近，將操作距離縮到最短；假設(shè)把關(guān)聯(lián)彈窗操作信息放在統(tǒng)一居中位置，操作以及視角距離會拉長，相應地操作時間會拉長。

示例三：QQ 手機端登錄頁面也是同樣原理，次要的注冊和忘記密碼內(nèi)容縮小放在次要位置，輸入框內(nèi)容放大，輸入賬號和密碼后，緊接著點擊登錄按鈕，展示順序和操作也都相對比較流暢；假設(shè)把按鈕放在下方，暫不考慮鍵盤交互的情況下，輸入完賬號密碼后，登錄按鈕距離相對較遠，關(guān)聯(lián)操作不夠連貫。

泰勒斯定律

泰斯勒定律又稱復雜性守恒定律，指的是任何系統(tǒng)都存在其固有的復雜性，且無法被減少，我們要考慮的是，怎么樣更好地處理它，讓用戶簡單、高效地使用它。這一定律也時常在平時工作中，面對較為復雜的業(yè)務、流程、頁面的時候，要去思考如何在不影響業(yè)務和功能的情況下，保證用戶的使用體驗；也不能為了所謂的頁面簡潔而刪掉一些業(yè)務認為重要的東西，最終導致功能滿足不了業(yè)務訴求。

設(shè)計本身就是一個反復溝通的一個過程，哪些內(nèi)容可以精簡？哪些可以怎么處理？哪些強調(diào)弱化？這些都需要和業(yè)務產(chǎn)品方做反復溝通，達成意見一致，找到業(yè)務和體驗之間的權(quán)衡點。在面對不可避免的系統(tǒng)復雜性，我們要做的是花費更多的精力，實現(xiàn)用戶界面上的簡化，不把系統(tǒng)的復雜性交給用戶。

示例一：比如抖音、UC 瀏覽器、淘寶等平臺，會通過用戶平時瀏覽的時長、點贊、收藏等行為，來進行數(shù)據(jù)分析智能推送用戶關(guān)心的內(nèi)容，從而使用戶對平臺產(chǎn)生更高的使用黏著度；通過一種技術(shù)的處理，減少用戶界面上的操作，幫助用戶更快達到其目標；

示例二：蘋果的 Keynote 和微軟的 PowerPoint 對保存定義差異，Keynote 是系統(tǒng)自動保存，用戶做到哪里隨時關(guān)閉，會自動幫你進行保存。PowerPoint 是手動保存，用戶做任何操作需要保存才能存檔，否則中途死機或者軟件出問題導致軟件自動關(guān)閉，而你做的東西可能會功虧一簣。

示例三：在做一個比較復雜的申請時，在內(nèi)容上和業(yè)務方溝通后已沒辦法再減，如果全部內(nèi)容在界面上放在一頁去展示，會給用戶直觀上感覺內(nèi)容很多，當我們可以把內(nèi)容分拆一下，而且告知用戶整個流程完成下來大概需要幾步需要填什么內(nèi)容，提前告知用戶，然給用戶心里有預期。

奧卡姆剃刀定律

奧卡姆剃刀定律也是關(guān)于本體論簡化的原則，它提出：如無必要，勿增實體。即任何存在的東西，應該有對應的事實依據(jù)，否則我們不應該去考慮它。

今天我們用到「奧卡姆剃刀」這個詞語時，其實是在原理論上延伸開，泛指意指刪繁就簡，剔除問題中無用的雜項，傾向于簡單的解決辦法。為什么要將復雜變簡單呢？因為復雜容易使人迷失，只有簡單化后才利于人們理解和操作；簡單的頁面讓用戶一眼就能找到他們感興趣的內(nèi)容，使用戶瀏覽更舒適，更能專心于你要表達的內(nèi)容上，而復雜的頁面會讓用戶找不到信息的重點，容易分散用戶的視覺注意力。

示例一：對比微信手機話費充值頁面，和左側(cè)其他平臺的充值頁，你會發(fā)現(xiàn)用戶在話費充值這件事上，通過微信充值會非常明確而且快速完成任務，而左側(cè)平臺頁面整體頁面元素比較多，就會干擾用戶完成主要的任務操作，當然這也取決于產(chǎn)品本身的定位和策略不一樣，展示的內(nèi)容也會不一樣。

示例二：iPhone 蘋果手機當時把直接把僅有的一個實體 home 鍵拿掉，通過上滑操作來代替回到首頁的操作，這也讓后來其他的手機廠商都追隨這樣的設(shè)計一致做了調(diào)整。

示例三：MUJI 的設(shè)計，也很好地體現(xiàn)了這個定律原則，通過"精選材質(zhì)"、" 修改工序"、" 簡化包裝"重新審視了商品，制造出簡潔而舒心的商品。

接近原則

接近原則是一個心理學名詞，指對于彼此接近的事物，人們總會下意識地將他們建立某種關(guān)聯(lián)性，并視為一個整體去看待。這個原則更簡單一點歸納就是：把接近相似的信息元素組織起來。

接近原則是非常常用和極其有效的一種設(shè)計技巧，根據(jù)人的認知習慣和心理模型來構(gòu)建頁面，能很好地幫助用戶節(jié)省瀏覽和理解內(nèi)容的成本。

界面設(shè)計中的接近原則是對相似的信息及功能類別進行分組、布局；它在界面中的作用能夠直接影響到用戶與產(chǎn)品的視覺交流，借此引導用戶的瀏覽及操作行為。目的都是在視覺上通過組與組的區(qū)分來劃分功能與功能之間的關(guān)聯(lián)性，讓界面變得更清晰，并且?guī)椭脩粼跒g覽頁面時，能夠清楚地感知到各個信息組之間的關(guān)系，也就是信息的歸類。

示例一：現(xiàn)在很多表單的設(shè)計，比如系統(tǒng)設(shè)置、個人中心等此類多表單的頁面，通常都會將相關(guān)聯(lián)信息歸類組合處理，能讓信息的歸類更加清晰，從視覺角度看頁面更有層次感，讓信息之間有一定的間歇，減少閱讀的疲勞感。

示例二：我們進行一些業(yè)務的申請，也常常碰到填單頁面，如下圖，信息就是這么多你全部羅列出來，從視覺感觀上看，會給用戶感覺要填很多內(nèi)容；把相關(guān)聯(lián)信息歸類成手機號/國別/職業(yè)/學歷這些個人自身的基礎(chǔ)信息，郵箱/單位名稱/單位地址這些歸成另一類，在信息歸類上就可以和上面區(qū)分開，讓頁面更有層次感。

防錯原則

防錯原則最早出現(xiàn)在 19 世紀 60 年代的汽車制造領(lǐng)域，是由豐田汽車的專家工程師新鄉(xiāng)重夫創(chuàng)造的理念。

防錯原則其實是站在用戶的角度，盡可能地提供相應措施，減少錯誤概率，令用戶更安心更有效率地完成任務。要注意換位思考，從用戶角度出發(fā)，站在用戶使用場景，預測用戶有可能發(fā)生錯誤操作。比起一個優(yōu)秀的錯誤提示，更好的設(shè)計是在這個錯誤出現(xiàn)前就提前告知用戶，最大程度的減少錯誤的發(fā)生。

3 個維度幫助我們更好地做好防錯機制：

1. 操作前，怎么把提示做得更清晰，讓用戶在準備操作時就能清晰知道在哪操作要做什么；
2. 操作中，實時告知當前位置，讓用戶知道自己進行到哪了；
3. 操作后，能及時給予反饋，一旦錯誤可及時調(diào)整；

示例一：下圖登錄窗口，很好地詮釋目前很多操作表單的使用樣式。

1. 操作前，輸入框提示語能讓用戶知道是哪里操作，密碼框內(nèi)提示輸入的密碼規(guī)則也寫出來，提高操作效率；
2. 操作中，輸入框高亮明確讓用戶知道當前所在位置，并且讓用戶更聚焦在當前內(nèi)容；
3. 操作后，如內(nèi)容有誤，給出明確提示，讓用戶能及時調(diào)整；

示例二：微信手機充值設(shè)計，輸入一個通訊錄存有，但輸入疑似錯誤的手機號碼時，頁面會提醒用戶是否輸錯，且給出用戶可能想要的結(jié)果，通過系統(tǒng)辨識，幫助用戶做內(nèi)容校正，防止用戶操作錯誤。

最后

譽為交互設(shè)計之父的阿蘭·庫珀(Alan cooper)說過一句話：除非有更好的選擇，否則就遵從標準。這些被認定的設(shè)計定律原則，其實是最基礎(chǔ)的理論知識，當我們了解它后，這會成為個人的知識技能儲備，在平時設(shè)計工作中會給我們很好的參考和啟發(fā)，幫助我們更有效地完成自己的設(shè)計。

這些所謂的定律原則，當你全部理解之后，你會發(fā)現(xiàn)他們之間有些是相似甚至是重合的，如席克定律、米勒定律和奧卡姆剃刀定律，其實都是在強調(diào)信息要精簡。

所以我們要怎么做？

不要去迷戀任何法則，不要糾結(jié)去背念這些定律法則的名字，不要覺得有了這些法則，把這些定律原則照本宣科地對照進自己的產(chǎn)品就能提升一個檔次，設(shè)計水平就能得以很好地提升，這是不可能的。我們要去學習它理解它使用它，其中最重要的是真正地"理解"它，然后結(jié)合自身的產(chǎn)品情況及使用場景，更好地運用它。除了交互設(shè)計七大定律原則外，其實還有很多前輩總結(jié)的一些原則，如尼爾森十原則、設(shè)計心理學、格式塔理論等這些前輩們通過多年的經(jīng)驗總結(jié)出來的理論知識，都會對我們做產(chǎn)品做設(shè)計有一定思考和啟發(fā)，提示我們平時多看多理解，在我們產(chǎn)品上就會得以更好的體現(xiàn)，從而把產(chǎn)品做得更好。

作者：如成