如何让你的交互动效更Q弹!

用户头像
深圳/设计爱好者/3年前/324浏览
如何让你的交互动效更Q弹!

非常好用的回弹表达式,赶快一起试试吧!

作为动效小白的我们总是羡慕那些大佬做的交互动效很细腻、很Q弹,而自己又不太会,除了通过针对性的深入学习来增强,难道就只能眼睁睁的羡慕别人了么?


NO,今天给大家分享一个“万能回弹表达式”的应用,让你的交互动效也能轻轻松松变得Q弹。


应用场景效果展示:



使用方法:


1、在AE里面创建一个新合成,随便添加一个形状作为演示对象,给该对象在0帧和20帧分别添加位置关键帧(位置关键帧快捷键:P),注意:0帧和第20帧的位置要不一样,可以适当位移一下,然后键盘按住Alt的同时+鼠标点击位置关键帧前面的小马表,即可展开表达式输入框。

2、复制红框内的万能回弹表达式代码,粘贴到已打开的表达式输入框内,不要按Enter键,要在表达式输入框以外的地方鼠标点击一下。

undefined

3、点击完后,查看位置坐标数值是否变红,是的话表达式即添加成功,点击预览按钮或者快捷键:空格键,进行效果预览。

4、如何取消已添加的表达式:键盘按住Alt的同时+鼠标点击位置关键帧前面的小马表,即可取消已添加的表达式效果。


如何调整回弹效果:


在不需要修改表达式代码的前提下,可通过动效对象执行时间长短来进行调整回弹效果。

执行20帧时长展示:

同样的对象,同样的动作,从开始到结束执行20帧的回弹效果;

执行10帧时长展示:

同样的对象,同样的动作,从开始到结束执行10帧的回弹效果;

对比展示:

将同样的对象,同样的动作,不同执行时长的两个对象放在一起进行对比,执行时间越短即速度越快,回弹效果越明显;执行时间越长即速度越慢,回弹效果越弱;

所以大家在应用“万能回弹表达式”的时候,可以通过执行动效对象的时长来调整它的回弹效果。


适用范围:位置、缩放、旋转;


应用场景效果展示:


探索:有兴趣的同学可以通过改变该表达式代码里的amp/freq/decay数值来调整回弹效果。

注意:该表达式尽量不要应用在真实项目动效中,因为添加了该表达式后,会造成动效体积增大,不利于真实项目展示,可以在自己练习作品中应用和研究。


“万能回弹表达式”已放在下方,可直接复制粘贴使用。

你还等什么,不赶紧去试试!


n = 0;

if (numKeys > 0){

n = nearestKey(time).index;

if (key(n).time > time){

n--;

}

}

if (n == 0){

t = 0;

}else{

t = time - key(n).time;

}

if (n > 0){

v = velocityAtTime(key(n).time - thisComp.frameDuration/10);

amp = .03;

freq = 2.5;

decay = 4.0;

value + v*amp*Math.sin(freq*t*2*Math.PI)/Math.exp(decay*t);

}else{

value;

}


10
举报
|
1
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
【新年UI图标】体育icon
高级表盘系列UI源文件
手表表盘UI系列
科技医疗透明柜UI界面设计
UI通用设计素材1
【新年UI图标】汽车icon
【新年UI图标】美食icon
UI界面 组件
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
【新年UI图标】钱包icon
新拟态风格 UI设计组件库
【新年UI图标】旅行icon
我的钱包-UI界面设计-app
高级感金属拟物 UI设计组件库
智能家居中心 简约 UI设计组件库
森系3D渐变流体抽象矢量UI背景图
3D卡通UI界面图标可爱插画免扣素
【新年UI图标】礼物/活动icon
【新年UI图标】活动icon
户外旅行飞机情侣假日出行
APP/小程序商业项目UI模板|99个高保真UI+79个原型
盲盒APP UI设计
【新年UI图标】积分icon
你可能喜欢
相关收藏夹
地产VI
地产VI
地产VI
地产VI
大家都在看
登录注册