Web动效研究

来源：沈阳兄弟连IT培训学校时间：2019/11/26 8:59:53

　　随着CSS3和HTML5的发展，越来越多狂拽炫酷叼炸天的动效在网页设计上遍地开花。

　　根据的浏览器市场份额报告，IE6的份额已经降到了5.21%，这简直是一个喜大普奔的消息，做动效可以完全不care低端浏览器的时代已经在向我们招手了。

　　俗话说得好，颜值不够，动效来凑，Web动效已经不仅仅是网页设计的润滑剂了，它的功能更多的体现在了交互逻辑、视觉渲染和创新实践上，上能引人注目，下能潜移默化。

　　下面将通过经典的黄金圈法则来为大家讲解我们在B2B聚合页——1688首页项目上的动效设计，主要分为三个部分，动效设计的目的、方法和方案。

　　首先来一发大师金句，迪士尼动画大师乃特维克的毕生经验浓缩成一句话就是“动画的一切皆在于时间点和空间幅度”。

　　动效设计和做动画是一脉相通的，我们不是要做写实主义的动画，而是要通过时间点和空间幅度的设置为用户建立运动的可信度。

　　在设计开发的过程中，当设计师做好了一套静态页面而且设想出N种有趣的交互动画，再交付前端进行重构还原页面的时候。

　　由于无法提供的动态参数，导致沟通和制作的成本增加，而终的测试demo也差强人意。因此，我们在1688首页项目的动效设计中总结归纳出一套适于设计师表达动效概念的方法和流程。

　　动效设计目的

　　首先，为什么做动效，在动效设计的初期阶段，我们需要从业务和用户两个方面对对项目本身进行一个需求分析，从中得出动效在其中的作用。

　　业务方面是引导用户，层级信息展示，用户方面是页面过度，改善用户体验，动效设计的目的是为了自然流畅的呈现B类电商网站信息，并且，体现出专业和诚信的气质。

尊重原创文章，转载请注明出处与链接：http://www.peixun360.com/1791/news/111563/违者必究！ 以上就是沈阳兄弟连IT培训学校 小编为您整理 Web动效研究的全部内容。