規(guī)則是死的，人是活的

第一部分基礎(chǔ)的交互設(shè)計(jì)原則，第二部分iOS10人機(jī)界面設(shè)計(jì)指南中的設(shè)計(jì)原則    

（題外話(huà)，推薦深入了解下查理.芒格介紹的100種思維模型，掌握各個(gè)學(xué)科最典型的思維模型，不僅可以運(yùn)用在設(shè)計(jì)中，還可以幫我們更好的決策和更睿智的生活）

1.基礎(chǔ)的交互設(shè)計(jì)原則

1.1尼爾森可用性原則

1.狀態(tài)可見(jiàn)原則 Visibility of system status

用戶(hù)在網(wǎng)頁(yè)上的任何操作，不論是單擊、滾動(dòng)還是按下鍵盤(pán)，頁(yè)面應(yīng)即時(shí)給出反饋。“即時(shí)”是指，頁(yè)面響應(yīng)時(shí)間小于用戶(hù)能忍受的等待時(shí)間。

簡(jiǎn)而言之：用戶(hù)操作了就告訴他你做了什么，大概要等多久

2.環(huán)境貼切原則Match between system and the real world

網(wǎng)頁(yè)的一切表現(xiàn)和表述，應(yīng)該盡可能貼近用戶(hù)所在的環(huán)境（年齡、學(xué)歷、文化、時(shí)代背景），而不要使用第二世界的語(yǔ)言。多使用易懂和約定俗成的表達(dá)。

大家都懂才是真的好。

3.撤銷(xiāo)重做原則User Control and Freedom

為了避免用戶(hù)的誤用和誤擊，網(wǎng)頁(yè)應(yīng)提供撤銷(xiāo)和重做功能。

讓用戶(hù)有反悔的機(jī)會(huì)，畢竟生活中可反悔的機(jī)會(huì)可不多，讓用戶(hù)在互聯(lián)網(wǎng)體驗(yàn)當(dāng)上帝的滿(mǎn)足感。

4.一致性原則Consistency and Standards

同一用語(yǔ)、界面風(fēng)格、布局、功能、操作保持一致。

5.防錯(cuò)原則Error prevention

通過(guò)網(wǎng)頁(yè)的設(shè)計(jì)、重組或特別安排，防止用戶(hù)出錯(cuò)。

6.易取原則Recognition rather than recall

好記性不如爛筆頭。盡可能減少用戶(hù)回憶負(fù)擔(dān)，把需要記憶的內(nèi)容擺上臺(tái)面。

比如用戶(hù)輸入過(guò)的郵箱，輸入第一個(gè)字就應(yīng)該有關(guān)聯(lián)出完整的郵箱，用戶(hù)只需點(diǎn)擊即可輸入完成，從N步—2步簡(jiǎn)化操作。

7.靈活高效原則Flexibility and efficiency of use

中級(jí)用戶(hù)的數(shù)量遠(yuǎn)高于初級(jí)和高級(jí)用戶(hù)數(shù)。為大多數(shù)用戶(hù)設(shè)計(jì)，不要低估，也不可輕視，保持靈活高效。

為大多數(shù)中級(jí)用戶(hù)設(shè)計(jì)的同時(shí)要兼顧其他用戶(hù)，做到靈活高效。

8.易掃原則Aesthetics and minimalist design

互聯(lián)網(wǎng)用戶(hù)瀏覽網(wǎng)頁(yè)的動(dòng)作不是讀，不是看，而是掃。易掃，意味著突出重點(diǎn)，弱化和剔除無(wú)關(guān)信息。

9.容錯(cuò)原則Help users recognize, diagnose and recover from errors

幫助用戶(hù)從錯(cuò)誤中恢復(fù)，將損失降到最低。

如果無(wú)法自動(dòng)挽回，則提供詳盡的說(shuō)明文字和指導(dǎo)方向。

10.人性化幫助原則Help and documentation

幫助性提示最好的方式是：無(wú)需提示>一次性提示>常駐提示>幫助文檔

1.2格式塔原則

總的來(lái)說(shuō)，就是物體間的遠(yuǎn)近或者形態(tài)的不同對(duì)我們的認(rèn)知的影響。

主要是以下幾個(gè)原理：接近性原理；相似性原理；連續(xù)性原理；封閉性原理；對(duì)稱(chēng)性原理；主體/背景原理；共同命運(yùn)原理。

