成都網站建設公司

交互設計，表現出來的呈現方式可謂是多種多樣，

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

1.響應

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

參考實例：

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

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

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

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

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

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

另一個參考實例：

2.過渡過程或轉場效果

對即將產生的交互變化，提供一個過渡過程或轉場的效果。

過渡過程，如：延時移動、淡入淡出等。

轉場效果，如：滑動、門開關、縮放、翻轉等。

參考實例：

點擊某個封面，延時移動給操作者帶來一個很好的引導閱讀過程。

注意：要頻繁處理的操作，過渡過程耽誤時間的同時，還可能造成誤點擊。

過渡效果有時候還可以減少不必要的態(tài)度變更提醒：

比如，刪除郵件后不需要顯示郵件已刪除。

而是點擊刪除后，該條內容閃爍一下（響應），然后逐漸消失，

因為你已經真實的看到了刪除的過程，所以不必再顯示郵件已刪除的狀態(tài)變更提醒。

3.移位

在不彈層、彈窗情況下的內容移位。合理的運用頁面內容的展開、收起。

操作者在即將產生交互的地方，就近通過這種方式就完成了輕便的操作。

參考實例：

下邊的展開與收起

點擊下邊地址中的視頻播放，同樣可以看到視頻右側文字內容的移位效果。

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

1. 響應：可以引起觸發(fā)的區(qū)域提供響應變化

2. 過程效果：讓人的視線一直保持連貫

3. 移位：不必要彈出新頁面時，通過伸展原區(qū)域的大小完成小的功能交互，以達到用最小的視覺變化完成交互任務的目的。

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