怎样的APP loading设计更讨用户欢心

用户在浏览网页时,由於网络原因可能需要花费一定时间才能加载完成,这个时候就要用到loading加载机制,告诉用户网页正在努力为您加载数据,请稍安勿躁。好的loading设计能减弱用户等待网站加载的焦虑,不合理的loading设计则会让用户产生厌恶感。下面,我们就以app为例,介绍怎样的loading设计更讨用户欢心。

数据加载的几种形式及对应的交互设计

1.标题loading

怎样的APP loading设计更讨用户欢心

大多数通讯工具软件都是采用这种形式,由於聊天列表页的聊天记录是储存在手机本地的,所以页面内容一般都不为空。这个时候,app加载无需获取用户的视觉焦点,只要告知用户页面正在请求新数据即可。所以选择在标题栏展示app正在加载是个不错的选择,加载成功标题栏loading小时,如果因为网络错误未链接服务器,则在标题栏显示未连接状态。

2.白屏loading

怎样的APP loading设计更讨用户欢心

当页面内容比较单一,加载时间较短的可使用白屏loading,而这多数会出现在H5页面中。然而现实中已经很少产品会采用这种loading设计,大多数产品采用无限循环的小菊花、单进度条或有趣的动画设计,这样更能减轻用户等待时的焦虑感。

3.优先加载

怎样的APP loading设计更讨用户欢心

当页面同时具备文字和图片时,由於图片会比文字所需的加载时间要长,所以往往会先加载文字,图片在加载过程使用占位符,直到图片加载成功。另外,如果加载的页面内容有固定的框架时,可以先加载框架,再加载框架内的内容。通过先加载页面框架或设计占位符等形式可以减少用户的心理等待时长,提高产品体验。

4.Skeleton Screen

怎样的APP loading设计更讨用户欢心

这种加载形式你可能没听过,但一定见过。它是一种将未加载出来的内容区域,用灰色色块填充的方式。所以会令整个页面在加载过程有一种连贯的感觉。这种形式一般用於内容框架固定的页面,如果页面出现空数据的情况下则不宜使用。

5.下拉刷新加载

怎样的APP loading设计更讨用户欢心

Twitte当年提出下拉刷新,并被广泛使用,让用户能够手动对当前页面进行更新,加载的loading样式可以做进一步的设计,例如:将loading动画和下拉手势结合起来,增加趣味性;把loading做成笑脸,赋予产品人性化设计等等。

6.分段加载

怎样的APP loading设计更讨用户欢心

当新页面的内容有很多的时候,如果一次性加载所有内容,就会有可能出现增加设备的负担,延长加载时间、app运算成本太高而崩溃等等影响用户体验的问题。所以,为了解决这一问题,可以采用分段加载形式,即先加载最新的几十条数据,当用户继续向上滑动想浏览更多内容时,再加载几十条。

7.智能加载

怎样的APP loading设计更讨用户欢心

当网络状态不好时,可以考虑加载低质量的图片,当网络良好时,则加载高质量的图片;同理,当用户使用蜂窝数据时,显示占位符而不显示图片,当使用wifi时则直接加载图片。这些设计方案都是站在用户的角度去想,为用户带来价值,从而让用户真正喜欢上这个产品。

作为产品设计人员,不应该把视野局限在人与客户端之间的交互,而应该站在用户、客户端和服务器的角度去思考产品,只有这样,才能设计用户体验更好的数据加载方案,而不会有失偏颇。

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/40259.html

如有侵犯您的合法权益请发邮件951076433@qq.com联系删除

(0)
Inspirr的头像Inspirr订阅用户
上一篇 2022年6月9日 23:06
下一篇 2022年6月9日 23:06

相关推荐

  • 移动端设计如何保持美学一致性?

    美学一致性是移动端设计尤为重视的原则之一,尤其是产品界面设计。因为它能够很好地呈现给用户产品的视觉效果和交互行为是否整合、和谐。 界面设计在元素和内容上,能够整体上标准化,尤其是用户可预知的交互行为,…

    2022年6月7日
    0147
  • 贴心!两招解决移动端输入难题

    词典不够智能时关闭自动纠错 很明显,对於低效的自动纠错功能只会对用户体验有挫伤的功能。常见的自动纠错多用於单词缩写、街道名称、邮箱、人名以及一些不在字典的单词。若然词典不够智能,最好不要使用自动纠错功…

    2022年6月7日
    0153
  • 移动端使用下拉菜单有局限性却还受欢迎?

    移动端的页面设计采用下拉菜单样式,会暴露不少的可用性问题。但是,尽管如此也不能就此在页面设计中拒绝下拉菜单样式。其实选择任何一种菜单设计的样式,都容易出现一定的问题。所以,问题的出现不是拒绝它们使用…

    2022年6月7日
    0174
  • 刚上架的APP要怎样才能做好ASO优化

    现在,越来越多企业都做APP开发,希望能在市场上占有一席之地。本以为开发後上传到APP Store,经过严厉的审核就能万事大吉,谁知道,一场没有硝烟的战争才正式开始。刚上架的APP要怎样才能做好ASO优化?就等Inspirr …

    2022年6月13日
    0142
  • 关于app制作流程与费用,APP原型图制作流程。

    APP制作流程与费用: APP的制作流程可以分为以下几个步骤:需求分析、设计、开发、测试、上线和维护。 1. 需求分析:这是APP制作的第一步,需要明确APP的目标用户、功能需求等,这一步通常需要与客户进行深入的交流…

    2024年7月3日
    00
  • 13岁的Facebook保持快速成长的关键因素是什麽

    如果从企业的成长维度来看,13岁的Facebook持续保持快速成长迭代的能力确实值得令人称道,那这其中的关键因素是什麽呢? Mark Elliot Zuckerberg 最不能忍受公司放慢脚步 「Move fast and Break things(快速行动,打…

    2022年6月9日
    0133
  • 两步找出用户痛点  

      第一步:通过用户当前需求去挖掘机会点 通过列举场景可以掌握到场景的描述,从而进行分析用户在当前场景的需求,然後去挖掘出潜在的机会点。具体例子如iOS系统接电话,有两种场景:非锁屏场景与锁屏场景。非…

    2022年6月7日
    0143
  • 盘点目前最新出且受欢迎的前端设计新工具

    网页离不开设计也离不开前端的实现,随着 Apple、Google 等科技企业的开发者大会到来,部分科技龙头企业旗下产品相关的新资源逐一放出,以解决目前网站的特定需求。现在,Inspirr Creation推荐一些正在兴起的前端设…

    2022年6月25日 建站资讯
    0165

联系我们

QQ:951076433

在线咨询:点击这里给我发消息邮件:951076433@qq.com工作时间:周一至周五,9:30-18:30,节假日休息