規(guī)則是死的，人是活的第一部分基礎(chǔ)的交互設(shè)計原則，第二部分iOS10人機界面設(shè)計指南中的設(shè)計原則 （題外話，推薦深入了解下查理.芒格介紹的100種思維模型，掌握各個學(xué)科最典型的思維模型，不僅可以運用在設(shè)計中，還可以幫我們更好的決策和更睿智的生活） 1.基礎(chǔ)的交互設(shè)計原則 1.1尼爾森可用性原則 1.狀態(tài)可見原則 Visibility of system status 用戶在網(wǎng)頁上的任何操作，不論是單擊、滾動還是按下鍵盤，頁面應(yīng)即時給出反饋?！凹磿r”是指，頁面響應(yīng)時間小于用戶能忍受的等待時間。 簡而言之：用戶操作了就告訴他你做了什么，大概要等多久 2.環(huán)境貼切原則Match between system and the real world 網(wǎng)頁的一切表現(xiàn)和表述，應(yīng)該盡可能貼近用戶所在的環(huán)境（年齡、學(xué)歷、文化、時代背景），而不要使用第二世界的語言。多使用易懂和約定俗成的表達(dá)。 大家都懂才是真的好。 3.撤銷重做原則User Control and Freedom 為了避免用戶的誤用和誤擊，網(wǎng)頁應(yīng)提供撤銷和重做功能。 讓用戶有反悔的機會，畢竟生活中可反悔的機會可不多，讓用戶在互聯(lián)網(wǎng)體驗當(dāng)上帝的滿足感。 4.一致性原則Consistency and Standards 同一用語、界面風(fēng)格、布局、功能、操作保持一致。 5.防錯原則Error prevention 通過網(wǎng)頁的設(shè)計、重組或特別安排，防止用戶出錯。 6.易取原則Recognition rather than recall 好記性不如爛筆頭。盡可能減少用戶回憶負(fù)擔(dān)，把需要記憶的內(nèi)容擺上臺面。 比如用戶輸入過的郵箱，輸入第一個字就應(yīng)該有關(guān)聯(lián)出完整的郵箱，用戶只需點擊即可輸入完成，從N步—2步簡化操作。 7.靈活高效原則Flexibility and efficiency of use 中級用戶的數(shù)量遠(yuǎn)高于初級和高級用戶數(shù)。為大多數(shù)用戶設(shè)計，不要低估，也不可輕視，保持靈活高效。 為大多數(shù)中級用戶設(shè)計的同時要兼顧其他用戶，做到靈活高效。 8.易掃原則Aesthetics and minimalist design 互聯(lián)網(wǎng)用戶瀏覽網(wǎng)頁的動作不是讀，不是看，而是掃。易掃，意味著突出重點，弱化和剔除無關(guān)信息。 9.容錯原則Help users recognize, diagnose and recover from errors 幫助用戶從錯誤中恢復(fù)，將損失降到最低。 如果無法自動挽回，則提供詳盡的說明文字和指導(dǎo)方向。 10.人性化幫助原則Help and documentation 幫助性提示最好的方式是：無需提示>一次性提示>常駐提示>幫助文檔 1.2格式塔原則 總的來說，就是物體間的遠(yuǎn)近或者形態(tài)的不同對我們的認(rèn)知的影響。 主要是以下幾個原理：接近性原理；相似性原理；連續(xù)性原理；封閉性原理；對稱性原理；主體/背景原理；共同命運原理。 接近性原理 物體之間的相對距離會影響我們感知它是否以及如何組織在一起?；ハ嗫拷ㄏ鄬τ谄渌矬w）的物體看起來屬于一組，而那些距離較遠(yuǎn)的則自動劃為組外?？康慕娜菀妆晃覀儦w為一組。 下面3個圖，無論形狀的不同或是顏色的不同，我們都會自然而然把相近的東西歸為一組，可見接近性原理權(quán)重要大于相似性原理。
相似性原理 如果其它因素相同，那么相似的物體看起來歸屬于一組。長得像的容易被我們被歸為一組。 下圖可見，形狀相似我們會歸為一類，顏色相近的我們又會歸為一類，并且顏色權(quán)重大于形狀。
連續(xù)性原理 視覺傾向于感知連續(xù)的形式而不是離散的碎片。一個連續(xù)的圖案，即使中件少了一段，也會被我們自己補腦出來是連續(xù)的。
封閉性原理 視覺系統(tǒng)自動嘗試將敞開的圖形關(guān)閉起來，從而將其感知為完整的物體而不是分散的碎片。下圖我們會感覺他就是個圓形。
對稱性原理 我們傾向于分解復(fù)雜的場景來降低復(fù)雜度。如此復(fù)雜的海報，我們自動會把它分為一個圓形和一個矩形來識別。
主體/背景原理 我們的大腦將視覺區(qū)域分為主體和背景。主體包括一個場景中占據(jù)我們主要注意力的所有元素，其余則是背景。當(dāng)物體重疊時我們習(xí)慣把小的那個看成是背景之上的主體。 當(dāng)我們聚焦于中心的小圓的時候，為了不影響我們的注意力，周邊的其他物體會被模糊成背景。
共同命運 與接近性、相似永生原理相關(guān)，都影響我們感知的物體是否成組。指出一起運動的物體被感知為屬于一組或者是彼此相關(guān)的。Path的動效，點擊+彈出的功icon，會被感知為一組東西。
1.3尼爾森F型視覺模型
我們在第一次觀看頁面時，視線會呈 F的形狀關(guān)注頁面 先從頂部開始從左到右水平移動 目光再下移開始從左到右觀察但是長度會相對短些 以較短的長度向下掃視，形成一個 F形狀，此時我們的閱讀速度較慢，更為系統(tǒng)和條理性 設(shè)計時，將重要的內(nèi)容放在最左邊，用戶快速掃視時能第一眼看到。例如淘寶等電商APP類的商品列表，信息都是靠左對齊。
1.4菲茨定律Fitts’ Law（費茨法則）
在文章的最后，回顧一下費茨定律給我們的啟示： 做點擊按鈕要大點，更易于點擊。反相過來，不常用按鈕做小點，可降低點擊率。 將按鈕放在離開始點較近的地方，更容易點擊到。屏幕的四角與四邊是「無限可選中」位置。 1.5神奇數(shù)字 7±2 法則 人類頭腦最好的狀態(tài)能記憶含有7（±2）項信息塊，在記憶了 5-9 項信息后人類的頭腦就開始出錯。與席克定律類似，神奇數(shù)字 7±2 法則也經(jīng)常被應(yīng)用在移動應(yīng)用交互設(shè)計上，如應(yīng)用的選項卡不會超過 5 個。 1.6奧卡姆剃刀原理Occam's Razor （簡單有效原理） 這個原理被稱為“如無必要，勿增實體”，即如有兩個功能相等的設(shè)計，那么選擇最簡單的。 1.7二八法則 例如：百分之20的功能決定產(chǎn)品的成敗，重點要抓住那重要的20% 1.8泰思勒定律Tesler's Law（復(fù)雜性守恒定律） 該定律認(rèn)為每一個過程都有其固有的復(fù)雜性，存在一個臨界點，超過了這個點過程就不能再簡化了，你只能將固有的復(fù)雜性從一個地方移動到另外一個地方。如對于郵箱的設(shè)計，收件人地址是不能再簡化的，而對于發(fā)件人卻可以通過客戶端的集成來轉(zhuǎn)移它的復(fù)雜性。 1.9席克定律Hick's Law（希克法則） 定律內(nèi)容：一個人面臨的選擇（n）越多，所需要作出決定的時間（T）就越長。用數(shù)學(xué)公式表達(dá)為反應(yīng)時間 T=a+b log2（n）。在人機交互中界面中選項越多，意味著用戶做出決定的時間越長。例如比起 2 個菜單，每個菜單有 5項，用戶會更快得從有 10 項的 1 個菜單中做出選擇。 席克定律多應(yīng)用于軟件/網(wǎng)站界面的菜單及子菜單的設(shè)計中，在移動設(shè)備中也比較適用。 2.iOS10人機界面設(shè)計指南中的設(shè)計原則 三大原則 清晰Clarity 清晰易懂，突出重點，表達(dá)可交互性 遵從Deference 輕量化，突出內(nèi)容 深度Depth 層次結(jié)構(gòu) 其他原則 美學(xué)完整性Aesthetic Integrity 不易察覺且不引人注目的圖形、標(biāo)準(zhǔn)化控件和可預(yù)知的交互行為從而讓用戶保持專注。 一致性(Consistency) 相同的標(biāo)準(zhǔn)和規(guī)范，應(yīng)用所包含的特征和交互行為是符合用戶心理預(yù)期的。 直接操作(Direct Manipulation) 能夠提升用戶的參與度并有助于理解。讓用戶獲得及時可視的反饋 反饋(Feedback) 認(rèn)證交互行為,呈現(xiàn)結(jié)果,并通知用戶，臨時高亮、進度指示器。動效和聲音加強對結(jié)果的提示 隱喻(Metaphors) 使用來源于現(xiàn)實生活的用戶體驗，或已培養(yǎng)出來的習(xí)慣，能讓用戶快速學(xué)會使用應(yīng)用 用戶控制(User control) 用戶主導(dǎo)，應(yīng)用僅為用戶行為提供建議，嚴(yán)重后果的發(fā)出警告，不提用戶做決定。讓用戶可預(yù)知，可隨時取消 遵從這些原則更好的幫助我們設(shè)計出來的產(chǎn)品好用易用，更加符合用戶的心理預(yù)期。當(dāng)然規(guī)則是死的，人是活的，如果我們有更好的解決問題的方式，能根本的解決設(shè)計中的問題，那也可以不用遵循設(shè)計原則。 |
