APP加载

不经意发现今年已经写了近50篇博客。先前使用Lofter,但网站经常不稳定,便转移到简书。精品太少,更多的是自我记录、梳理思路,希望此后更用心书写。绘事后素,切磋琢磨。

LOFTER网址:1、产品分享;2、JerryMa


分享一篇之前的博客,全文如下:

APP加载

出现APP加载的页面分为三大类:下载/安装页、启动加载页、内容加载页。

一、下载/安装页

二、启动加载页

1、固定的加载页

用于展示品牌形象,重复出现,增强记忆

微信.png

可优化点:

A 与首页保持视觉延续性

B 使用动画效果

C 展示乃至告知进度

京东.png

2、调整的加载页

节假日定制、活动定制、不同版本定制

三、内容加载页

内容加载页中,常见的加载方式大致有5种:

1、全屏加载

全屏加载就是整个屏幕白屏进行加载


如Zaker加载热点视图时:


微博加载好友关注动态:


2、优先加载

优先加载使用户不间断去接触信息,以渐进的方式进行加载。文字的加载往往优先于图片。优先加载要求内容需要按重要性排序,另外要求相比子内容,优先加载父内容。


Lofter搜索页:


ZAKER频道信息页:


3、自动加载

自动加载适用于瀑布流、长列表内容的页面,设定每隔10 or 20块内容加载一次。PS:优点是吸引用户浏览更多内容,缺点是迷失位置,故常常加上一键置顶的功能。


如微博首页:

4、智能加载

当网络环境不好(无WiFi、弱网),需要简化处理图片、动画、视频传输数量大的组件的显示方式,以此控制整体的加载速度和用户消耗的流量。这种根据网络状况智能调整的加载方式,称为智能加载。


5、离线加载

当APP处于无网,特别用户处于地铁等环境时,许多内容不可见、功能不可用。这种设计会让用户产生挫败感。优化方向是采用预加载和离线缓存。



下图为ZAKER的离线加载功能:


特殊情况:页面中下载内容,给出相应下载进

四、加载优化

当能保证加载结果,即能够显示页面,加载的优化在于用户体验。

从情感角度,APP加载对用户来说,即意味着等待,等待则产生焦虑、失落。优化方向:A、结果导向:减少加载时间(性能层面)或让用户感知时间且感觉耗时少(感觉层面);B、过程导向:让用户忘记时间、享受过程。

具体优化方法,包括:

1、预加载

所谓预加载,就是提前在后台加载下一步可能浏览的内容,不在前台展示。这样保证了用户浏览内容的顺畅无阻。预加载常应用于瀑布流。对于图片的预加载,其过渡效果就是图片由模糊变清晰。

2、模态加载可取消或采用非模态加载

模态加载的一个优化方法是提供取消加载的功能,否则一直加载又无法查看内容,会让用户极不耐烦。

采用非模态加载是更好的选择:


Line的通知加载:在通知项中加载,不影响阅读上下内容


3、告知进度

常见的有进度条和活动圈,分为显示和不显示百分比。
下图为浏览器常见的设计:


4、情感化的动画设计

用动画效果吸引用户,乃过程导向,旨在不产生等待的焦虑
下图为零售/生鲜电商的场景化设计:


参考:
1、浅谈移动端App的页面载入方式
2、App6种常见的数据加载设计
3、从app加载页面说开去
4、3种常见的移动APP页面加载设计方案优缺点

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容