接近性原理

物體之間的相對(duì)距離會(huì)影響我們感知它是否以及如何組織在一起?；ハ嗫拷ㄏ鄬?duì)于其它物體）的物體看起來(lái)屬于一組，而那些距離較遠(yuǎn)的則自動(dòng)劃為組外?？康慕娜菀妆晃覀儦w為一組。

下面3個(gè)圖，無(wú)論形狀的不同或是顏色的不同，我們都會(huì)自然而然把相近的東西歸為一組，可見(jiàn)接近性原理權(quán)重要大于相似性原理。

相似性原理

如果其它因素相同，那么相似的物體看起來(lái)歸屬于一組。長(zhǎng)得像的容易被我們被歸為一組。

下圖可見(jiàn)，形狀相似我們會(huì)歸為一類(lèi)，顏色相近的我們又會(huì)歸為一類(lèi)，并且顏色權(quán)重大于形狀。

連續(xù)性原理

視覺(jué)傾向于感知連續(xù)的形式而不是離散的碎片。一個(gè)連續(xù)的圖案，即使中件少了一段，也會(huì)被我們自己補(bǔ)腦出來(lái)是連續(xù)的。

封閉性原理

視覺(jué)系統(tǒng)自動(dòng)嘗試將敞開(kāi)的圖形關(guān)閉起來(lái)，從而將其感知為完整的物體而不是分散的碎片。下圖我們會(huì)感覺(jué)他就是個(gè)圓形。

對(duì)稱(chēng)性原理

我們傾向于分解復(fù)雜的場(chǎng)景來(lái)降低復(fù)雜度。如此復(fù)雜的海報(bào)，我們自動(dòng)會(huì)把它分為一個(gè)圓形和一個(gè)矩形來(lái)識(shí)別。

主體/背景原理

我們的大腦將視覺(jué)區(qū)域分為主體和背景。主體包括一個(gè)場(chǎng)景中占據(jù)我們主要注意力的所有元素，其余則是背景。當(dāng)物體重疊時(shí)我們習(xí)慣把小的那個(gè)看成是背景之上的主體。

當(dāng)我們聚焦于中心的小圓的時(shí)候，為了不影響我們的注意力，周邊的其他物體會(huì)被模糊成背景。

共同命運(yùn)

與接近性、相似永生原理相關(guān)，都影響我們感知的物體是否成組。指出一起運(yùn)動(dòng)的物體被感知為屬于一組或者是彼此相關(guān)的。Path的動(dòng)效，點(diǎn)擊+彈出的功icon，會(huì)被感知為一組東西。

1.3尼爾森F型視覺(jué)模型

我們?cè)诘谝淮斡^看頁(yè)面時(shí)，視線(xiàn)會(huì)呈 F的形狀關(guān)注頁(yè)面

先從頂部開(kāi)始從左到右水平移動(dòng)

目光再下移開(kāi)始從左到右觀察但是長(zhǎng)度會(huì)相對(duì)短些

以較短的長(zhǎng)度向下掃視，形成一個(gè) F形狀，此時(shí)我們的閱讀速度較慢，更為系統(tǒng)和條理性

設(shè)計(jì)時(shí)，將重要的內(nèi)容放在最左邊，用戶(hù)快速掃視時(shí)能第一眼看到。例如淘寶等電商APP類(lèi)的商品列表，信息都是靠左對(duì)齊。

1.4菲茨定律Fitts’ Law（費(fèi)茨法則）

在文章的最后，回顧一下費(fèi)茨定律給我們的啟示：

做點(diǎn)擊按鈕要大點(diǎn)，更易于點(diǎn)擊。反相過(guò)來(lái)，不常用按鈕做小點(diǎn)，可降低點(diǎn)擊率。

將按鈕放在離開(kāi)始點(diǎn)較近的地方，更容易點(diǎn)擊到。屏幕的四角與四邊是「無(wú)限可選中」位置。

1.5神奇數(shù)字 7±2 法則

人類(lèi)頭腦最好的狀態(tài)能記憶含有7（±2）項(xiàng)信息塊，在記憶了 5-9 項(xiàng)信息后人類(lèi)的頭腦就開(kāi)始出錯(cuò)。與席克定律類(lèi)似，神奇數(shù)字 7±2 法則也經(jīng)常被應(yīng)用在移動(dòng)應(yīng)用交互設(shè)計(jì)上，如應(yīng)用的選項(xiàng)卡不會(huì)超過(guò) 5 個(gè)。

