精细而恰当的动画效果可以传达状态,增强用户对于直接操纵的感知。
一、什么是动效及作用?
动效是物体空间关系与功能有意识的流动之美,它让用户更了解交互。
在 IOS7 官方 guideline 中,给动效赋予了一个新的定义:精细而恰当的动画效果可以传达状态,增强用户对于直接操纵的感知,通过视觉化的方式向用户呈现操作结果。
为什么现在的产品越来越注重动效了那?我们先从人对于产品元素的感知。
顺序来看?不难看出人们对动态的信息感知是最强的。
那么动效能给给产品设计带来什么好处那?
1.让体验更连贯:帮助用户理解界面之间的关系,缩短用户和界面之间的鸿沟。消除屏幕伤的跳变。告诉用户元素从哪来到哪去。
2.消化引导流程,降低学习成本:在最恰当的时机给用户有意义的引导。减轻认知负担,让体验更愉快。
3.空间扩展:让当下用户不需要的信息隐藏,适当的时机出现。
4.赋予设计趣味和活力:让错误不那么沮丧,让等待不那么无聊,让你的产品看起来更具活力。
二、动效是不是越多越酷炫越好那?
在平时项目中,我们有些设计师经常为了追求酷炫,生硬的在产品中展现。一个好的动效应该是自然,舒适,锦上添花绝对不是为了仅仅去吸引眼球,生拉硬套。所以要把握好动效的轻与重,先考虑用户使用的场景、频繁程度来确定动效的注目程度,其次重视整体性的编排。
下面我们来看一下经常在 APP 里面使用动效的场景:
开机启动图
强化产品品牌,动画短小。仅为简单变形,旨在突出产品 logo。因为开启启动图时间非常短,复杂的动画延迟了界面的过渡。
poplayer动画
强调惊喜,有创意的,有互动性的动(手淘的双十一活动)
界面之间切换跳转
帮助用户理解界面刚发生的变化,让用户知道自己在哪。例如页面之间的转场,弹出等。
扩展空间场景
强调关联性的场景,展开,放大缩小,翻转等。
强调状态
抓住用户注意力,也可以说是分散用户注意力,例如加载时,出错时等。
聚合入口
突出元素,增加情趣 (播放器播放暂停案件)
本文转载自 Think 体验设计公众号。
原文链接:https://mp.weixin.qq.com/s/AJneuIhv1UsUPlNk6ebaQg
评论