zwen

Zwen's Blog

自然而优雅的动效设计

       现在大多数App的转场动效都是使用技巧转场(通过形变和运动动效组合),页面的切换过程非常生硬,而且不自然。

       动效作为交互设计中的重要元素,不应该只是动态地呈现画面,而是应该将用户带入预先设定好的情节当中,使他们对于应用、对于内容有更好的理解,形成正确的心理模型,同时对视线流进行梳理,让浏览的过程更加自然。

       在天气应用中展示下雨概率,Yahoo!就做得很好:




通过一个流畅的动效告诉用户这是下雨概率,无需任何说明,直接基于对下雨的认知


Cook在引导界面和转场上都做得非常自然:

引导界面:






整个过程流畅而自然,通过对背景色的自然过渡来作为过渡处理,同时告诉用户每一个功能的作用。


转场动效:










整个过程非常的自然而优雅,背景色随封面进行渐变式过渡,点击封面后打开菜谱的同时进行分步式加载,减少用户对等待时间的感知,然后再通过渐变色引导视线聚焦到内容上。

(为什么国外的交互做得这么好!!!)


说到内容的处理,还有一个对内容也处理得很到位的应用(大家来感受一下):





非常日系,简洁明了,内容清晰,通过简单的色块搭配就做出了很好的阅读效果。


今天就先写到这吧

By zwen

评论