在Google I/O的设计交流环节中,最常被问到的问题就是设计师如何将动效设计纳入到设计流程中。Googler们提到,虽然他们推荐使用AE,但是即便是他们自己也通常只是用它来完成小过度效果、加载过程以及图标转变效果。不过,他们还提到,他们最新的Polymer网络框架已经将Material Design的UI组件纳入其中。
简而言之,就是目前没有完美的答案。这也意味着,对于动效设计工具的开发者而言,这是一个绝佳的机会。
Polymer 能帮你编排出一些沿着特定路径运动的组件,或者一系列自由运动的动效。不过只有当你使用Material Design风格的组件的时候,效果会非常不错,但是如果想自己定制的话,就很难说了。
我曾经每天都使用 Framer.js 来打造我的交互设计原型。它基本上是一个JavaScript动画框架,所以你如果你对JS不熟悉的话还需要一段时间来了解它。不过,不同于其他的JS工具,对于网页开发者而言,Framer.js 非常容易上手。
Framer 在测试小交互或将几个不同页连接到一起上有杰出的表现,但是作为新一代的工具,它在管理编排、跟踪状态、控制拖拽和滚动元素上有这更多的需求。
同类型的工具还有Pixate,借助它,你可以使用简单的拖拽来制作原型,之后还可以在你的设备上浏览。不过这款工具没有网页端实时预览,目前开发进度也并不快。
我仍然在等待更加完美的动效设计和可交互原型设计工具。构建属于你自己的设计的过程中,你会仔细思考如何构建以及设计的界限;许多问题只有当你遇到了才会被意识到。当然,有一点是肯定的,只有当你把一个真实的原型摆在团队面前的时候,沟通才会更加有效。当你把一个可交互的高保真原型摆在眼前的时候,你就不用解释点击什么按钮出现什么效果了。
越多设计师深入思考动效设计,才能更快地促进真正靠谱的软件诞生,也更加有助于我们传达设计的意图。也只有这样才能促进更加优秀产品的诞生,解决更多棘手的问题。动效设计正在成熟,你需要掌控它。
“设计就是用你所掌控的一切,来尽可能清晰的与人沟通。”—— Milton Glaser
精彩评论