查看 63 | 回复
如何利用动效提升用户体验

魏华
活跃积分 1173

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里


来源:UI中国


Image title


 


        图片来源:Barthelemy Chalvet


 


如何利用动效提升用户体验


 


动画可以讲述故事。不是很长很复杂而是很简单的故事,而像是 "嘿,你现在要看看这个!" 或 "哇,你竞争成功了!"。然而,动效的目的不是娱乐用户,而是帮助他们理解发什么什么事,或者如何有效的使用你的软件。在Zurb的叙述中很清晰的表明了:


我们不再是设计静态的屏幕,用户将会从我们的设计中看到实际的内容。


 


动效可以广泛用于统一美感和功能的平衡,它可以影响行为、沟通状态、引导用户和帮助他们查看自己行为的结果。下面是一些例子,是在一些方面可以增加动效改进UI的经验:


 


加载不再无聊


 


如果你不能缩短加载时间和无聊的旋转图标(基本上只是提醒用户正在等待),那么可以用动效代替等待的时间,应该尽力让等待变得更加愉快。几乎任何网站或者app会利用屏幕的线框图上微妙的动效让用户在等待期间参与进来。


Image title


        屏幕线框图在内容完全加载之前完成UI。图片来源:tandemseven


 


不能削减设计状态的变化


 


动效可以使转换更加明显,用户明确知道开始到结束发生了什么。一个好的过渡设计会让用户清楚的理解他们的注意力应该在什么地方。


 


Adrian Zumbrunnen上有个很好的滚动动画的例子,当用户点击一个链接时,帮助用户联系上下文。只是一个普通的静态页面感觉会很生硬:


 


Image title


        直接切换感觉很不自然,用户很难接受这种变化。图片来源:smashingmagazine


阅读全文>>

赞 0 1楼 2016-11-14 10:20

 
发表回复
您需要登录后才可以回帖 登录 | 注册