然之前做过一些界面动效尝试，但一直没有什么系统的方法和原则指导，大多在原型软件里凭「感觉」随意调调，或者找到一个竞品，借鉴竞品的动效规律，而说不清楚为什么要做成这样。
动效设计能解决什么问题？
动效的设计，首先得明确他被设计出来是需要解决什么问题，而不仅仅是【好看】【酷炫】
· 吸引用户注意力，提升点击转化
【这个按钮给我动一动、那个图片给我晃一晃】这些平时运营对你的banner提出的需求，就是商业需求最直观的表现。当业务上非常希望用户去点击某一个入口的时候，比起把图片做大做炸眼之外，增加一些【爆炸的特效】则是能提升点击率最有效的方式了吧。在一片静态的页面中向上滑动的过程中，突然出现一个抖动的按钮，就算是我家的猫猫看见都会想用爪子抓哪种按钮。
除了Banner可以使用动效来呈现，一些入口同样也可以使用适当的微动效来引起用户注意，提升点击转化，例如在个人中心的打卡、会员开通按钮。动静较小不会特别扰乱用户，但是足够引起用户的注意。
虽然吸引用户提高点击是个很重要的商业价值需求，但是也请尽量避免在一屏中出现多个动静相似的动效，这样只会分散用户注意力，降低所有动态按钮的点击，以及使用户感到困扰和不安。
苏宁APP的首页，在上半屏的空间里就集中了5个动态模块，其中Banner底下的两个活动页入口动态还分散在左中右三块位置。所有动态的频率也基本相似，用户实现无准确引导，是打开app的用户产生焦虑和困扰。是一个很好的动态过多的反例。
· 体验价值
1.告知用户将会发生什么
可靠的动效设计可以引导用户的操作浏览，给用户以明确的方向感，而不是对下一步该看什么、做什么感到不知所措。不论是iOS系统的动效设计还是Material Design，都严格遵循了这个规则。
iOS系统的大部分列表页面都会有左滑的交互，轻轻的左滑变会告知一些即将可以操作或触发的交互，例如删除，或者收藏。
上图的淘宝消息列表中，左滑出现了置顶和删除2个btn。在左滑到屏幕最左侧的时候，则触发了第二段操作交互，整条Label变红切【删除】滑至最左，告知用户继续左滑变回进行删除的动作，而不是置顶的操作。此时如果松手，则删除动作被触发，如果按住往右滑动，则取消了此操作。给了用户极大的可预知性和可操控性。让用户不会觉得莫名其妙和不知所措。
2.明确元素之间的层级关系
动效除了表现元素在界面上的位置、大小变化，还可以用来表现元素之间的层级和空间关系，例如在页面间的转场时、单个页面的元素服自己关系等。合理的动效能帮助用户建立很好的方向感和从属关系，就像设计合理的公路和路标能够帮助人们认路一样。
马蜂窝的全局转场动画便是模拟了现实中类似翻书的方式。采用带有纵深感的页面推移的形式。除了给到用户页面间流畅的切换感，同时清晰地让用户感知到页面间的层级关系。
3.在有限的屏幕中实现空间的拓展
在移动界面设计中，屏幕空间的合理利用是非常有必要的，通过折叠、滑动、缩放等形式，在这个有限的空间里做更详细的内容展示。
在合适的位置，对合适的板块做合理的空间扩展，可以大大提高单个页面的效率，提升用户的体验。
4.情感化设计，拉近与用户的距离
动效设计可以促进用户的情感体验，缓解用户的焦虑情绪、制造惊喜等。比如下拉刷新、页面跳转、注册成功或者第一次使用某一个app的核心功能的时候。激励用户的行为。
情感化的设计，不但能缓解用户焦虑情绪，制造用户惊喜。结合品牌的特性制作的动效更能加深用户记忆，提升品牌形象。
例如飞猪的下拉动画，飞猪的icon不仅仅是在空中悬浮，左顾右探的细节设计，表现了它在为你积极寻找的情感；
饿了么的页面跳转动画在早期的版本中，是一个饿了么的外卖箱，配上一堆飞入箱子中的食材，加深用户印象。现在饿了么已经是众所周知的品牌，品牌印象加深的需求减弱。现有页面上码表旋转的动画，更贴切用户在使用app时的一种情绪，拉近与用户的距离。
· 总结
狂拽酷炫吊炸天的动效，虽然能吸引眼球，但是不能解决用户需求的话则毫无意义。动效是为用户使用产品的核心体验服务的，合理使用动效能最大程度地发挥动效的优势。
