最新消息:文章中包含代码时,请遵守代码高亮规范!

UI设计的异常状态【原创】

UI设计 Shirley 208浏览 0评论

在设计中,经常会被忽略的就是各种非正常状态页面的设计,例如:搜索结果为空、信息填写错误、无网络等等异常状态,我在做设计的时候往往是按照理想状态走下整个流程的,很多异常状态在使用中都很少出现,所以会经常被忽略,但我们却不能无视他的存在,并不是出现的几率小,就不需要去设计了,哪怕是千万分之一。

下面来介绍我所了解的一些异常状态,及其处理手法;有不足之处,欢迎指正

1、按钮

按钮我们通常都是给一个颜色+文字就ok了,经常会忽略按钮的其它状态;举例说明:

2、网络状态

网络良好的状态下,一般不会有什么问题;但也存在像网络不可用、断网、网速慢等情况;这时我们都应该给出相应的反馈,以防造成用户的焦躁状态

我们设计时一般采用缺省页提示或弹窗提示;举例:

 

3、空

空状态,一般在APP等应用刚开始使用时出现的比较多,比如说购物车、订单、历史记录、搜索结果等。

空页面的设计一般来说很容易处理,给出页面为空的状态;很多时候我们还应该给出指导性操作,以防用户出现迷茫状态;例如:

 

4、表单类

表单类一般存在的都是输入性错误,例如:密码错误、只能输入数字、必须包含字母、不能有下划线、该账号还没有注册、有必填项未填写等

在输入格式或者有未填写项时,我们要给出错误提示,并指出位置,提供正确的格式;避免用户迷茫;举例:

5、时效

时效性,通俗点儿就是有时间限制的意思,一般发生在验证码、二维码等,也有一些会员账号会有时效性。

验证码,一般超过时间点击重新发送即可

二维码,有点击刷新,下拉刷新;如果是电视的话,有的会有刷新按钮,有的是按“OK”键刷新

举例:

6、不可用

不可用状态,一般体现在信息没有填写完全按钮不可点击、选项不可选、账号过期、账号不存在等场景

7、服务器异常状态

服务器的异常状态,我们通常遇到的报错

处理方法一般是给出错误提示+返回,或者错误提示+重试

现在由于设计上对人机交互的重视,会把这些页面设计的相对有趣味性一些

 

 

注:部分图片来源于网络,侵删

转载时请注明出处及相应链接,本文永久地址:http://blog.meken.net/24573.html


pay_weixin
pay_weixin
微信打赏
pay_weixin
支付宝打赏
感谢您对作者Shirley的打赏,我们会更加努力!    如果您想成为作者,请点我

您必须 登录 才能发表评论!