加载加载设计,用户界面设计_都很注重这个小细节

发布时间:2020-06-21 10:10:00

优秀的品牌号、其新产品的合格证和内部测试邀请码都在这个号码里,注意推动和把握动态,并有机会在_时间获得。

优秀的品牌号、其新产品的合格证和内部测试邀请码都在这个号码里,注意推动和把握动态,并有机会在_时间获得。

不管你的界面设计得有多好,有时用户不可避免地会遇到加载时间。加载时间会影响用户体验,让用户等待太久会让他们失去耐心。一旦他们有这种感觉,他们可能会切换到另一个网站或应用程序。幸运的是,我们有一些设计技术可以让用户有更好的加载体验。

如果用户当前的网络状况不是特别好,加载页面的时间会更长。用户对等待时间的感知是从按下按钮开始计算的,因此坏的情况是没有反馈来告诉他们系统是否收到了他们的指令。如果你的设计没有对操作的反馈,用户通常会觉得自己的操作不成功,所以用户会不断尝试,浪费时间做很多无用的操作。因此,为了让用户感到快乐,设计师必须通过视觉反馈给出提示,告知用户内容正在加载。

静态进度提示是指静态单词或图片,例如“loading…”或“please wait…”。不要使用这样的静态提示来通知用户系统已收到指令。尽管总比没有好,但是静态进度提示是一个糟糕的用户体验设计。用户不知道内容是否正在加载或页面是否卡住。

心理学研究发现,没有反馈,用户的注意力会在一秒钟内转移到另一个地方。为了避免这种不确定性,对于任何超过1秒的等待,_使用动态加载提示。不过,需要注意的是,不建议在一秒钟内完成,因为当用户看到眼前突然闪现的东西消失时,会感到焦虑和不安。

短时加载:使用无限旋转小指针

简单的加载动画是不断旋转的指针。这个动态提示清楚地告诉用户他们需要等待,但它不告诉他们需要等待多长时间。一般来说,这种方法可以在加载时间相对较短(2-10秒)时使用。

加载旋转指针通常与下拉刷新动作一起设计。当两个UI界面的状态被切换为让用户知道页面正在改变时,它被用作一个提示。

长加载:使用百分比动画

加载旋转指针不适合长时间加载过程。如果一个操作需要很长的加载时间,_让用户知道具体的进度。通常,对于超过10秒的等待时间,_使用动态进度图表的百分比来显示加载过程。

您还可以告诉用户需要多长时间。它不需要非常准确,例如“这个过程可能需要一分钟”,您可以提示用户并鼓励他们耐心等待。

当你想设计一个更快的用户体验时,你可以尝试减少用户感知的时间,即使加载时间仍然很长。你可以使用有趣的内容,或动画,或与用户互动。

进度条可以让用户估计加载速度,因此进度条的动态设计会影响用户对加载时间的感知。为了让用户有更快加载的错觉,您可以尝试这些技术。

进度条无法停止,否则用户会认为页面被卡住。糟糕的情况是99%的时间停止,那时几乎所有的用户都会失望。当实际有一点延迟时,让进度条假装仍在移动。进度条可以在开始时变慢,然后在后面加速,让用户感觉负载越来越快。

加载位图(skeletenscreen)

它也适用于加载位图。加载位图基本上是用灰色位图填充界面上要加载的区域,这为传统的动态效果转换提供了另一种选择。加载位图可以让用户集中精力想象页面加载后的外观,而不是等待时间。

位图通常显示得很快,因为它们的视觉非常简单,文件也非常小。这在应用程序的设计中非常有用,因为这些小的职业地图可以直接存储在手机中。Facebook的用户界面使用位图、灰色块和线条来描述加载的图像和文本。

加载完成后,图片和文本将显示在这些位置。虽然在实践中没有缩短时间,但是用户感知到的时间将比使用上述无限旋转指针更短。

后台操作

另一种技术是背景处理。将进程放在后台有一个好处,这样用户只有在需要时才能看到它。当事件仍在处理中时,请给用户其他操作。Instagram上传的照片就是一个很好的例子。当用户选择照片并正在上载时,应用程序将邀请用户添加标题和标签。当用户完成编辑并希望共享这些照片时,这些照片将被上载并可以立即共享。

带模糊的渐进式图像加载

现在有越来越多的网页和应用程序图片。图像的加载过程会影响应用程序的性能和用户体验,因此图像的加载设计也是一个值得考虑的问题。通过模糊效果,可以达到很好的渐变加载效果。媒介就是一个很好的例子。文章和其他插图的封面图像在加载前模糊。图像先是小而模糊,然后平滑过渡变得越来越大和清晰。小的模糊图像重量很轻,不像清晰的图像那样消耗太多的记忆。

您还可以使用良好的视觉效果,使等待过程更愉快。为了保证用户在等待的过程中不会感到无聊,可以利用有趣的视觉设计分散他们的注意力,让他们忽略漫长的等待时间。

你学会这四招了吗?要掌握这些技能,我们需要多练习,多学习优秀的作品。