怎样的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)
InspirrInspirr订阅用户
上一篇 2022年6月9日 23:06
下一篇 2022年6月9日 23:06

相关推荐

  • 网页设计和APP设计技巧:加载动画设计需考虑哪些内容?

    如今,越来越多手机应用程序和网站争相出现,用户对产品质量的要求也越来越高。对大多数用户而言,优秀的产品自然能快速满足他们的各种需求。 例如:网站加载时间延迟2-3秒,用户会以为这3秒加载延迟是个Bug,事实…

    2022年6月25日 建站资讯
    0126
  • iOS 11在iPad的UI设计中有哪些改变

    上期,我们说了iPhone iOS 11与iOS 10的UI交互设计上的区别,这期我们就来说说iPad的UI设计有什麽改变? 其实,这次iOS 11系统除了给iPhone带来不少改变,在iPad上的表现也算是非常惊艳,尤其是在交互设计方面。 改…

    2022年6月12日 建站资讯
    0191
  • 用户体验的两大黑名单

    1、 没有根据平台性质去匹配相同的图标 界面设计项目如今不再是只在某个平台上呈现,所以需要为多个平台提供成套的图标,如功能类型的:新建、分享、发布、保存、删除等图标。要注意的是,当你在移动端的页面设计要…

    2022年6月7日
    0136
  • 启动页和空状态的设计需把握什麽?

    启动页:当用户打开你的APP界面时,若需要用户等待的话,那麽用户体验自然会受到影响。不妨学习Google和Apple,使用启动页以此来让加载速度提升,以此服务於用户体验,启动页的作用是告知用户他们的点触界面这个动…

    2022年6月8日
    0145
  • 网页设计技巧:如何利用网页header增加曝光度

    如何利用网页header增加曝光度?在这个遵循极简主义风格的时代,华而不实的内容往往令人厌恶,但有时网页设计过於简单又难以吸引用户的眼球,因此网页的header设计就显得十分重要。 什麽是网页header? 网页header就…

    2022年6月25日 建站资讯
    0177
  • 网页设计规范:设计网站需要添加弹窗吗?

    网站是否加入弹窗框,应该是很多站长犹豫不决的事情。一方面,弹窗框的出现,在某程度上会降低网站的用户体验;另一方面,弹窗框又会给网站提升网站转化率。那麽,网站设计时需要加入弹窗设计吗? 网页设计规范 网站…

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

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

    2022年6月7日
    0155
  • 输入体验提升,键盘匹配

    移动设备虽然屏幕尺寸在变大,但浏览和操作以及没有桌面端那麽自由。阻碍用户体验的常见问题,当然要数输入。如何有效地提升用户输入体验并不难,比如自动给予用户进行键盘匹配。 简单来说就是每当用户点击到某个输…

    2022年6月8日
    0135

联系我们

QQ:951076433

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