将动画进度指示器部署到您的优势的最佳实践

已发表: 2017-01-31

如果您曾经使用过 PC，您可能会知道系统启动时出现的动画 Windows 符号。设计和动画发展到今天我们看到的样子，需要经过一次演变，但在 Windows 1995 中，图像根本没有移动。你们中的一些人可能会想，为什么还要使用这些动画指标？

但是考虑到这一点，您是否宁愿等待并观看一个空白屏幕来查看您的操作已完成？或者在屏幕再次出现之前保持某种有意义的娱乐？

用户界面设计最重要的功能之一是能够将其进度显示为系统状态。用户需要知道系统是否知道它的动作并相应地响应它们。动画进度指示器能够在几乎任何给定时间显示操作的当前上下文，而无需使用大量文本或视频功能。这使得它们非常适合在后台完成进度时提供系统状态。

为什么在系统进程期间与用户交互很重要？

谁不喜欢应用程序或网站的快速响应？虽然它对用户来说确实意义重大，但它不可能以坚定的一致性运行。某些因素总是会添加到等式中，这些因素会阻碍您的应用程序的速度。这些因素主要包括糟糕的互联网连接、由于负载过重而导致的性能下降甚至程序故障。在这种情况下，最好的做法是尽量减少用户的紧张情绪，并确保应用程序正在运行并且正在取得进展。为此，您必须向用户提供反馈，这样时间就不会影响用户的耐心。

让用户对反馈着迷

当用户进行操作时，等待时间几乎立即开始。但更糟糕的是，没有适当的指标来代表系统的进展。当应用程序没有显示系统正在花费时间的通知时，用户自然会认为应用程序没有响应。结果可能从猖獗的点击到甚至用户放弃，仅仅因为应用程序没有及时提供反馈。

当加载时间超过预期时，通常会执行用于重新启动进度或刷新系统的操作。再一次，即使请求是在后台进行的，没有反馈也不能显示请求的响应。这就是为什么必须引入动画指示器以在需要时随时宣传应用程序的系统进度。

如何将进度指示器用于任何耗时超过一秒的操作？

通常，当一个应用程序的加载时间少于 1 秒时，进度似乎几乎没有阻碍，用户也不会失去他/她的注意力。但是，如果加载时间超过 1 秒，则必须采取措施保持用户参与。短暂的延迟变得明显，用户开始在应用程序上完成任务的有效性徘徊。

这就是为什么应用程序必须通过进度指示器做出响应，以提供可信的等待理由，并在其失控之前减少用户的不确定性。需要注意的是，加载不到一秒的动作不一定需要动画指示器，但图像可以。建议这样做，因为每次执行操作时都会在屏幕上闪烁的动画可能会使用户迷失方向。动画进度指示器最适合用于消除长时间等待的影响，并让用户继续使用应用程序或网站。

进度指标的类型

Indeterminate ：动画等待指示器旨在与用户沟通并让他们了解他们最后的用户操作。最常见且相当简单的等待指示器类型是“不确定”。这种类型的指示器告诉用户等待操作完成，同时让他们不知道完成进度可能需要的时间。几乎可以理解，不确定进度指示器应该用于快速动作，最好在 2-10 秒内。任何超过此时间的时间都可能会影响用户的耐心。这可以增加网站的跳出率和应用程序的放弃率。
Determinate ：在“Determinate”进度指示器的情况下，动画中的时间相当长。这种类型的指示器让用户了解完成进度所涉及的大致或确切时间。它们是更受欢迎的等待指示器类型，因为它们显示了从开始的位置开始的进度、已完成的工作量以及结束等待还需要多少时间。这有助于用户对动画所取得和显示的进度保持信心，同时增加他们继续参与网站或应用程序的意愿。

循环动画指示器和完成百分比指示器

循环动画：循环动画指示器旨在表示进度，而不显示大概或确切的加载时间。这就是为什么多数循环动画进度指示器是不确定的。例如，Windows 7 进度指示器旨在显示相同的动画重复，而没有任何关于完成进度可能需要的精确时间的反馈。此外，它还包括从启动功能、设置界面操作和其他形式的数据加载等所有内容。由于这两个原因，用户不希望看到循环等待指示器来表示网站或应用程序的加载时间。
完成百分比指示器：顾名思义，完成百分比指示器通过将动画跨度、圆圈或条形填充 0% 到 100% 来显示加载进度。由于它显示了完成进度所花费的时间，因此完成百分比指标被归类为确定的等待指标。对于这种特殊的质量，对于需要超过 10 秒才能完成的任务，最好使用完成百分比指示器。

