AE制作超炫路径动效教程

这篇教程教AE特效学习者们,和APP界面动画制作学习者们使用AE制作超炫路径动效教程,教程非常实用。在APP的动效中算是非常酷炫的效果了,推荐过来和飞特网的朋友们一起分享一起学习,希望大家喜欢这篇教程,我们先来看看最终的效果图吧:



首先,准备素材,我采用直接在手机截屏的方法,获取所需图片,(如果想要做练习的可以自己把界面做一遍)包括加号中的五个应用图标。



在ps中把背景、功能图标分开(包括加号旋转),同时放个蒙层#000000,60%透明度(也可以在AE里画)。



打开AE,双击红色区域导入path的ps源文件:



选择导入,会弹出选择弹出框,如下图选择:



双击红色区域,图层列表便会出现在时间轴中,同时显示在中间视图中:鼠标在视图区域通过滚轴可以放大缩小,也可以通过下面的百分比选择



邮件红框中的合成,选择合成设置,设置动画的时间长度,目前我们先设置3秒:



一切准备就绪,开始做动画了

首先,我们把蒙版层和五个功能图标隐藏:



把五个功能中及蒙版的图层在时间轴中缩短(因为当前用不到,点击加号才会出现),点击加号层中的下拉三角,我们首先用到的是旋转加号,快捷R,并往后大概0.3秒处位置打个关键帧,点击红框区域便是给此处打关键帧:



然后我们再把时间指示器拖到五个功能的位置,给旋转设置成旋转-45度,如下图:可以按空格键播放测试



然后显示蒙版层,在0.3秒处的位置透明度前打关键针(不透明度快捷键为T,可以快速展开想要的),给出透明度为0,到如上一个关键帧相同的位置透明度设为60%,可以按空格键播放测试速度,快了就把关键帧的距离间隔远些,反之就放近些,都可以拖动;记得中间按Ctrl+S保存:



然后开始做五个功能图标:

首先同时选中,(把小眼睛的图标打开),因为要做位移动画,



按快捷键P,将时间指示器移动到加号转45度关键帧出,按下位置处的关键帧:



再将时间指示器移动到0.3秒处(根据个人理解,有些关键帧会用到同一个位置):鼠标按住移动到加号上,目前发现在加号的上面,我们要放到加号的后面,将左边的加号图层移动的最上方即可



注意一定要基本吻合,完全被加号盖住即可:



其他四个一样的操作:(可以使用鼠标滚轴放大,用上下左右键微调)



最后如下图:可以按空格测试一下位移的效果



测试结果太快了,怎么办呢?只要按着Shift键选择关键帧,往后拖,间距大,则是放慢速度。



接下来做回弹的效果:

将时间指示器往后拖一点(具体自己试),每个功能图标上移一点位置,下图中圆圈中是最终位置,网上走一点是为了做弹力效果,每个图标依次做完:



按空格测试一下,我们发现位移动画是有了,我们接着做旋转动画,位置动画和旋转动画最好一起做,为了大家比较清楚,所以我们是分开做的。

首页把时间指示器移到0.3秒处,选中五个功能图标层,按快捷键R,大关键帧:



然后将时间指示器移到最远的关键帧处,输入1(旋转一圈),按空格测试一下



如果个人喜欢运动模糊,也可以自己添加,下图标红框处添加即可

如下图运动过程中有模糊的效果:



如下图



目前我就不添加了,添加运动模糊机子比较卡:

实现效果图如下图(省略了点击相机的步骤):

(0)

相关推荐

  • AE制作超炫LOGO动画

    第1步:在Illustrator里绘制图形 打开Illustrator,画布大小设置为800X600px大校创建出一个图形,这里我用的是Bridge的Logo,你也可以使用自己喜欢的图形,然后新建一个 ...

  • AE插件Form制作超炫的火焰特效

    AE制作超炫的火焰特效 操作方法 01 打开AE软件,新建工程,在工程上新建图层,把Form特效添加在图层上,把开形式改成球体. 02 把Y轴变高,一层球体就可以,中心点向上移,大致就可以,如图: 0 ...

  • PPT制作超炫酷的爆炸文字效果

    文字是PPT里重要的构成元素,为了让文字更加吸引观众的眼球,有时就得出点奇招,比如让文字“爆炸”,下面小编就为大家详细介绍一下,来看看吧! 图1 PPT文字爆炸效果 拆解文字 要想文字“爆炸”,首先要 ...

  • 巧用AE设计一套ICONS动效

    巧用AE设计一套ICONS动效.模仿追波大神MARKUS Magnusson 炒鸡简单,值得借鉴

  • 可牛影像简单制作超炫的支离破碎动感闪图效果

    现在,许多还不会ps,就认为制作不出那样非常动感的gif图片啦,今天呢小编就跟大家分享一下,利用可牛影像简单制作出动感支离破碎的效果,大家赶快来一起动手制作吧. 方法/步骤 1.首先,下载好可牛影像软 ...

  • 30个超棒的动效网站设计欣赏

    小编:今天给大家带来的是由设计之家分享的30个超棒的动效网站设计欣赏.无论是网站还是APPUI设计,适当的使用动效设计会使得你的界面更有吸引力,当然,动效的设计需要想象力,希望这30个动效网站能够给你 ...

  • 怎么使用AE制作酷炫的反相动画转场

    使用AE制作酷炫的反相动画转场,我们可以使用混合模式快速实现这样简单而又酷炫的效果. 操作方法 01 打开我们AE软件,执行:图像合成--新建合成组快速建立一个新的合成组. 02 我们将图像合成设置的 ...

  • 简单清新的动效教程

    还是先来看最终效果! 工具以AE为主,PS加以辅助就可以搞定. 涉及的知识点不多,主要有以下几点: 会PS的基本操作. 会些AE的基本操作,理解时间轴的概念并知道如何打关键帧. 知道AE的缓动曲线(还 ...

  • 怎么制作能量光效描边动效

    在AE软件中,用户能够使用预设的工具来制作动效,当然也可以在网上下载一些很牛的来直接使用,能量光效描边动效就是效果会自动对文本进行描边展示,很炫酷,下面一起来学习制作方法. 操作方法 01 进入电脑中 ...