設(shè)計(jì)師們可能已經(jīng)感受到了,界面流暢精致,優(yōu)雅如詩(shī)的動(dòng)態(tài)效果,讓越來(lái)越多人關(guān)注動(dòng)效設(shè)計(jì)并學(xué)習(xí)AE的使用。國(guó)內(nèi)很多知名App (知乎、網(wǎng)易云音樂(lè)、嗶哩嗶哩)的使用體驗(yàn)也相應(yīng)的推陳出新了。
至于原因,我們看幾個(gè)案例就一目了然咯。
上圖是在Windows 打開(kāi)「我的電腦」時(shí),圖標(biāo)到窗口的切換過(guò)程,轉(zhuǎn)變來(lái)得猝不及防,生硬無(wú)比,假如給它換上動(dòng)效呢,是不是感覺(jué)就大不一樣啦!
Mac 最小化窗口過(guò)程演示
一個(gè)簡(jiǎn)單的弧形動(dòng)效,就可以明確告知用戶界面狀態(tài)的變化,而且延續(xù)了整個(gè)交互過(guò)程的完整性,令人著迷的「無(wú)割裂體驗(yàn)」就是這么來(lái)的。
作為2017年設(shè)計(jì)寵兒,AE動(dòng)效的迷人之處遠(yuǎn)不止這些,UI移動(dòng)界面設(shè)計(jì)中運(yùn)用更廣泛:
作者:Snapwi
這是我們常使用的輸入框,然而當(dāng)需要填寫(xiě)2個(gè)以上(比如交友相親的App 和大學(xué)網(wǎng)站的資料表)的信息,這個(gè)設(shè)計(jì)的缺陷就暴露無(wú)遺了。
單擊輸入框時(shí),提示文本會(huì)消失,如果需要填寫(xiě)多條信息我記憶力不好記不住需要填寫(xiě)什么好嘛!
而動(dòng)效可以簡(jiǎn)單優(yōu)雅的解決這個(gè)困擾:
用一個(gè)線框彈跳的動(dòng)態(tài)效果解決了問(wèn)題,用戶體驗(yàn)更上一層樓。
類(lèi)似的案例還有很多(Facebook 的新表情,微博網(wǎng)頁(yè)版的點(diǎn)贊新方式等等)在此不多贅述,可以說(shuō)動(dòng)效幾乎可以融入到UI 界面設(shè)計(jì)的每個(gè)細(xì)節(jié)。
告知系統(tǒng)狀態(tài),給予用戶及時(shí)的視覺(jué)反饋 。
作者:Nick
用作引導(dǎo)頁(yè),AE動(dòng)效讓信息展現(xiàn)更加順暢,幫助用戶高效地抵達(dá)目標(biāo)。作者:Ramotio
無(wú)縫切換按鈕狀態(tài),且取悅用戶。
作者:Kei Sato
可能大伙會(huì)有疑問(wèn),這些都是界面設(shè)計(jì)小細(xì)節(jié),需要如此精雕細(xì)琢么?這兒用Charles Eames 的話回答:「細(xì)節(jié)并非散布于細(xì)枝末節(jié),它們串成了設(shè)計(jì)?!怪?jǐn)記偉大的設(shè)計(jì)是完整的存在,上至宏觀功能,下至細(xì)節(jié)微交互。
除了UI ,AE動(dòng)效在交互領(lǐng)域的地位也越來(lái)越高,當(dāng)你擺出一個(gè)動(dòng)態(tài)的高保真原型時(shí),根本無(wú)需解釋點(diǎn)擊什么按鈕出現(xiàn)什么效果。
動(dòng)效演示扇形菜單?作者:Claudio Guglier
而品牌設(shè)計(jì)中,動(dòng)效更是如虎添翼:
Instagram 設(shè)計(jì)師:老板,這個(gè)LOGO 收費(fèi)三萬(wàn)。
老板:兩個(gè)圓角白框你敢收我三萬(wàn),不怕告訴你我也是會(huì)用PS的(擼袖子)
Instagram 設(shè)計(jì)師:老板,這個(gè)LOGO 收費(fèi)三萬(wàn)。
老板:嗯不錯(cuò)很酷炫,這就是我要的效果。辛苦了馬上安排打款事項(xiàng)。(以上對(duì)話均為虛構(gòu)場(chǎng)景,會(huì)動(dòng)效的設(shè)計(jì)師可能遇到過(guò))
簡(jiǎn)言之,人靠衣裝馬靠鞍,現(xiàn)在已經(jīng)不是在LOGO 上畫(huà)幾條“輔助參考線”、“黃金分割” 就可以漫天開(kāi)價(jià)的時(shí)代,學(xué)會(huì)用視覺(jué)震撼的動(dòng)效包裝作品,才是雙方都滿意的正確姿勢(shì)。
然而我們插畫(huà)設(shè)計(jì)師可能覺(jué)得會(huì)AE動(dòng)效似乎并沒(méi)有什么卵用,有這種想法的設(shè)計(jì)師我們不妨來(lái)看看下面這些作品:
如何讓一幅普通插畫(huà)變得意境飛揚(yáng)。
如何讓一組普通動(dòng)物表情變得萌趣叢生。
作者:Cindy Suen
在招聘網(wǎng)站上也隨處可見(jiàn)動(dòng)效設(shè)計(jì)師的身影,而且薪資不菲
對(duì)于常年伏案加班的設(shè)計(jì)師,如何短時(shí)間內(nèi)掌握AE動(dòng)效呢?這里推薦深受300多位學(xué)員喜愛(ài)的AE動(dòng)效老師-郁悶的雞。
BeardChicken,圈內(nèi)粉絲都稱(chēng)他雞爺,優(yōu)設(shè)特約免費(fèi)講座分享講師、站酷648 萬(wàn)超人氣設(shè)計(jì)師、全國(guó)十佳UI 設(shè)計(jì)師。
他在全球知名的設(shè)計(jì)站點(diǎn)Dribbble上也擁有極高人氣,圍觀地址→dribbble.com/tczhang
2008年開(kāi)始從事廣告行業(yè),2010年開(kāi)始從事UI工作,曾任職阿里數(shù)娛(天天動(dòng)聽(tīng))設(shè)計(jì)總監(jiān),兼創(chuàng)業(yè)公司設(shè)計(jì)顧問(wèn)。
常年在優(yōu)設(shè)分享設(shè)計(jì)教程,并且培養(yǎng)了超300名優(yōu)秀學(xué)員,畢業(yè)學(xué)員就職BAT、更有拜師學(xué)藝后考上清華交互研究生。
熱愛(ài)AE動(dòng)效的雞爺保持活力,經(jīng)常說(shuō)要用新技能解決實(shí)際問(wèn)題,Dribbble主頁(yè)作品更是頻繁更新:
我們?cè)趺凑f(shuō)雞爺厲害都不及學(xué)員的真實(shí)反饋:
學(xué)員實(shí)力具體如何,作品說(shuō)話:
AE動(dòng)效課程特訓(xùn)班學(xué)習(xí)時(shí)間長(zhǎng)達(dá)3個(gè)月,既要上班又要學(xué)習(xí)有時(shí)候難免會(huì)累,這時(shí)候雞爺總是激勵(lì)大家認(rèn)真踏實(shí)的學(xué),對(duì)學(xué)員的疑惑從來(lái)都是有問(wèn)必答:
對(duì)于AE動(dòng)效設(shè)計(jì)這個(gè)新技能,我們可能會(huì)懷疑是否真的有用呢?這里學(xué)員收獲說(shuō)明只要肯學(xué),考入理想院校加薪都不是難事:
新增AE動(dòng)效設(shè)計(jì)新技能后,有更多機(jī)會(huì)接到私單,分分鐘賺回學(xué)費(fèi):
是的,11月2日雞爺AE動(dòng)效設(shè)計(jì)特訓(xùn)營(yíng)第四期終于來(lái)了,年底了都在謀劃來(lái)年漲薪大事??次覀儾瀹?huà)、手繪課程宣傳不到4天120名額即刻滿,就知道大家都在暗戳戳的學(xué)習(xí)進(jìn)修,都憋著一口氣呢!
想到這一層貼心的雞爺更是免費(fèi)新增4課時(shí),勢(shì)必要把更多知識(shí)技能教給大家?guī)椭鷮?shí)現(xiàn)漲薪目標(biāo)。
接下來(lái)重點(diǎn)來(lái)啦~
報(bào)名此課程你需要的是:
1、需要熟練PS,有界面設(shè)計(jì)基礎(chǔ);
2、上直播不缺課,有疑問(wèn)隨時(shí)請(qǐng)教老師;
3、一定要交作業(yè)!雞爺對(duì)每個(gè)學(xué)員作業(yè)均一對(duì)一輔導(dǎo)。
真誠(chéng)的獻(xiàn)上價(jià)格:
最后,搶占名額聯(lián)系誰(shuí)?請(qǐng)往下看↓↓↓
請(qǐng)往下看↓↓↓
報(bào)名方式一:
聯(lián)系琴子:QQ:2962768582(驗(yàn)證:動(dòng)效報(bào)名)
( 注:報(bào)名完成后,截圖訂單圖會(huì)邀請(qǐng)你進(jìn)班級(jí)群噢)
報(bào)名方式二:
添加小優(yōu)微信號(hào):youshemei
如果人多的時(shí)候,您暫時(shí)無(wú)法和客服聯(lián)系上,
也可去我們高大上的官方專(zhuān)題頁(yè)了解詳情→ http://xue.uisdc.com/motion/
================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國(guó)內(nèi)人氣最高的網(wǎng)頁(yè)設(shè)計(jì)師學(xué)習(xí)平臺(tái),專(zhuān)注分享網(wǎng)頁(yè)設(shè)計(jì)、無(wú)線端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書(shū):史上最全的設(shè)計(jì)師圖書(shū)導(dǎo)航:http://hao.uisdc.com/book/。
設(shè)計(jì)微博:擁有粉絲量160萬(wàn)的人氣微博@優(yōu)秀網(wǎng)頁(yè)設(shè)計(jì) ,歡迎關(guān)注獲取網(wǎng)頁(yè)設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航:全球頂尖設(shè)計(jì)網(wǎng)站推薦,設(shè)計(jì)師必備導(dǎo)航:http://hao.uisdc.com
復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場(chǎng),未經(jīng)允許不得轉(zhuǎn)載。
發(fā)評(píng)論!每天贏獎(jiǎng)品
點(diǎn)擊 登錄 后,在評(píng)論區(qū)留言,系統(tǒng)會(huì)隨機(jī)派送獎(jiǎng)品
2012年成立至今,是國(guó)內(nèi)備受歡迎的設(shè)計(jì)師平臺(tái),提供獎(jiǎng)品贊助 聯(lián)系我們
AI輔助海報(bào)設(shè)計(jì)101例
已累計(jì)誕生 737 位幸運(yùn)星
發(fā)表評(píng)論
↓ 下方為您推薦了一些精彩有趣的文章熱評(píng) ↓