< 隨著國際大品牌蘋果跟谷歌的引領,近越來越多的國內(nèi)公司開端關注動效設計了,越來越多的團隊已經(jīng)意識到動效在產(chǎn)品用戶閉會中的重要性了,更多的射雞師們也開端投身動效設計范疇。
(文中局部案例為設計師個人作品,局部為線上產(chǎn)品,都是我十分十分欣賞的作品。如不慎沖撞請戳我調(diào)換掉)
加強閉會舒服度
嗯,就是讓用戶更加爽更加爽的用你的產(chǎn)品。網(wǎng)站設計要能充分吸引訪問者的注意力,讓訪問者產(chǎn)生視覺上的愉悅感。因此在網(wǎng)頁創(chuàng)作的時候就必須將網(wǎng)站的整體設計與網(wǎng)頁設計的相關原理緊密結合起來。
具體表當初:
1.表示層級關聯(lián)
為了展示層與層的關聯(lián),是抽屜,是打開,還是平級切換等等,讓用戶曉得這個界面跟上一個、下一個的關聯(lián)。網(wǎng)站設計要能充分吸引訪問者的注意力,讓訪問者產(chǎn)生視覺上的愉悅感。因此在網(wǎng)頁創(chuàng)作的時候就必須將網(wǎng)站的整體設計與網(wǎng)頁設計的相關原理緊密結合起來。這已經(jīng)是非經(jīng)常見的應用了。
2.與用戶手勢結合,更天然的動畫表示
當用戶手勢操作的時候,讓界面的動態(tài)走向更合乎手指的活動,從而讓用戶感到到是自己把持了界面的動向,而不是機械化的跳轉(zhuǎn)。
UI動效設計 動效設計 提示性動效設計
City guide app 用手勢可能向左向右扔卡片
3.愉快的提示功能
在某些須要提示的時候能吸引用戶的留神,然而又不會僵硬,合乎預期的呈現(xiàn)。
UI動效設計 動效設計 提示性動效設計
Action button feedback 出錯提示
UI動效設計 動效設計 提示性動效設計
City Guides 啟動時提示用戶可能左右滑動卡片
4.額定增加界面的活力
在用戶預期之外增加的驚喜,可能是帥氣的,可能是賣萌,可能有些物理屬性,總之讓用戶感知到產(chǎn)品的生命力。
UI動效設計 動效設計 提示性動效設計
readme.io 萌萌的輸入框
UI動效設計 動效設計 提示性動效設計
amazon Q彈的菜單
UI動效設計 動效設計 提示性動效設計
tumblr 不喜好我 心都碎了呢~
5.吸引用戶長久的留神力
也是屬于增加用戶的驚喜感,在某些數(shù)據(jù)量較大的界面中增加一些動效,讓用戶堅持留神力。
UI動效設計 動效設計 提示性動效設計
Bubbles 以動態(tài)的情勢展示數(shù)據(jù)點
http://212118.com/
>