动效设计(微交互)是未来情感化设计的方向,这个在我的其他文章有所提及,这里详细展开一下我总结的几个动效设计师需要掌握的原则。
记得你拿到IPhone初代机的兴奋么?(好像暴露年龄了 =))还记得开机的第一个Screen么?
IPhone 初代机
这里面就有一个当时的解锁屏幕的创新性动效,当然现在的解锁方式被生物科技所替代(面部识别,指纹解锁),但在当时,这个解锁方式是开创时代而且十分具有创新性的,即时放到现在也毫不逊色。
Slide to Unlock,怀念下帮主Steve。
这个不妨叫做可交互性动效,在拟物时代,这真的令人惊艳。
动效我们可以总结以下6个方向:
- 可交互动效
引诱用户完成某个操作
- 动态平面设计动效
动态壁纸等让画面更具生动感,气氛类动效渲染一种特定的氛围归类于此
- 情感化设计动效
对用户的操作进行情绪反馈,比如加入购物车,Loading,预加载等
- 人机对话类动效
用动效简介目前程序进行哪一步的操作,比如车辆检查的HMI动效,同时也是在情绪上安抚用户的等待时的焦虑情绪,因为主要目的是将抽象的检查形象化展示出来,所以归类为人机对话类,不准确请指正
- 转场类动效
指用户从一个界面切换到另外一个界面时的页面转换类动效,IPhone内置了很多转场类动效,调用也很方便
- 其他类动效
dribbble很多很漂亮而且很前卫的动效归类于此,例如VR类这些
那么这么多方向的动效,我们在进行动效设计时应该掌握什么原则?
抓住眼球
如果我们在做动效的时候,不能抓住眼球,我们会发现他基本上是无用的,因为我们动效本来就是UI设计的提亮,动效应该是整个视觉设计的亮点。
简单有效
简短有力,快速交代问题(特指在UI里面的动效,平面设计类动效不受限制)。这里没有一个特定的时间限制,但给出的建议是:
- 尽量简洁
- 尽量一个运动原则
- 尽量时长压缩到能看懂即可。
转场类特效要有仪式感
转场其实就是一个弃旧用新的过程,转场一定是一个阶段的结束,一个新阶段的开始,所以转场类特效一般具有仪式感的特性。
预言
What‘s next?
在等待过程中,用户对未知会充满期待感,甚至会有迷惑或者恐惧感,动效可以快速缓和情绪,消除不安感,让用户知道下一步操作,当然是很重要的。
现实模拟
别忘了我们的用户生活在现实客观环境里,结合使用情景对现实进行模拟,让用户快速进入角色。完成购买或者促销任务。
亦即在线上进行线下行为的模拟。
统一运动规律
这个是对第二条原则的深化,同一软件所有运动规律尽量统一,这样用户不会在繁杂的跳动元素里迷路。
本来还想加一些案例,但现在的动效设计其实大部分在探索和成熟期,就不放出来了,如果想看,可以去dribbble或者类似设计分享网站咯!bye!