本文将以一个列表页到详情页的动效作为案例来帮助描述。
开始动效创意之前，先普及一下动效的基本原理。
大部分移动动效，都可以基于以下5要素进行分解：
1 移动Move：改变元素位置；
2 缩放Scale：改变元素大小形状；
3 旋转Rotate：调整元素角度；
4 透明Opacity：调整元素透明度；
5 起始Timing：定义元素出现（消失）时机。
比较复杂的形变动画，在分解足够细的情况下，也可以看成是以上要素的组合。最著名的《迪斯尼的12条动画原则》中提及的动画原则，都是以上5要素的不同搭配。
拓展阅读： http://www.smashingmagazine.com/2012/10/30/motion-and-animation-a-new-mobile-ux-design-material/
该步骤中，最重要的就是将动效构思表达出来。 比如，像我这样，先以草图的形式将动效分解：
然后，把草图中的动效要素编排到时间线中，以下为本文所用案例的动效Timing示意图：
1、如非特殊说明，本站对提供的源码不拥有任何权利，其版权归原著者拥有。
2、本网站所有源码和软件均为作者提供和网友推荐收集整理而来，仅供学习和研究使用。
3、如有侵犯你版权的，请联系我们，核实后，本站将立即改正。
还没有评论，快来说点什么吧~
