Smart Thinking: Microinteractions Animation from
Smart Design on
Vimeo.
一個設計良好的產品包含:特色跟細節。特色吸引人,細節則留住人。MicroInteractions 就屬於細節。這裏的細節是指傳遞情緒系統:感官的部分,他們看起來如何、感覺如何、用起來?
微互動包含四個部分
- 觸發( Trigger ): 怎麼開始,是手動控制;點擊按鈕,或是透過系統;條件具足時觸發啟動: 另一種示範。
- 規則 (Rules): 藉由定義好的事件流程,決定微互動的流程。互動時,什麼要做,什麼不行。
- 回饋 ( Feedback): 使用者看不到 Rules,透過 Feedback 來了解 Rules。
- 循環&模式 ( Loops and Modes: Mode ):只有在非必要且不常出現的動作中被使用,否則容易破壞整體的流程。Loops 決定微互動的時間有多長、動作有多久;如果重複觸動,怎麼再出現。
|
手動觸發 |
|
規則:決定什麼可以,什麼不行。當手機與電腦同步登入 Line 後,手機的微互動機制會提示我資訊。
|
|
回饋機制,讓使用者明白Rules 是什麼。 |
|
模式的設計,要簡單直白,讓使用者一路到底,不能因為其他行為破壞整個微互動機制。 |
|
週期可以是告訴使用者目前的作業階段,並了知整個微互動的長度,或是有多久。 |
規劃準則
- 預先呈現資料:決定何種產品資訊使用者會感興趣,如何在畫面上露出。
- 防止人為錯誤:不要讓使用者的行為破壞整個互動機制。
- 直接了當:直接傳遞標靶訊息
- 較長的循環:如果使用者回來第二次、第十次、一百次,這個互動該怎麼呈現!
參考範例: