APP中提升产品体验的预加载功能的几种表现形式！

什么是预加载图？就是在当用户开启APP的之后还没完全加载出来之后，在客户面前所展现的内容信息，这些画面是提高产品体验的一个环节，今天就来看看那些画面下表达形式!

共有几种类型

预计加载过程中体现方式有加载等待(转圈动画或其它GIF动画)，加载历史缓存数据，提前读取一半，逐步加载，后台提供默认加载图，当然也有加载失败场景。今天我们此处只探讨预加载中的Content表达形式，我预测提炼了几个常见的视觉表达形式：

1.显示品牌元素

2.色块

3.布局

4.默认灰色图

5.空白展示

6.使用高斯模糊

1.显示品牌元素

它是哪个？在加载过程中，会预先在用户面前展现出来一些图像元素，通过LOGO以及相关界面来表达，给客户一种后期的心理预期要展现的大概内容。

解析：

1.优点是能提前预期所展现的内容，品牌认知能力强，用户记忆强，一看就明白是哪个内容。

2.缺点是适配麻烦，不相同式照片都必须切图，增加APP包大小，安卓还必须单独切点九图片来适配等等，有些人必定会问，安卓为何就不能切整张图啦?哈哈你可以试一试，如果你想大家包大小超大的话。

2.色块预览

什么是色快预览？就是在加载过程中，会预先在用户面前展现出来一些线条元素，这种做法方式是:直接读取图片的形状，取哪些材质?大致是照片中的主风格，面积大的者读取图片平均色，当然后台需要有一个超强色库来支撑且必须提供一种以及2种默认颜色，因为减少取色失败，目前这种做的产品有小米音乐、Pinterest、Twitter、花瓣移动端等等,当然苹果音乐加载不起来是直接提供默认的logo色块。

解析：

1.优点是图片适配非常便利，全端呈现形式提供一套色库就能，画面不枯燥，韩国诸多app或者Pinterest都是很好的案例

2.默认色板库颜色要高级，饱和度低，如果处理不好，多个展现效果会很差

3.布局加载

什么是布局加载？就是加载过程中，会预先在客户面前展现内容布局大致样式。

解析：

使用布局加载实现是非常简洁的，全端适配简单。

4.默认灰色图

它是哪个？在加载过程中，会预先在用户面前展现出来一些黑色图像元素。

解析：

特别表明下Twitter是运用的两种表达形式，一种是提供默认蓝色图，一种是照片取色，一般绿色值运用#F2F2F2，优点画面干净，适配简单，这里说明下，可以开发写，可以我们自己提供，但是推荐我们提供，免得增加累赘代码。

5.空白显示

它是哪个？在加载过程中，不发生任何占位符，直接负型空间展示。

解析：

1.这二者虽然都有两种表达形式一种是这样空内容，一种是提供红色默认图，只是所在场景不一样。

2.缺点是即使网速非常慢，半天加载不起来，用户造成焦略心理，以为软件BUG，不推荐使用。

6.使用高斯模糊

它是哪个？在加载过程中，会预先在用户面前展现出来一些图像元素通过高斯模糊来表达。

解析：

1.通过把预加载出来的照片进行高斯模糊处理，Instgram也是采取提供黑色图和高斯模糊两种形式，好玩有趣。

2.缺点是高斯模糊会有一定的性能，加载慢，不建议使用。

设计策略

通过以上预测在做默认加载预览过程中推动模式推荐有下列几个方法，根据自己产品传统采用适合的表达形式

1.显示品牌元素

优点是能提前预期所展现的内容，品牌认知能力强，用户记忆强，一看就明白是哪个内容

2.色块预览

个性年轻，适配简单，不枯燥

3.布局加载

使用布局加载实现是非常简洁的，全端适配简单

4.默认灰色

一般灰色值采用#F2F2F2，优点画面干净，适配简单

5.空白显示

最不推荐一种方法，会像页面有bug

6.高斯模糊

提供默灰色底图和取色混搭，高斯模糊和白色地图风格，有特色，新鲜感。

现在一个简单的分享，希望帮助设计中，做任何设计之后都有探讨，能把握这个设计的规律，这样我们在做设计决策之后变得有理有据！