在AE中使用曲线，可以给运动物体添加缓动的效果，使物体的变化更符合现实中物体变化的场景，看上去不会那么生硬，增添了动效的趣味性，下面的文章中我会介绍几种不同的曲线，以及它们的使用场景。 速度曲线表示物体移动速度随时间的变化关系，横坐标表示时间，纵坐标表示移动速度速度。 在速度模…

现在，用户对于前端页面的要求已经不能满足于实现功能，更要有颜值，有趣味。除了整体 UI 的美观，在合适的地方添加合适的动画效果往往比静态页面更具有表现力，达到更自然的效果。比如，一个简单的 loading 动画或者页面切换效果不仅能缓解用户的等待情绪，甚至通过使用品牌 logo…

PS:为了简单也可以用视频，但除非动画的播放场景固定，不然移动端视频在不同app、不同机型、不同系统的播放显示都不太一样，容易踩不少坑。 不管采用什么方式来制作动画，最终呈现到前端页面的无非三种形式：canvas、div、SVG。 一般情况下，随着屏幕大小的增大，canvas将…

大多数设备的刷新频率是60次/秒，也就是1秒钟的动画是由60个画面连在一起生成的，所以要求浏览器对每一帧画面的渲染工作要在16ms内完成。当渲染时间超出16ms时，1秒钟内少于60个画面生成，就会有不连贯、卡顿的感觉，影响用户体验。 JavaScript：JavaScript实…

Chrome 72 已经进入了 beta 阶段。新增：公有类成员的声明和初始化、一些 DevTools 新功能（可视化性能指标、高亮 text nodes、复制节点的 JS 访问路径）等；废弃：页面 unload 的时候将不能使用 window.open() 打开一个新页面了，…

这是一篇旧文，旧博客停用，文章迁移至掘金重新发出来。 开发过程中经常有意无意地刻意避开数学相关的知识，你也知道解数学题非常枯燥无趣。平时写动画也尽量使用 css3 来实现，timer-function 随意选用，最多也就调一下 cubic-bezier，找到看着舒服的就行。但是…

一. 展示型动画 VS 交互性动画 展示型动画在实际使用的场景中，实现的方法很多，比如用gif图，canvas，css3动画等，但是最终输出的结果是不带有交互的，也就是从动画起始状态到结束状态一气呵成，这个过程用户可以感知，但是无法参与。对于交互性动画而言，我们可以在动画播放的…

以下内容由Mockplus团队翻译整理，仅供学习交流，Mockplus是更快更简单的原型设计工具。 在用户体验设计方面，App动画的设计和添加，带给设计师无限的创造空间的同时，也成为设计师群体最具争议的话题之一。而针对这一话题，本文将就如何通过移动端App动画设计，提供更加优质…