交互設計，表現(xiàn)出來的呈現(xiàn)方式可謂是多種多樣，

不過你只要掌握好了以下三點的使用技巧，同樣可能輕松打造出良好的交互設計效果。

1.響應

對即將產生交互內容的區(qū)域提供給操作者一種響應機制。

參考實例：http://glyde.com

不同的內容有很多響應的處理方法，

比如：鏈接加個下劃線，圖片鏈接變換下外邊框顏色，

鼠標劃過某區(qū)域，變化下背景色，同時出現(xiàn)一些隱性的操作按鈕，如刪除操作等。

注意：忌諱因為某區(qū)塊產生響應，而讓其它區(qū)塊邊界產生生硬的錯位。

補充：提示音也是一種響應。

比如：用iPhone發(fā)送郵件，發(fā)送成功后會聽到“嗖…”的一聲。

另一個參考實例：

2.過渡過程或轉場效果

對即將產生的交互變化，提供一個過渡過程或轉場的效果。
過渡過程，如：延時移動、淡入淡出等。
轉場效果，如：滑動、門開關、縮放、翻轉等。
參考實例：http://glyde.com

點擊某個封面，延時移動給操作者帶來一個很好的引導閱讀過程。
注意：要頻繁處理的操作，過渡過程耽誤時間的同時，還可能造成誤點擊。

過渡效果有時候還可以減少不必要的態(tài)度變更提醒：
比如，刪除郵件后不需要顯示郵件已刪除。
而是點擊刪除后，該條內容閃爍一下（響應），然后逐漸消失，
因為你已經真實的看到了刪除的過程，所以不必再顯示郵件已刪除的狀態(tài)變更提醒。

3.移位

在不彈層、彈窗情況下的內容移位。合理的運用頁面內容的展開、收起。
操作者在即將產生交互的地方，就近通過這種方式就完成了輕便的操作。

參考實例：http://gizmodo.com/
http://www.axure.org/demo 下邊的展開與收起

點擊下邊地址中的視頻播放，同樣可以看到視頻右側文字內容的移位效果。
http://www.cnn.com/2010/TECH/01/ … analysis/index.html

我們總結出來結論，所有交互過程不外乎包括以下三個要素：

1. 響應：可以引起觸發(fā)的區(qū)域提供響應變化
2. 過程效果：讓人的視線一直保持連貫
3. 移位：不必要彈出新頁面時，通過伸展原區(qū)域的大小完成小的功能交互，以達到用最小的視覺變化完成交互任務的目的。

注意：過渡過程和移位在Web開發(fā)實現(xiàn)上，可能大量應用到Js庫，非必要時可以盡量減少使用。

來源：http://www.mykite.cn/post/23