UI交互中用户体验的设计效果解析——w3cdream|前端学习-开发

'I'm W3cdream,创造',前·所·未·有
UI交互中用户体验的设计效果解析

发布作者:萧强   发布时间:2015-09-22   阅读次数:5032

2015年大小企业最注重的就是用户体验,手机也已成为大家使用最多的工具,如何让用户在手机上也拥有好的体验,是前端和设计师努力的目标,下边为大家收集了几种最实用和体验最好的UI交互特效。

提示性控件

提示控件让用户关注于上下文控制。他们在需要时出现,不需要时消失。当用户切换到一个特定的模式,提示控件可以通过动效进行一些新式的交互。滑动和淡入淡出就属于实现这个目标的最常用的动效。

提示性动效分类:

一.滑动删除

适用场合:当用户需要删除相关列表项。

动作描述:滑动列表项,滑入删除按钮。

一致性:双向滑动

优点:这是一个为删除对象提供直观交互的转场动效。滑动屏幕上的对象后,会出现一个按钮来确认这个动作。

用户感受:滑动列表项后,删除按钮像是被推入屏幕中。

二.模式切换

适用场合:当用户编辑相关列表时,需要一些额外的控件。

动作描述:切换模式时,移动相关项/标签,划入额外的控件

一致性:切换回普通模式时,将额外的控件移出屏幕。

优点:通过滑动引入新的控控件。通过移动项目/标签强调新控件的重要性。

用户体验:滑动列表项后,额外的空间像是被推入屏幕中。\

三.弹性刷新

适用场合:当用户刷新或更新相关的列表。

动作描述:这个功能在拉伸列表时出现,可以是在释放列表同时,或是将列表拉到指定位置时激活。

一致性:原文是覆盖刷新功能的动作应能取消刷新动作。我的理解是,例如下拉列表激活刷新,那么往回推列表时要能够取消刷新的动作。

优点:直观地与列表交互。通过滚动列表,直接在相关的列表下显示功能。

用户体验:拉伸列表时,直接在相关列表下显示功能。

四.显示控件

适用场合:用户激活/关闭视频播放控件。

动作描述:通过点击视频,显示播放控件。

一致性:通过点击显示播放控件/点击使控件消失。

优点:使用户专注于内容本身,而不必分心于播放控件。它只在需要的时候可见。

五.滑动式控件

适用场合:当用户需要激活触摸键盘。

动作描述:对象滑入,从而引入新的输入区域。

一致性:滑入-滑出。

优点:引入一个新的对象,该对象只在需要的时候可见。

用户体验:对象滑入屏幕。


本文有W3C梦想站整理:http://www.w3cdream.com/content-sort-10-article-488.html

常用昵称:萧强,全端布道者

姓名:“刘晓强”,W3CDream创始人,目前就职于易点付。专注于web前端和移动端方面知识的研究,熟练掌握photoshop和AI,喜爱Flat UI设计和Metro UI风格,熟练掌握CSS3+HTML5技术、LESS CSS和Sass CSS,还有jQuery框架方面及一些前端框架bootstrap响应式设计等。新浪微博
友荐云推荐

UI界面化设计

热点文章

新闻资讯

标签云

友情赞助