根据一项研究，10 秒是平均用户耐心的阈值。除此之外，在提供进一步的反馈之前，用户会变得鲁莽并变得不耐烦。通过显示加载时间超过 10 秒的进程的完成百分比进度指示器，您可以让用户保持对网站或应用程序的关注，而不会影响他们的耐心。

如何有效地使用进度指标？

在您的应用程序和网站中有效地使用进度指示器可能意味着成功和失败的区别。这里有一些提示，可确保您的进度指标表现达标。

让用户了解等待的原因：让用户忘记在后台进行的加载进度是一个新手错误。这增加了他们失去耐心并退出应用程序或网站的倾向。您可以通过显示带有一些文本的动画进度指示器来让用户了解更多信息。您可以显示具体针对哪个进程。例如，您可以显示视频游戏的等待进度，其中包含加载栏和读取正在执行哪个进程的文本，例如“加载图形”或“加载地图”等。
为需要较长时间的任务指出一个简单的时间估计：不要把事情带到微观尺度。您可以通过提供简单的估算来保持用户的参与度。愚弄你无法遵守的承诺会激怒用户并迫使他们离开。
显示所需的精确时间量：但是，对于通常花费超过用户平均等待限制的时间的操作，选择确定的进度指示器将是更明智的举措。理想的选择是完成百分比进度指示器，因为它使精确的加载时间成为众人瞩目的焦点。对于处理时间更长的操作，请考虑使用步骤数来突出显示已取得的进展。
保持进度：在加载任务期间尽量保持进度条的一致性。经过几次体验后，进度条会迫使用户对动作完成的速度产生预期。因此，进展过程中的任何冻结都会严重打击用户的期望。例如，当 bar 达到 99% 并长时间保持这种状态时，大多数用户会对此行为感到沮丧，并让应用程序认为它被冻结了。为了解决这个问题，您可以通过显示进度条立即稳定地移动来掩盖这些不一致的延迟。
在进度条中显示比实际速度更快的进度：原始速度可以通过您可以创建的简单感知来体现，以使进度条感觉更快。您可以通过将动画设计为首先缓慢移动并在结束时选择其速度来实现这一点。这将在不影响完成任务的时间的情况下产生快速进展的错觉。
分散注意力：通过引入创造性的进度指标，可以大大减少用户对时间的感知。如果应用程序在进行过程中显示了一些有趣的文本或视觉细节，它可能会分散用户的注意力，使其无法完成操作。您可以提供各种让用户忙碌的东西，例如短视频、有趣的事实、动画，甚至是琐碎的游戏。

替代方案 - 使用骨架屏幕来对抗动画进度指示器

尽管进度动画指标可以动摇几乎所有因等待而产生的不良感觉，但一些观众对这些策略相当有弹性。在不使用进度指示器的情况下让用户等待的少数几个好的替代方法是一种称为骨架屏幕的方法。也称为临时信息容器，这些技术涉及向用户实时显示进度，而不是打开加载栏。想象一下，一个空白的屏幕逐渐被其组件和元素填充，直到完全放满。这会产生一种错觉，即应用程序正在按照加载时间进行操作，并且他们的等待会得到所显示的进度的奖励。

它不仅让他们的观众与网站或应用程序保持互动，还让他们随时准备好完成下一个任务。虽然进度指示器也是满足用户的极好手段，但它们无法保持用户在加载过程中骨架屏所保持的能量。

最后的想法

无论我们的应用程序或网站操作多么迅速，总有可能出现不请自来的处理时间。使用动画等待进度指示器（例如完成百分比指示器和加载微调器）有助于让用户放心正在进行的流程和系统的当前状态。结果，它增加了他们留在网站或应用程序上等待加载并继续执行剩余任务的可能性。计算完成过程所需的时间，您必须为其分配适当类型的进度动画指示器。

循环指示器非常适合需要 2-10 秒的操作，而完成百分比指示器可以帮助更耗时的操作。在循环动画和骨架屏幕的情况下，最好使用骨架屏幕，因为它们能够执行任何超过几毫秒的动作，并且仍然让用户保持冷静。