产品设计之网络异常设计

网络异常分两种:

一种是网络切换,如WiFi切换3g/4g网络,造成暂时性无网;

此种情况,已toast提示用户网络变化即可,对于流量损耗较大应用,建议以弹窗dialog形式提示用户,继续使用将会消耗流量,被运营商收取一定费用之类(此处三三对显示文字设计小小的佩服了一下,是运营商收费哦,不是我们app收的~虽然事实就是如此😆 )

第二种是网络彻底中断,如打开飞行模式或者无信号连接不上网络之类的;

此类型网络异常有三种方式进行应对处理:
1.如果在无网情况下点击进入一个新的页面,此时以整页无网页面提示较好,例如:


整页无网页面

此类无网页面一般包含三个元素:

  • 代表app形象的icon或图片;
  • 无网说明性文字;
  • 操作性文字或按钮:通常为下来刷新或点击按钮刷新当前页面。
    当网络恢复时,自动刷新当前页面。

2.toast提示
对于已经加载出来内容的页面,若网络突然中断,适当的toast提示,可让用户了解发生了什么而不那么突兀。通常toast提示语设置为1-3后自动消失。

3.参考资料中提到另外一种方式:预设图和占位符,个人觉得这种形式更像是预加载,若不加上无网络提示语,用户可能会觉得是一直未加载出来。

参考资料:

  1. 网络异常时,APP该如何设计?
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 172,908评论 25 708
  • [产品设计] [用户体验] 转载自:交互设计学堂 用户在使用App时会碰到许多特殊场景:网络异常、信息加载、页面内...
    CoverUER阅读 1,204评论 0 14
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,192评论 4 61
  • 我很高兴我有兴趣记录下我的小学生活,可以说是多姿多彩,当我刚升入小学的第一天,学校里除了老师,全是师哥师姐,我还是...
    幼稚的小时代阅读 347评论 2 1
  • 12 树虎的故事 阿挑过生日的时候,树虎爸爸妈妈送给了他一只他梦寐以求的吞吐箱。吞吐箱长得像一只大盒子,四四方方的...
    猜猜裁纸阅读 284评论 0 1