UI动态设计在网页中有哪些作用
新闻来源：优漫教育
日期：2021-07-22
那为什么我们要用动态效果呢？除酷炫和趣味性外，动态效果在用户体验设计中也发挥着重要作用。探讨了动态设计在UI设计培训中的应用。
1、引起注意。
人们自然会特别关注移动对象，所以UI动态效果是一种非常有效的吸引用户注意力的方法。IOS锁屏显示的动态效果是“滑动解锁”字样的高亮显示从左到右移动。尽管动态效果很微妙，但是仍然能够吸引用户的注意力。同时也指导用户滑行方向：
在用户点击safari的地址栏时，界面有三种变化：
这类动画的动作是键盘弹出。通过这种方式，键盘能够引起用户的注意，有利于下一步的输入操作。用动态效果提示用户操作，比传统的“点击这里开始”提示更加直观美观。hitmango中，游戏的开始界面，标题中的"go"也是开始游戏的按钮。这个游戏的设计者按下按钮，定期地提示用户点击。
2.提供反馈。
触摸屏幕上的虚拟元素没有按实体按钮那样清晰的触觉反馈。在这一点上，动态效应就成为一种重要的反馈。举例来说，在Android材质设计语言中，当用户触摸时，界面元素会呈现圆形波纹：如果IOS输入错误解锁密码，小点会前后晃动，模仿摇头动作提示用户重新输入：
有些动态反馈非常细微，但是组合可以传递非常复杂的信息。举例来说，我们每天见到但很少想到的动态效果就是IOS相机的焦点：这个焦距反馈实际上提供了相机三个状态的信息：首先，从里到外的焦距帧。这个瞄准动作是告诉用户相机正在尝试对焦：
随后，焦距框闪烁，表明焦距和曝光被锁定：
之后，焦点框消失，提示用户拍摄：
用不到3秒的时间，通过3个动画向用户展示了相机的对焦过程。
3、加强方向感。
在设计手机界面时，合理的动态使用效率，比如浏览图片、进入聊天室等等，帮助使用者建立好的方向感，就像合理设计的道路和路标能够帮助人们识别道路一样。IOS专辑的设计就是一个好例子：
在用户接触它之后，它会从列表中的位置放大。通过这种方式，列表中放大的照片与缩略图之间建立联系，用户可以确定打开的照片是他点击的照片。因此，单击“上一步”，照片就会缩小到列表中的位置，从而引导用户找到浏览地点：
若您没有按此比例调整动画的大小，但是从右边进出，您将无法连接到照片和列表：
在很多IOS界面中都可以看到类似于下文的内容的缩放，比如主屏的文件夹、日程表和应用程序切换界面：
4、传送深度信息。
除元素的位置和尺寸变化外，还可以使用动态效果来表示元素之间的层次关系。利用陀螺和加速度传感器，界面元素位移很小，产生视差效应，从而区分出不同级别的元件。比如，IOS主屏的视差效果：
这个效应是怎么产生的？组件距离萤幕越远，其运动产生的位移越大。同时运动多种要素时，会产生视差错觉。这个技巧经常被用在动画和水平滚动游戏中(比如超级玛里奥)。
在制作新闻H5专题片的时候，我们采用了类似的方法来让用户浏览新闻图片，就像观看立体全景图片一样。
5、总结。
这篇文章讨论了四种重要的动态效果应用场景：
透过上述案例及讨论，我们不难发现，动态效应并不能作为产品降温的手段，也不能成为产品的亮点。动态性是用户使用产品的核心体验服务。唯有设计出产品的核心体验，合理使用动态效果，才能充分发挥动态效果的优势。
