最全最好用的动效落地方法(上)

  用户体验设计的发展日趋完善,优秀的动效是完善用户体验中不可或缺的一环,优秀的界面动态设计可以让产品的用户体验锦上添花……

  你会说,这些道理我都懂,但是动效做起来真的很麻烦啊。直接切入到大家常见的问题吧:

  一般情况下,在沟通界面动效的过程中,工程师会希望设计师使用更具体的表达方式。这里所谓「具体」的意思是:接近代码。然而同样的一套动效,在设计工具上和Web端上实现逻辑可能完全不一样。

  没有了精确的参数描述。设计师很难跟开发解释清楚要做一个什么样的动效。而只有简单的口头描述的话、开发做起来也很痛苦,导致最终开发效率低下。以至于知乎上出现了这样的问题:在APP的开发过程中,作为设计师,如何说服程序去实现动效?

  看到这里也许你会很抓狂。好消息是随着却越来越多优秀开源库的诞生,动效的实现也变得越来越简单。甚至以后设计师都不用说服工程师了,自己可以直接上手在端上实现动画了。举个例子Sanhttps://baidu.github.io/san/

  这个例子中卡片Hover动效的设计和开发都是我做的。

  

  好的动效要控制在0.3~0.5秒,本例中,菜单出现几乎花费了一秒。频繁打开菜单很容易引起人的疲倦,可以说是画蛇添足了。

  小结

  上篇就讲到这里,本篇里面我们了解了界面动效的价值:

  满足用户心理预期

  引导用户注意力

  情感化设计

  也接触到一下优秀的界面动效实例:

  通过动效暗示二维界面暗含的三维层级关系,及其暗含的操作逻辑。

  引导用户的注意力向界面重点元素。

  通过动态设计让情感化设计变得更生动。

  动效的视觉效果统一,控制数量,不滥用。

  在下篇中我会讲讲有哪些便捷的方式去实现这些优秀动效。其实我们平时看到的那些天花乱坠的效果,背后涉及到的设计参数非常简单,只有三个。敬请期待吧。

 

 

更多关于云服务器域名注册虚拟主机的问题,请访问西部数码官网:www.west.cn

赞(0)
声明:本网站发布的内容(图片、视频和文字)以原创、转载和分享网络内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-62778877-8306;邮箱:fanjiao@west.cn。本站原创内容未经允许不得转载,或转载时需注明出处:西部数码知识库 » 最全最好用的动效落地方法(上)

登录

找回密码

注册