浅谈app数据加载交互

      最近自己公司的app遇到了数据加载的交互问题,于是想系统的把此类问题进行总结归纳,以备与朋友探讨,并不断的自我迭代。


       app页面数据加载可大体分为上图的两种模式

1)先加载再进入页面:即提前将下个页面内容从服务器缓存到本地,打开页面后可全部展示。

2)先进入页面,而后进行加载:即先打开页面,再向服务器请求数据,进行数据加载。

      现在常用的大多是2)的模式,因此我们今天分别分析六种种后者常用的加载方式,以及对应的使用场景

     ·全屏加载

     ·优先加载

     ·整页加载

     ·分页加载

     ·智能加载

     ·wifi缓存加载

一.全屏加载


         顾名思义,即一次性将全部内容加载完成,全部加载前,页面暂无内容并用“小菊花”等方式显示。

优点:可保证单一页面内容的浏览连贯性

缺点:如果内容过多、或者遇到网络速度受限,将会极大的考验用户的耐心,造成很高的跳出率

应用场景:常用于手机网页的加载的情况下,可配合一个给人预期的进度条,或者有趣的加载动画来消减加载时间超过3s以上给用户带来的焦虑感。


二.优先加载

       

         对于内容丰富,对网络环境要求较高的app网页加载,多使用优先加载的模式,即优先加载一部分内容,然后再逐渐加载其他内容。

优点:相较全屏加载,优先加载首先加载一部分内容,能够消解用户的等待焦虑情绪

缺点:有可能在第一时间丢掉抓住用户的关键点,在网络流畅的条件下,给人加载速度慢的印象,因此建议配合其他加载样式共同使用

应用场景:配图质量较高的feed流类内容网站、视频站等app常见样式。


三.整页加载

          前后页面是整页切换时,多使用整页加载的模式,相对不是很常见。

优点:整体性浏览体验较好。

缺点:每页内容不能过大,否则导致单页加载速度有延迟

应用场景:多图浏览翻阅,9宫格图片查看


四.分页加载

           

       内容丰富的app有多页持续加载的需求,经常用到分页加载的形式,分页加载又分为手动加载和自动加载两种形式,手动加载即需要用户点击下一页或者加载更多按钮,再进行继续加载操作、自动加载即每向上/下滑动时一定量内容时,有短暂的加载动画,然后继续加载下一个单位的内容。

优点:有“沉浸式”的体验感,加载体验也很好

缺点:不能精准定位到某项内容,容易产生迷失感(联想淘宝商品浏览的体验)

应用场景:信息流、商品列表等海量内容陈列界面


四.智能加载


智能加载即根据不同的网络环境,采取不同的加载策略。

优点:给用户跟贴心的网络服务

缺点:随着流量价格的减少,和各种包月流量套餐的出现,这种加载方式未必能命中用户的真实需求,还是需要配合网络设置功能综合使用。

应用场景:对于下载需求较高频的应用经常会用到此类加载,说到这不能不提网易云音乐的一个暖心设计,正常加载时加载到音乐发现首页,而网络情况较差,或者无网的情况下,则直接跳到我的音乐界面。




五.wifi缓存加载

        对于大量流量消耗型软件,我们需要缓存到本地处理,让用户在地铁、室外等场景下可以无顾虑的享受互联网视频、音乐、音频等应用。

优点:追剧神器、多图杀猫啊!

应用场景:视频软件、知识付费等音频软件


        结合以上6种加载方案,可根据不同的模块采用对应的加载方式。以后有更典型的案例和应用心得会持续更新。

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

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,625评论 25 709
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 14,222评论 4 61
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,686评论 1 92
  • P1 缓存 Buffer 1. 创建缓存 2. 写缓存 buf.write(string[, offset][, ...
    慢清尘阅读 6,046评论 0 2
  • 刚完成一个百页大方案,过程很艰难,研究了几十份报告数据,推敲了近五条不同品牌推广线路,用了十几页A4草稿纸。完成后...
    罗民阅读 3,349评论 0 51