左右划动交互动效-心动不心动-动效-UICN用户体验设计平台

恭喜你成为UI中国推荐设计师（详情）

快速搭建网站

查看全部热门榜单

全部

常用搜索：作品集 AE ui设计 aigc icon logo app

您的意见是我们 UI 中国进步的动力！

点击立即反馈按钮，发表您的意见！

立即反馈

QQ群反馈

您也可以加入UI中国官方反馈群进行反馈！

群号：302892100

备注：反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作，请填写需求表单，我们会在第一时间与您联系！

0/20

0/200

设计大赛

设计大赛
发布广告
发布招聘
其它需求

取消发送需求

提交完成
感谢您对UI中国的支持和信赖！

我知道了

左右划动交互动效-心动不心动

0.0°

2018-12-17 临摹练习 动效举报 1054 9 6 1

小草花心子关注

看了教程两遍才做出来刚开始不太理解那么多卡片是什么作用直到自己做出来才慢慢理解这个动效需要分析堆叠式卡片交互的应用场景理清堆叠式卡片切换动效的结构为动效添加细节抖动表达式提升体验

抖动表达式：alt+点击需要抖动的关键帧

freq = 3;
decay = 5;
n = 0;
if (numKeys > 0){
n = nearestKey(time).index;
if (key(n).time > time) n--;
}
if (n > 0){
t = time - key(n).time;
amp = velocityAtTime(key(n).time - .001);
w = freq*Math.PI*2;
value + amp*(Math.sin(t*w)/Math.exp(decay*t)/w);
}else
value