方寸指间——细节设计_加载

　　加载设计

　　每一次互动都是一次加载过程。要进入一个app，会有一个加载页面；要完成页面间的跳转，会有各

　　种加载策略；要显示各种操作结果会有各种加载提示。加载无处不在，它贯穿于用户的从未路径中。

　　所以加载的细节设计是设计师需要特别关注的，同时加载设计要考虑的原则有：让加载时间变得更加

　　有价值；让等后边的更加有趣；保持用户感受的连续性。

　　

 

　　启动页面加载

　　启动app需要一个短暂的过程，启动液的作用就是自然的过度这个过程。启动页一般以图片的形式存在

　　，配置Logo、口号、和出品方等元素，传递品牌和情感内容。也有一些app将启动页做成和首页一样，

　　给人的感觉是进入页面的速度特别的快。

　　在启动页之后，根据产品需求，可以在后台配置闪屏图片（或者视频）。由于闪屏是在后台可配置的，

　　所以可以定期更新，运营在各种活动或者节假日中

　　

 

　　页面间跳转加载

　　页面间跳转加载方式，可以根据内容情况分为当前页加载和进入页加载。

　　1、当前页加载：点击链接之后，在当前页面中提示正在加载处理，之后成功进入下一页。一般适合需

　　　  要处理判断的界面中，例如多部表单的设计。也适合在一些Web app 中及时的反馈加载信息，不

　　　  用担心进入空白页面，避免了无辜的跳转

　　2、进入页加载：点击链接之后，直接进入到下一页中，在下一页面中显示加载内容。现在大部分的app

　　　  正常路径都会使用这样的设计方式，给用户带来了极为流畅的感觉。进入页加载的方式，需要考虑分

　　　  步加载，优先加载框架和默认元素，让用户能够尽快的看到界面的基本布局和内容。

　　

 

　　分步加载/懒加载/预加载

　　界面内元素的加载形式多种多样，要根据内容需要而定，常见的加载方式如下。

　　1、分步加载：优先加载占用网络资源少的内容，例如框架、文字、默认图案，再加载占用网络资源多的

　　　  内容，这样可以让用户更快速的看到界面框架内容

　　2、懒加载：主要出现在长界面中，如无尽列表，用户可以不断的向下查看内容，达到某个点之后自动加

　　　  载内容，或者触发拉动后自动加载更多的内容

　　3、预加载：是一种提前加载的方式，例如在闪屏的时候提前加载首页的内容。还有对于一些表单，都可

　　　　以提前加载表单的步骤

　　

 

　　智能加载

　　考虑到网络情况，现在的智能加载一方面需要考虑加载速度，另一方面也要考虑流量问题。智能加载在设计

　　上有以下两种方式。

　　1、隐藏信息：在不同的网络情况下生成不一样的界面。在网络情况好的情况下，可以提供更多更长的界面

　　　  在网络情况差时，考虑流量和加载速度，可以只显示部分内容，将更多的内容隐藏起来，通过用户的操

　　　　作再显示

　　2、多套资源：主动判断网络情况，资源会根据网络情况做差异化处理。例如对于图片资源，可以根据网络

　　　  情况提供高质量和一般质量的图片。

　　

 

　　缓存加载

　　缓存加载是针对没有网络的情况下，让用户依然能够看到缓存在本地的游泳的信息，不会出现空白页面。它

　　解决了设计体验和观感上的很多问题，主要体现在以下几方面。

　　1、一般在主要界面上的处理都会使用缓存加载，避免在无网络时让用户面对一个空白的界面。

　　2、缓存加载可以有效的减少用户的访问流量，同时加快访问速度。特别是一些框架的频繁加载需要使用缓

　　　　存的方式

　　3、不能够无限的使用缓存加载，那样会让用户感觉app占用了大量的系统内存，特别是一些产生大量的图片

　　　　和视频的app，需要给用提供缓存清理的入口和上限的控制机制

　　

 

　　加载样式

　　常见的加载样式loading图标配置文案说明，它可以放在界面中的任何可见的地方。有直接覆盖在界面上方的，

　　也有半透明的toast，也有嵌入到界面内容中的。以下是常见的几种加载样式：

　　1、状态栏加载：一般系统默认配置loading加载样式。设计师也可以根据产品设计需要的样式直接覆盖在状态

　　　　栏上

　　2、导航栏加载：将导航栏标题临时变为加载信息，主要是文案提示

　　3、界面中加载：比较常见的有下拉式刷新、懒加载和toast加载方式

　　4、工具栏加载：一般比较少见，在IOS邮件列表中有这样的方式

　　

 

　　加载情感化

　　大部分的加载样式都直接采用了系统提供的旋转式loading。但如果能融入一些特别的设计，改变这种用户习惯

　　会有非常好的效果。将情感化的设计元素融入到加载样式中，让无处不在的加载时刻传达特色，让用户在等待中

　　感受快乐