交互設計原則分析

交互設計原則分析

尼爾森十大交互原則

1.狀態可見原則（Visibility of system status ）

系統應該讓用戶時刻清楚當前發生了什麼事情，也就是快速的讓用戶瞭解本身處於何種狀態、對過去發生、當前目標、以及對將來去向有所瞭解，通常的方法是在合適的時間給用戶適當的反饋，防止用戶使用出現錯誤。

例一： 當用戶點擊按鈕後，因爲網絡速度等因素加載過慢時，給用戶明確展現出按鈕處於加載的狀態，若是不這樣作，用戶就會迷茫、不知所措，本身明明點擊了按鈕卻沒有反應，這樣就會出現反覆點擊的狀況，從而下降用戶的好感度。

例二： 該界面中的日期選擇，選定的日期底色爲綠色高亮顯示，讓用戶清晰明瞭的知曉當下選擇的日期，與此同時當天的日期運用綠色的描邊圓來顯示，提示用戶當前日期。以及其標籤欄的中當前頁面圖標高亮，其餘圖標熄滅，是告訴用當前所在頁面，也是運用了狀態可見原則。

2：環境貼切原則（Match between system and the real world）

軟件系統應該使用用戶熟悉的語言、文字、語句，或者其餘用戶熟悉的概念，而非系統語言。軟件中的信息應該儘可能貼近真實世界，讓信息更天然，邏輯上也更容易被用戶理解。

例： 依然以這個頁面爲例，在給改按鈕定字段時它徹底能夠定爲「簽到」，但實際運用中是經過掃二維碼來簽到的，故運用「掃碼簽到」更貼合實際運用場景；且簽到是該應用的核心功能，故該按鈕重量級相對其餘元素要大；對用戶而言這種設計是很是友好的，首先他能夠一眼找到核心功能，其次經過字面意思就能夠知曉該如何操做。

3：用戶可控原則（User control and freedom）

用戶經常會誤觸到某些功能，咱們應該讓用戶能夠方便的退出。這種狀況下，咱們應該把「緊急出口」按鈕作的明顯一點，並且不要在退出時彈出額外的對話框。不少用戶發送一條消息、總會有他突然意識到本身不對的地方，這個叫作臨界效應；因此最好支持撤銷/重作功能。

例一： 該頁面中關注房源的圖標按鈕就是能夠用戶自行操做，若是誤操做關注了本身不想關注的房源，用戶就能夠再次點擊圖標按鈕取消關注。

例二： 釘釘支持撤回所發的信息。這一功能對於常常手誤的用戶比較實用，給他們提供了補救的辦法。這就是用戶可控原則。

4：一致性原則（Consistency and standards）

對於用戶來講，一樣的文字、狀態、按鈕，都應該觸發相同的事情，聽從通用的平臺慣例；也就是，同一用語、功能、操做保持一致。軟件產品的一致性包括如下五個方面：

（1）結構一致性： 保持一種相似的結構，新的結構變化會讓用戶思考，規則的排列順序能減輕用戶的思考負擔；

例： 下圖所示功能項的展現方式均爲輔助圖標加功能文字描述，統一的結構、統一的佈局方式，讓用戶在始終熟悉的感受下體驗着產品的不一樣功能點。

（2）色彩一致性： 產品所使用的主要色調應該是統一的，而不是換一個頁面顏色就不一樣； 例： 該產品主色調是綠色的，於是不一樣頁面的圖標顏色與界面的主色均爲綠色，也包括其中一些標籤和強調的文字顏色都是綠色，整個界面除了圖片外，都經過灰、白、綠色來呈現，界面保持了很好的一致性，這就是色彩一致性原則。

（3）操做一致性: 能讓產品更新換代時仍然讓用戶保持對原產品的認知，減少用戶的學習成本;

例： 各個app中返回上一級的返回按鈕都在左上角，點擊這個箭頭進行返回操做。這一標識在用戶羣中已經達成了共識。

（4）反饋一致性： 用戶在操做按鈕或者條目的時候，點擊的反饋效果應該是一致的；

例： 大多數app中通常狀況下，下拉都是刷新的反饋，都會出現刷新loading，體驗至關一致

