移动端网页动画设计的方法有什么

    在现如今的社会中，我们大家不论是在浏览哪一个公司或者企业的网页，我们都能够发现这一个公司或者是企业的网页上出现的各种类型，各种特点的动画形式，这种形式下的动画被我们俗称为网页动画。由此可见，这种移动端网页动画设计，能够给我们企业的宣传带来效果，也能够让更多的用户体会到企业和公司的创意性元素。

    1. 挤压变形

    挤压装满水的气球后形变，这能展示其具有较强的弹性物体都存在质量，物体运动时的变形状态能反映其自身的刚性和弹性程度。例如书架椅子这类物体就具有较强的刚性，而衣服、树叶则具有更好的弹性。

    在移动体验中，利用挤压变形原则能够唤起用户的主观记忆。如果你想表达应用刚毅的效果，你就可以使用刚性的界面和图形，以及更加精准的动画，如果想要唤起用户对有机物的记忆，则可以使用柔软易变的界面，以及更加优雅柔和的动画。

    2. 状态

    右侧图片具有很好的状态释义性，清楚的表现了两个角色的对话状态;左侧的图片并没有很好的解释这两个角色的心理状态。描述状态能更清晰的表达网页动画的中心思想。在移动体验设计中，状态原则主要涉及到屏幕的切换，和用户界面的交互过程。通过界面中的颜色、亮度、组成元素和动画来引导用户合理分配注意力，可以创造非常流畅的移动体验，并且可以增强应用的易用性。

    3. 预备动作

    投掷保龄球前的甩臂就是一个预备动作。设计物体的运动都需要考虑这三个阶段：动作发生前的预备动作，动作本身，动作的结果。预备动作可以为即将发生什么动作提供线索和信息，例如棒球运动员扔球前的甩臂运动，弹簧的反冲动作等等。在移动设备的用户体验设计中，预备动作还可以暗示用户应用内元素的使用方法。现在很多移动应用的打开动画都是很好的预备动作案例。

    4. 连贯与关键帧

    上面那幅图片采用了连贯技术，即使用了每一帧画面来表现动作，而下面那幅则使用了三个关键帧来展示动画。为了捕捉快速而特殊的动作，经常需要从头至尾的绘制每一帧画面，这就是连贯原则。而关键帧技术则是绘制动作中关键点的画面，并采用补间来展示动画。移动端的动画设计大多采用关键帧技术来实现，这种技术比较简单，适用于展现简单的动作，而对于复杂特殊的动作，则可能需要使用绘制每一帧的连贯技术了。

    5. 缓慢出现和结束

    在动画的首尾增加更多的帧可以创造出更真实的效果

    无论是汽车还是短跑运动员，几乎所有的动作都需要一定时间来加速或者减速停止，这是客观规律。动画设计中经常会在动作的首尾，相对运动过程中，增加更多的画面帧。在移动体验设计领域，将缓慢进出的原则运用于滚动数据列表等微妙的动画时，都能很好更真实的用户体验。

    6. 顺势和叠加

    顺势可以描述物体运动时，不同部分以各异的速度运动(如小狗摇头时耳朵、下巴的摆动速度不一致)

    想像一只小狗左右摇头，它脸上松弛的肉也会随着头一起晃动。这就是动作的顺势和叠加。很少有动作是突然发生又突然停止的，一般都是逐渐停止，在物体的其他部分已经停止运动时，某些部分还在继续运动。而且物体的不同部分运动时的速度、动作都可能是不一样的，只有考虑到这些细微的差异动画看起来才会更真实形象。移动端的界面元素可以协同形成一个整体、叠加的动画效果，这些动画可以帮助用户理解界面元素和操作方法。

    以上给大家介绍的，就是移动端网页动画设计的相关原则了，除此之外我们的设计人员在进行移动端网页动画设计中，也应该要做好事前的前期策划，比如了解网页的动态特点，了解产品的特点，了解企业和公司的文化，在此基础上才能够进行移动端网页动画的设计流程。