最近自己公司的app遇到了数据加载的交互问题,于是想系统的把此类问题进行总结归纳,以备与朋友探讨,并不断的自我迭代。
app页面数据加载可大体分为上图的两种模式
1)先加载再进入页面:即提前将下个页面内容从服务器缓存到本地,打开页面后可全部展示。
2)先进入页面,而后进行加载:即先打开页面,再向服务器请求数据,进行数据加载。
现在常用的大多是2)的模式,因此我们今天分别分析六种种后者常用的加载方式,以及对应的使用场景
·全屏加载
·优先加载
·整页加载
·分页加载
·智能加载
·wifi缓存加载
一.全屏加载
顾名思义,即一次性将全部内容加载完成,全部加载前,页面暂无内容并用“小菊花”等方式显示。
优点:可保证单一页面内容的浏览连贯性
缺点:如果内容过多、或者遇到网络速度受限,将会极大的考验用户的耐心,造成很高的跳出率
应用场景:常用于手机网页的加载的情况下,可配合一个给人预期的进度条,或者有趣的加载动画来消减加载时间超过3s以上给用户带来的焦虑感。
二.优先加载
对于内容丰富,对网络环境要求较高的app网页加载,多使用优先加载的模式,即优先加载一部分内容,然后再逐渐加载其他内容。
优点:相较全屏加载,优先加载首先加载一部分内容,能够消解用户的等待焦虑情绪
缺点:有可能在第一时间丢掉抓住用户的关键点,在网络流畅的条件下,给人加载速度慢的印象,因此建议配合其他加载样式共同使用
应用场景:配图质量较高的feed流类内容网站、视频站等app常见样式。
三.整页加载
前后页面是整页切换时,多使用整页加载的模式,相对不是很常见。
优点:整体性浏览体验较好。
缺点:每页内容不能过大,否则导致单页加载速度有延迟
应用场景:多图浏览翻阅,9宫格图片查看
四.分页加载
内容丰富的app有多页持续加载的需求,经常用到分页加载的形式,分页加载又分为手动加载和自动加载两种形式,手动加载即需要用户点击下一页或者加载更多按钮,再进行继续加载操作、自动加载即每向上/下滑动时一定量内容时,有短暂的加载动画,然后继续加载下一个单位的内容。
优点:有“沉浸式”的体验感,加载体验也很好
缺点:不能精准定位到某项内容,容易产生迷失感(联想淘宝商品浏览的体验)
应用场景:信息流、商品列表等海量内容陈列界面
四.智能加载
智能加载即根据不同的网络环境,采取不同的加载策略。
优点:给用户跟贴心的网络服务
缺点:随着流量价格的减少,和各种包月流量套餐的出现,这种加载方式未必能命中用户的真实需求,还是需要配合网络设置功能综合使用。
应用场景:对于下载需求较高频的应用经常会用到此类加载,说到这不能不提网易云音乐的一个暖心设计,正常加载时加载到音乐发现首页,而网络情况较差,或者无网的情况下,则直接跳到我的音乐界面。
五.wifi缓存加载
对于大量流量消耗型软件,我们需要缓存到本地处理,让用户在地铁、室外等场景下可以无顾虑的享受互联网视频、音乐、音频等应用。
优点:追剧神器、多图杀猫啊!
应用场景:视频软件、知识付费等音频软件
结合以上6种加载方案,可根据不同的模块采用对应的加载方式。以后有更典型的案例和应用心得会持续更新。