加载机制.pdfVIP

加载机制 加载机制 通常情况下，我们使⽤的绝⼤部分是⽹络App ，他的⼯作原理是这样的： ⽤户在客户端的界 上进⾏操作，客户端发送请求到服务器，服务器处理请求，返回 数据给客户端，并显⽰给⽤户。 其中，客户端和服务器的交互过程，⽤户是感知不到的，⽽他确实会耗费时间，在不 同的⽹络环境下耗费的时间也会有所差异，如何让⽤户在这段时间⾥有友好的体验 呢？这时候“加载过程”起了作⽤。 加载过程的关键可以总结为： 1.让⽤户感知产品正在努⼒为他运作。 2.让⽤户有基本的⼼理预期需要等待的时间长短。 3.让⽤户在⽆聊的等待中获得更多乐趣。 进度条是⼀个针对加载过程很好的设计。 动态的加载进度表⽰产品正在⼯作，总进度和当前进度能让⽤户及时了解情况，让⽤ 户能根据这些信息预判时间，有了⼼理预期。 有趣的进度条设计or在加载过程中展⽰⼀些功能介绍提⽰ （常⽤于游戏）能有效减少 ⽤户等待时的焦躁⼼理，也能有效地提⾼⽤户的容忍度。 进度条是web产品时代的产物，还有另外⼀种加载设计，就是加载图标。由于移动产 品请求的数据量并不⼤，所以进度条往往会在⼀瞬间就完成了，在这种情境下，简化 了加载的设计，很多移动产品转⽽使⽤加载图标来表⽰加载过程。 以上为两种⽐较常⽤的加载⽅式，下 将具体介绍他们与移动产品结合的⽤法： 页⾯加载机制 移动产品的信息都是通过页 来承载的，页 的加载⽅案设计是交互设计师 临的⼀ 个重要难题。 ⽅案⼀：单页⾯整体加载 这种加载⽐较简单，⼀般运⽤在页 内容⽐较单⼀的情况下，所以直接⼀次性加载完 所有数据后再显⽰内容。单页 加载失败的状态也⽐较好处理。 / ⽅案⼆：单页⾯分块加载 这种⽅案的特点是，能让⽤户逐步看到内容，在这个渐进的过程中降低⽤户的焦虑⼼ 理。其中又可以分为，模块间有关联性的，先加载⽗内容，再加载⼦内容，如优酷， 先把栏⽬加载出来，再加载各栏⽬的内容。 模块间没有绝对关联性的，可独⾃加载各⾃模块内容，根据请求的速度不同分别显 ⽰。这样处理有⼀定⼏率让⽤户在没完全刷出数据的情况下就能找到⾃⼰需要的功 能，如⼤众点评、淘宝客户端。 框架固定，内容更新的，可先把框架显⽰出来，再把各模块的数据各⾃加载显⽰，如 各种iOS ⾃带应⽤，云⾳乐。 这种分模块加载的需要特别注意加载失败的状态，毕竟每个模块都提⽰加载失败，点 击重试是很挫的⼀件事，可以根据信息的优先级来决定哪些数据失败了采⽤默认状 态，哪些数据采⽤失败提⽰。 ⽅案三：跨页⾯加载 ⽗页 ⼦页 or 同⼀app 内，页 间字段可以复⽤的，在加载⼦页 时不需要重新 加载新数据。 / ⽅案四：预加载 这种加载⽅式的特点是，在加载⼀个页 内容的同时，预测⽤户的下⼀步⾏为，并为 他下⼀步需要使⽤的页 加载内容，使得他在下⼀步的操作中能⽴刻获取信息⽽不需 要加载等待。 预加载提供给⽤户⽆缝的产品使⽤体验，使得⽤户在使⽤产品的过程中更直接流畅， 没有被打断的感觉。 具体的例⼦有： 在浏览图集的时候，当看到第⼀张的图⽚时，就⾃动后台加载第⼆第三第四张图⽚， ⽤户浏览完第⼀张图⽚切换到第⼆张时就不会有加载等待的过程。 在浏览新闻列表时，就把每篇新闻的内容在后台进⾏预加载，⽤户选择看某篇新闻 时，能⽴刻阅读到内容。 但是这种⽅案需要 临很多的问题，最直接的是流量问题，因为会⾃动跑掉很多⽤户 可能根本⽤不上的数据流量，所以⼀般情况下可以设定在wifi环境才 采⽤这种加载模 式。又或者设定加载规则，只把主要内容预加载，⽽部分次要内容可以在⽤户真的⽤ 到的时候才加载，例如预加载新闻正⽂的情况，可以只加载⽂本 信息，图⽚信息等到 ⽤户进⼊内页才加载。这种预加载与分块加载结合的⽅式也普遍运⽤在各个场景。 另外，预加载也需要时间的，他只是不在客户端显⽰给⽤户，默默在后台运作⽽已， 需要特殊考虑未加载完⽤户就使⽤到那些信息的情况，所以在做预加载设计时需要同 时考虑另⼀种适合该情况的普通加载⽅式。 预加载需要根据具体的场景来进⾏设计，设定好信息优先级，综合考虑各种类型信息 的具体⼤⼩流量，