当前位置:首页 > 网站建设

最全最好用的动效落地方法,都帮你总结好了(上)

时间:2018-09-03 06:32:02来源:网站建设作者:seo实验室小编阅读:142次「手机版」
 

帮站效果好

2. 引导用户注意力

如果把一个界面上的所有元素,按照明显程度来排序,显而易见我们会得到这样一个顺序:动态 > 色彩 > 明度。

所以通过合理的动效,可以低成本的抓取人的注意力,让他们关注设计师想让他们关注的东西。

网易新闻的刷新动画,就是一个很优秀的例子:

在这个例子中,左上角有一个非常简单的白色线状 icon,并不会干扰整个页面的主功能,颜色,以及视觉。但是通过小的动画,提升了 icon 的视觉层级。让我们很容易注意到它,起到了非常好的提示效果。

3. 情感化设计

情感话设计的目标是在用户接触和使用产品的过程中,激发用户的正向情感,比如愉快,信任,满足;避免用户产生负向情感,比如失望,挫折感,痛苦。正向的情感会使用户更乐于使用产品,遇到使用过程的一些小问题也更加包容。

而优良的界面动效可以打磨产品的品质感,下面就是动效在情感化设计中的优秀例子:

twitter 点赞后,心会亮起的同时,还有一个小小的礼花效果。虽然完全没必要加上这个礼花效果,但是这种丰富的细节会让用户对产品产生一个正向的情感关联,而这种关联最终将赢得用户对产品的认同。

facebook 点赞之后,可以表达你的态度,比如流泪,愤怒或者是赞。虽然在功能上来说,这些表情有静态的就可以了。但是正是动画中丰富的表情细节,进一步引导用户愿意去表态。不仅给人以惊喜,也显着的提升表态的使用量。

动效的价值就讲到这里,接下来,基于以上三点,我会说一说怎样去构建一个合理高效的动效体系。

二、优秀的界面动效体系

优秀的界面动效体系符合以下四点原则:

分享到:

栏目导航

推荐阅读

热门阅读