动效原则
<b>舒适</b>：动效需要符合现实世界的物理属性，贴近用户的心智认知，感知上舒适、同时兼具视觉美感。
<b>高效</b>：高效响应并减少过长的位移和时间，使动效触达不拖沓。
<b>流畅</b>：不卡、不闪、不跳，帧率稳定、响应及时、跟手操作是动效流畅体验的基础要求
<b>统一</b>：同个产品内的动效体验感知统一，体现在相同的控件动效保持一致、相似的动效编排一致。
<b>简单清晰</b>：界面元素运动尽可能少且简洁，减少路径及不必要的元素，确保动效过程清晰、重点突出。
<b>克制有度</b>：控制出现频率，不增加额外操作，不干扰用户，确保动效有意义。
动效属性
变化
常见的变化类型有：位移、透明度、大小、旋转、3D 旋转...<br><br>
时长
复杂程度：复杂的动画比简单的动画需要更多的时间来表达
区域范围：动效运动在一定的范围内进行，小范围内比大范围的运动所用的时间相对更短
入场/退场：一般来说，退场的动效时长要比入场短，让用户更把注意力放在后续的内容中
曲线
加速曲线：适用原本在视线中的物体，需要消失或退场，逐渐加速符合退场行为特征，例如弹窗/浮层退出、卡片删除等。
减速曲线：适用原本在视线外的物体，需要出现或进场，逐渐减速符合进场行为特征，例如弹窗/浮层出现、页面进入等。
缓入缓出曲线：先加速后减速，适用于运动前后始终在用户视线范围内的物体，符合物体启动和停止的真实规律，例如图片缩放、tab 切换、开关等。
动效编排
淡入淡出
单向淡入淡出：在前后层叠的场景中，只有前景元素进行淡入或淡出动作，下方元素无变化。
交叉淡入淡出：存在退场元素与进场元素的场景下，一个淡入视野，另一个淡出。在整个过程中，会存在两个元素和它们后面的内容同时可见的时候。
错开淡入淡出：在入场元素淡入之前，将退场元素完全淡出。这种方式可以规避视觉上出现重叠元素，但是可能会造成有一瞬间出现容器内容为空的情况。
动效落地
转场动效的标注文档中需要包括以下要素：
动效 demo 附件：方便开发直接查看整体的动效效果<br>
触发条件：说明动效发生的条件，即用户通过什么行为触发该动效<br>
元素示意：将动效中发生变化的元素进行拆解，通过图示清晰示意<br>
变化属性：元素的什么属性发生，例如透明度、位置、大小等等<br>
动效时间：「延迟开始时间」表示元素从触发条件发生后延迟多长时间开始执行，「持续时长」表示该变化持续发生多长时间<br>变化值&贝塞尔曲线：描述属性具体的变化值范围，以及相应使用的贝塞尔曲线参
