隨着國際大品牌蘋果和谷歌的引領,近越來越多的國內公司開始關注動效設計了,越來越多的團隊已經意識到動效在產品多用户體驗中的重要性了,更多的射雞師們也開始投身動效設計領域。
(文中部分案例為設計師個人作品,部分為線上產品,都是我非常非常欣賞的作品。如不慎冒犯請戳我替換掉)
加強體驗舒適度
嗯,就是讓多用户更加爽更加爽的用您的產品。
具體表現在:
1. 表現層級關係
為了展現層與層的關係,是抽屜,是開啓,還是平級切換等等,讓多用户知道這個介面和上一個、下一個的關係。這已經是非常常見的運用了。
2. 與多用户手勢結合,更自然的動畫表現
當多用户手勢操作的時候,讓介面的動態走向更符合手指的運動,從而讓多用户感覺到是自己控制了介面的動向,而不是機械化的跳轉。
UI 動效設計 動效設計 提示性動效設計
City guide WordPress APP 用手勢可以向左向右扔卡片
3. 愉快的提示功能
在某些需要提醒的時候能吸引多用户的注意,但是又不會生硬,符合預期的出現。
UI 動效設計 動效設計 提示性動效設計
Action button feedback 出錯提示
UI 動效設計 動效設計 提示性動效設計
City Guides 啓動時提示多用户可以左右滑動卡片
4. 額外增加介面的活力
在多用户預期之外增加的驚喜,可以是帥氣的,可以是賣萌,可以有些物理屬性,總之讓多用户感知到產品的生命力。
UI 動效設計 動效設計 提示性動效設計
readme.io 萌萌的輸入框
UI 動效設計 動效設計 提示性動效設計
amazon Q 彈的選單
UI 動效設計 動效設計 提示性動效設計
tumblr 不喜歡我 心都碎了呢~
5. 吸引多用户持久的注意力
也是屬於增加多用户的驚喜感,在某些資料量較大的介面中新增一些動效,讓多用户保持注意力。
UI 動效設計 動效設計 提示性動效設計
Bubbles 以動態的形式展現資料點