動效小科普!聊聊未來設計趨勢的App UI動效 - 優設網 - UISDC

動效小科普!聊聊未來設計趨勢的App UI動效

2015/06/04 18309評論區

app-ui-design-trend-1

編者按:今天百度的同學來聊聊有哪些基礎的動效類型,以及分享幾個常見的動效設計方法,大量動圖,流量黨請小心 >>>

善心悅目的動效已然成為一個App的必備,作為設計師自然要跟隨趨勢學習。APP中的動效可以劃分為兩類,一類是轉場動效,應用在頁面的切換,加載等,這類動效可以柔和頁面的過度效果,增加切換、加載、等待過程的趣味性。另一類是反饋提醒,通過界面內元素的動效,增強用戶的交互感知或引導用戶完成任務。

1.gif

動效充滿了設計師體驗的想象,作為一個設計師,不管你的逼格下限在哪里,一個有趣有愛充滿個性的進度條都是你設計生涯中不能拒絕的愛。那么設計師什么時候需要做一個動效設計呢?

1、等待都需要一個有意義的動效。面對等待,我們總是缺少耐心。充滿個性,有趣的動效可以讓用戶對你的設計對上一份喜愛:至少這個設計還不錯。

02-app-dong-xiao.gif

2、如果你希望用戶點擊這個地方,請給它一個動效。

1433314050883122

3、如果你希望你的點擊效果不一樣,請給它一個動效。

1433314090923023

下面則是一些常見的動效設計方法,當我們在合適的條件下,自然要考慮從這些方法入手,為我們的設計增加一絲動感。

一、將元素替換為個性化內容

傳統的等待或加載動畫人們已經熟悉,想讓人眼前一亮,改頭換面是必須的。如谷歌用了自己的顏色,去哪兒用了自己的logo等,這些都是可以在個性化動效的同時凸顯產品品牌,不失為一個很好的選擇。

05-app-dong-xiao.gif

二、更換產品的運動方式

除了旋轉運動之外,我們還可以運用重復,構建,變形,擬物、人的動作(翻書)等,只要是和產品定位相符的元素,我們都能給它創意一個獨特的運動方式。

06-app-dong-xiao.gif

重復運動

07-app-dong-xiao.gif

構建

三、賦予組件明顯的交互反饋

冷冰冰的點擊和出現往往不能吸引用戶的注意力,所以,當我們需要加強某些元素來引導用戶的時候可以給這些元素加上適當的出現效果,如漸隱漸顯,位移,放大縮小,光暈,分布等效果,會起到很好的引導效果。

08-app-dong-xiao.gif

09-app-dong-xiao.gif

10-app-dong-xiao.gif

動效設計可以的精妙之處在于瞬間獲得的體驗,通過瞬間的可見變化豐富了人們在使用app時的感覺,不再陌生,不再冰冷,不再無趣等等。動效設計在賦予了元素動的同時,我認為還要符合人們的認知,并不是所有的動都能讓人愉悅,既要滿足產品的需求,還要能匹配人們的當時的場景訴求。希望大家在今后的設計中都能有高水平的動效設計。

【人氣超高的動效設計文!】

取悅人心?這組動效足夠了!
《帥呆了!一組令人愉悅的APP動效設計》

小技巧一枚!教你快速保存動效!
《經驗分享:如何快速保存APP動效?》

未來標配!干貨超多的UI動效好文!
《漲姿勢!你應該知道的UI動態設計規則》

原文地址:ued.baidu

【優設網 原創文章 投稿郵箱:[email protected]

================關于優設網================
“優設網阿贾克斯对热刺“是國內人氣最高的網頁設計師學習平臺,專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書:史上最全的設計師圖書導航://hao.uisdc.com/book/。
設計微博:擁有粉絲量96萬的人氣微博@優秀網頁設計 ,歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航:全球頂尖設計網站推薦,設計師必備導航://hao.www.utsvcz.com.cn
———————————————————–
想在手機上、被窩里獲取設計教程、經驗分享和各種意想不到的”福利”嗎?
添加 優秀網頁設計 微信號:【youshege】優設哥的全拼
您也可以通過掃描下方二維碼快速添加:

sdcweixin

非特殊說明,本文版權歸原作者所有,轉載請注明出處
本文地址://www.utsvcz.com.cn/app-ui-design-trend

發表評論 加載中....

評論加載中....

uisdc

評論區都快餓癟了,看看我期盼的小眼神...

sketch 界面設計 版式設計 排版布局 職場 優設專訪 設計師干貨 優設大課堂 設計達人 配色 web前端開發 視覺設計 素材下載 AI教程 設計理論 設計流程 神器下載 字體下載 設計師專訪 psd下載 設計規范 海報設計 設計趨勢 用戶體驗設計 動效設計 平面設計 logo設計 圖標設計 ICON 產品設計 神器推薦 App設計 字體設計 職場規劃 酷站推薦 交互設計 ui設計 優秀網頁設計 設計師職場 ps技巧 酷站 用戶體驗 PS教程 網頁設計 經驗分享

您還沒有登錄

優設啟用更安全省心的 微信掃碼登錄

微信掃碼

300萬設計師聚集地!優設網是極具人氣的設計師平臺
2012年成立至今,一直專注于設計師的學習成長交流

把好文章收藏到微信

打開微信,掃碼分享
學設計 優設網 在這里