1.6奧卡姆剃刀原理Occam's Razor （簡(jiǎn)單有效原理）

這個(gè)原理被稱(chēng)為“如無(wú)必要，勿增實(shí)體”，即如有兩個(gè)功能相等的設(shè)計(jì)，那么選擇最簡(jiǎn)單的。

1.7二八法則

例如：百分之20的功能決定產(chǎn)品的成敗，重點(diǎn)要抓住那重要的20%

1.8泰思勒定律Tesler's Law（復(fù)雜性守恒定律）

該定律認(rèn)為每一個(gè)過(guò)程都有其固有的復(fù)雜性，存在一個(gè)臨界點(diǎn)，超過(guò)了這個(gè)點(diǎn)過(guò)程就不能再簡(jiǎn)化了，你只能將固有的復(fù)雜性從一個(gè)地方移動(dòng)到另外一個(gè)地方。如對(duì)于郵箱的設(shè)計(jì)，收件人地址是不能再簡(jiǎn)化的，而對(duì)于發(fā)件人卻可以通過(guò)客戶(hù)端的集成來(lái)轉(zhuǎn)移它的復(fù)雜性。

1.9席克定律Hick's Law（希克法則）

定律內(nèi)容：一個(gè)人面臨的選擇（n）越多，所需要作出決定的時(shí)間（T）就越長(zhǎng)。用數(shù)學(xué)公式表達(dá)為反應(yīng)時(shí)間 T=a+b log2（n）。在人機(jī)交互中界面中選項(xiàng)越多，意味著用戶(hù)做出決定的時(shí)間越長(zhǎng)。例如比起 2 個(gè)菜單，每個(gè)菜單有 5項(xiàng)，用戶(hù)會(huì)更快得從有 10 項(xiàng)的 1 個(gè)菜單中做出選擇。

席克定律多應(yīng)用于軟件/網(wǎng)站界面的菜單及子菜單的設(shè)計(jì)中，在移動(dòng)設(shè)備中也比較適用。

2.iOS10人機(jī)界面設(shè)計(jì)指南中的設(shè)計(jì)原則

三大原則

清晰Clarity

清晰易懂，突出重點(diǎn)，表達(dá)可交互性

遵從Deference

輕量化，突出內(nèi)容

深度Depth

層次結(jié)構(gòu)

其他原則

美學(xué)完整性Aesthetic Integrity

不易察覺(jué)且不引人注目的圖形、標(biāo)準(zhǔn)化控件和可預(yù)知的交互行為從而讓用戶(hù)保持專(zhuān)注。

一致性(Consistency)

相同的標(biāo)準(zhǔn)和規(guī)范，應(yīng)用所包含的特征和交互行為是符合用戶(hù)心理預(yù)期的。

直接操作(Direct Manipulation)

能夠提升用戶(hù)的參與度并有助于理解。讓用戶(hù)獲得及時(shí)可視的反饋

反饋(Feedback)

認(rèn)證交互行為,呈現(xiàn)結(jié)果,并通知用戶(hù)，臨時(shí)高亮、進(jìn)度指示器。動(dòng)效和聲音加強(qiáng)對(duì)結(jié)果的提示

隱喻(Metaphors)

使用來(lái)源于現(xiàn)實(shí)生活的用戶(hù)體驗(yàn)，或已培養(yǎng)出來(lái)的習(xí)慣，能讓用戶(hù)快速學(xué)會(huì)使用應(yīng)用

用戶(hù)控制(User control)

用戶(hù)主導(dǎo)，應(yīng)用僅為用戶(hù)行為提供建議，嚴(yán)重后果的發(fā)出警告，不提用戶(hù)做決定。讓用戶(hù)可預(yù)知，可隨時(shí)取消

遵從這些原則更好的幫助我們?cè)O(shè)計(jì)出來(lái)的產(chǎn)品好用易用，更加符合用戶(hù)的心理預(yù)期。當(dāng)然規(guī)則是死的，人是活的，如果我們有更好的解決問(wèn)題的方式，能根本的解決設(shè)計(jì)中的問(wèn)題，那也可以不用遵循設(shè)計(jì)原則。