交互能夠讓界面看起來生動有趣，但是要格外注意上下文。通過上下文流暢地傳遞給用戶，能夠讓用戶有明顯的預期。解釋界面上的元素，強化元素間的層次結構，并且表現(xiàn)產(chǎn)品邏輯。

如何讓交互的上下文表現(xiàn)的更加流暢呢？《Functional Animation In UX Design: What Makes a Good Transition?》（原文需要翻墻）一文中提到了 6 點，包括：有響應、能聯(lián)想、自然的、有目的、速度適中、簡單清晰。

1. 有響應

簡單的說，用戶操作并產(chǎn)生預期的反饋。作者在文中提到了“開關燈”這個場景，在現(xiàn)實生活中也會有類似的場景存在，比如點擊應用圖標打開應用、點擊用戶頭像進入用戶個人主頁等等。我認為，有響應是大多數(shù)應用遵循的基本的邏輯和原則。

2. 能聯(lián)想

這一點和“有響應”有密切的關系，也就是符合用戶預期。將新展開的界面和構成界面的元素或動作連接起來。組合聯(lián)系背后的邏輯是幫助用戶理解剛剛在可視布局里發(fā)生的變化，是什么觸發(fā)了這個變化。也就是用戶在前一界面發(fā)生點擊行為，與后一界面之間的關聯(lián)性。這個概率的大小，決定了用戶預期的強弱。

3. 自然的

在現(xiàn)實世界，物體迅速加速或減速是受重力和摩擦力的影響，比較明顯的幾種類型有：

ease 規(guī)定慢速開始，然后變快，然后慢速結束的過渡效果；

ease-in 規(guī)定以慢速開始的過渡效果；

ease-out 規(guī)定以慢速結束的過渡效果；

ease-in-out 規(guī)定以慢速開始和結束的過渡效果

類似的，在好的用戶界面設計中，開始或停止也不是突然出現(xiàn)的，而是遵循一定的加速或者減速的表現(xiàn)。

4. 有目的

在恰當?shù)臅r機指引到恰當?shù)姆较蚝湍康?，交互的作用彰顯的淋漓盡致。不論是文字段落，還是靜態(tài)圖片，都能通過交互完成，一個好的交互能夠引導用戶進行下一步的操作。

第一次進入的用戶或許不能預知即將發(fā)生的交互行為，但合理的動畫能幫助用戶保持良好的方向感，不會覺得內容突然發(fā)生了變化而感覺不適。當把窗口縮小時，Mac OS 使用了一個動畫，這個動畫連接了前一個狀態(tài)和下一個狀態(tài)。

另一個好的示例是一個繼承性過渡，當用戶在列表中或卡片元素中選擇某一項，放大看它的細節(jié)內容，這個交互需要用戶保持上下文一致。（請對照原文閱讀體會）

5. 速度適中

原文中表達的是“快速”，我認為應該是速度適中，或者應該是找到一個平衡點，讓用戶既不會等太久，且符合用戶心理感知。在用戶操作后，能夠讓用戶理解和判斷即將發(fā)生的事情。

6. 簡單清晰

過渡應該避免一次做太多事情，因為當眾多的條目需要在不同的方向或路徑運動時，它們會讓人困惑。

過渡應該清晰、簡單而連貫。記住，在交互設計時，少即是多。所以我們應該只關注希望用戶做的主要事情，完成我們?yōu)橛脩粼O置的主要任務就可以了。

在結論部分，作者也介紹說明了：

交互不是隨機的，每一個交互背后都有目的。交互需要讓你的用戶不錯過最重要的信息，無論你的 App 是好玩有趣的，還是嚴肅直接的，使用合理的交互能幫你給用戶提供一個清晰快速連貫的體驗。用心設計，注意每一個細節(jié)都是成功的關鍵，讓人機交互更容易使用。

文章由 鄭幾塊 原創(chuàng)發(fā)布，轉載請獲得授權，謝謝！