（5） 文字一致性：產品中呈現給用戶閱讀的文字大小、樣式、顏色、佈局等都應該是一致的；

例： 該頁面中框選的文字大小、顏色、佈局的樣式都同樣，就連字段長度都一致。這樣用戶在運用過程當中就會有必定的熟悉感，下降學習成本。

5：防錯原則（Error prevention）

比一個優秀錯誤提醒彈窗更好的設計方式，是在這個錯誤發生以前就避免它。能夠幫助用戶排除一些容易出錯的狀況，或在用戶提交以前給他一個確認的選項。在此，特別要注意在用戶操做具備毀滅性效果的功能時要有提示，防止用戶犯不可挽回的錯誤。

例一： 當用戶刪除某些信息時，給出再次確認的彈窗，防止他誤操做刪除某些重要信息。

例二： 不少應用上都會在用戶退出登陸時彈出確認彈窗，以此來防止用戶誤操做退出應用形成的一系列麻煩。

六、易取原則（Recognition rather than recall）

經過把組件、按鈕及選項可見化，來下降用戶的記憶負荷。用戶不須要記住各個對話框中的信息。軟件的使用指南應該是可見的，且在合適的時候能夠再次查看。

例： 該界面展現的爲會務的消息列表，天天會受到不少回覆發佈或更改的消息，用戶固然不想每次都進入會務詳情頁才能看到會務的核心內容了，於是在展現新發布的會務時，列出來名稱、時間、地點這上核心內容；而更改的會務將更新的項標紅顯示，其實這裏是有問題的，被更改的會務在列表裏總有一項用戶想知道核心內容看不到（要麼是時間要麼是地點），這點體驗不太好。

七、靈活高效原則

這個原則就是告訴咱們每一個產品針對的用戶不多是全部用戶，都會有本身的適用人羣，咱們須要針對主要的用戶去設計，而不能僅僅爲了一小部分用戶進行極端設計，知足大部分用戶的使用需求才是最重要。中級用戶的數量遠高於初級和高級用戶數。爲大多數用戶設計，不要低估，也不可輕視，保持靈活高效，爲大多數用戶設計，兼容少部分特殊用戶。汽車油門—新手用戶經常看不見，並且對於高手來講能夠經過它快速與汽車互動。這樣的系統能夠同時知足有經驗和無經驗的用戶。容許用戶定製經常使用功能。

例： 像該頁面中房源信息默認所類型的都顯示，若是用戶只想看帶視頻的，那麼其餘的對用戶而言就是無用的，同時這些無用的還會佔用用戶大量的瀏覽時間，這是一種浪費，像如今的這種設計就可讓用戶快速高效的獲取他想要的有效信息。

八、優美且簡約原則（Aesthetic and minimalist design）

對話中的內容應該去除不相關的信息或幾乎不須要的信息。任何不相關的信息都會讓本來重要的信息更難被用戶察覺。

例： 像這個退出登陸確認彈框，沒有任何廢話，言簡意賅，讓用戶一目瞭然。

九、容錯原則（Help users recognize, diagnose, and recover from errors）

錯誤信息應該使用簡潔的文字（不要用代碼），指出錯誤是什麼，並給出解決建議。也就是在用戶出錯時如何爲出錯的用戶提供及時正確的幫助呢？即要幫助用戶識別出錯誤，分析出錯誤的緣由再幫助用戶回到正確的道路上。若是真的不能幫助用戶從錯誤中恢復，也要儘可能爲用戶提供幫助讓用戶損失降到最低。

例： 這個登陸頁面的填寫項是容許用戶出錯的並且它會提示用戶怎麼錯了，讓用戶很清晰如何糾正，避開誤區，像「驗證碼已失效」，就明確的告訴了用戶以前的驗證碼已經失效了，不要再重複填寫了，獲取新的驗證碼再填。

（10）人性化幫助原則（Help and documentation）

即便系統不使用幫助文檔是最好的，但咱們也應該提供一份幫助文檔。任何幫助信息都應該能夠方便地搜索到，以用戶的任務爲核心，列出相應的步驟，但文字不要太多。 例： 如圖所示，登陸頁的「記住用戶名及密碼」的幫助項實時可見，只要在登陸頁就可見此功能，你用或不用，他都在那裏。