android进度指示器

by Mike Zetlow

由Mike Zetlow

等待的痛苦—浏览进度指示器地狱的7个级别 (The Pain of Waiting — Navigating the 7 Levels of Progress Indicator Hell)

How much hell are you willing to put your users through?

您愿意让用户承受多少痛苦？

Of course the answer you’d like to give is “None!” But if you’re developing web applications, you’re going to make your users wait for results at some point.

当然，您要给出的答案是“无！” 但是，如果您正在开发Web应用程序，则将使用户在某个时候等待结果。

“ While speedy response times are best, there are simply times when even a server upgrade won’t allow you to comply with the guidelines for system speed. In these cases, you simply must reassure the user that the computer isn’t out for lunch but is working faithfully on their request. “ — Progress Indicators Make a Slow System Less Insufferable

“虽然最快的响应时间是最好的，但有时甚至是服务器升级也无法使您遵守系统速度的准则。在这些情况下，您只需要向用户保证计算机不会在外面吃午饭，而是按他们的要求忠实地工作。 “ — 进度指示器使慢速系统变得更加难以忍受

Waiting is a pain point. No one’s favorite part of a roller coaster ride is the wait leading up to it.

等待是一个痛点。在过山车上，没有人最喜欢的部分是等待它的等待。

If waiting is a given, we should do everything we can to lessen that pain for the sake of our users. Disney has experimented with “interactive waiting lines” for their rides. While it’s about as fun as it sounds, at least it’s something.

如果一定要等待，那么我们应该竭尽所能减轻用户的痛苦。迪士尼已经尝试了“ 互动等待线 ”来进行游乐设施。虽然听起来听起来很有趣，但至少是某种东西。

In web development, we do something almost as fun: progress indicators. (Also called: progress bars, throbbers, loading bars, loading circles, loading icons, spinning pinwheels, or wait cursors.)

在Web开发中，我们做了几乎一样有趣的事情：进度指示器。 (也称为：进度条，颤动，加载条，加载圆，加载图标，旋转的风车或等待光标。)

Here are the 7 Levels of Progress Indicator Hell from least painful to most painful.

这是进度指示器地狱的7个级别，从最痛苦到最痛苦。

进度指示器地狱的第一级 (The First Level of Progress Indicator Hell)

准确的进度显示 (Accurate Progress Display)

This is a progress indicator that displays the accurate status of your application. It is difficult to do well and requires a lot of extra code (besides doing what the user asked the application to do). It’s great for users — but still belongs in Hell because waiting is a pain point no matter how accurate the wait time is.

这是一个进度指示器，显示应用程序的准确状态。做起来很难，并且需要很多额外的代码(除了执行用户要求应用程序执行的操作之外)。这对用户来说非常好-但是仍然属于地狱，因为无论等待时间有多准确，等待都是一个痛点。

The Accurate Progress Display is tough to pull off. Developers have been struggling with the problem for decades. If you’re the UX person pitching it, your team might ask if you can achieve a similar effect without as much dev effort.

准确的进度显示很难实现。数十年来，开发人员一直在努力解决这个问题。如果您是UX用户，那么您的团队可能会问您是否可以在不付出太多开发人员精力的情况下达到类似的效果。

第二级进度指示器地狱 (The Second Level of Progress Indicator Hell)

半精确进度显示 (Semi-Accurate Progress Display)

Many applications can approximate the wait time for users. The progress indicator can touch on different stages of a request and let users know. It’s not great because the time spent in each stage can differ wildly, leading to a “jumpy” progress bar.

许多应用程序可以估算出用户的等待时间。进度指示器可以触及请求的不同阶段，并让用户知道。这不是很好，因为每个阶段花费的时间可能会有很大差异，导致出现“跳跃”进度条。

For example, the call could take 20% of the time, the query 70% of the time, the sort 2% of the time, and the return 8% of the time. The user spends most of their time staring at a bar that is 20% full and then suddenly it jumps a bit and is done.

例如，呼叫可能花费20％的时间，查询可能花费70％的时间，查询花费2％的时间，而返回8％的时间。用户将大部分时间都花在盯着20％满的酒吧上，然后突然跳了一下就完成了。

第三级进度指示器地狱 (The Third Level of Progress Indicator Hell)

知觉技巧的rob子 (Throbber With Perception Tricks)

A throbber is a simple spinning or loading indicator that animates infinitely. At this level, we add perception tricks that make the user feel as if the loading is happening faster than it is.

th子是一个无限旋转的简单旋转或加载指示器。在此级别上，我们添加了感知技巧，使用户感觉加载速度快于加载速度。

“It is argued that subjective time is not only the most readily manipulated, but also the most important. After all, our perception is our reality. We do not have to make faster computers to make computers feel faster. “- Chris Harrison

“有人认为主观时间不仅是最容易操纵的，而且也是最重要的。毕竟，我们的感知是我们的现实。我们不必制造更快的计算机来使计算机感觉更快。 “- 克里斯·哈里森

You can use perception tricks on Accurate and Semi-Accurate Progress Displays too. But they are most needed at the Third Level of Progress Indicator Hell and below, where forward progress is not measured and the wait can be most frustrating.

您也可以在“准确”和“半准确”进度显示上使用感知技巧。但是，它们是进度指示器地狱第三级及以下级别中最需要的，在该级别中，无法衡量向前的进度，并且等待可能最令人沮丧。

Here’s three of my favorite:

这是我最喜欢的三个：

知觉技巧1：视觉增强 (Perception Trick 1: Visual Augmentation)

Not all progress bar designs are created equal. Some appear to fill faster than others. Chris Harrison has researched this, pitting various designs head-to-head against each other:

并非所有进度条设计都是一样的。一些填充似乎比其他填充更快。克里斯·哈里森(Chris Harrison)对此进行了研究，将各种设计相互对立：

UX designers must balance this perception trick with the application / brand design.

用户体验设计师必须在感知技巧和应用程序/品牌设计之间取得平衡。

感知技巧2：文本状态更新 (Perception Trick 2: Textual Status Updates)

Provide some text to the user (true or fake) about the status of the application.

向用户提供一些有关应用程序状态的文本(真假)。

“Many times, if users are informed, they may be more patient. It can be helpful to add additional clarity by including text that tells the user what is happening or explains why the user is waiting.” — Smashing Magazine

“很多时候，如果通知用户，他们可能会更加耐心。通过包含可告诉用户正在发生的事情或解释用户等待原因的文本，可以进一步提高清晰度。” — 粉碎杂志

Adobe does a good job of this. Check out “Reading brushes…” below. (Adobe cycles through dozens of these statuses depending on how long it takes to load on the user’s machine.)

Adobe在这方面做得很好。请查看下面的“阅读笔……”。 (Adobe会根据在用户计算机上加载所需的时间来循环显示这些状态中的数十种。)

知觉技巧3：幽默 (Perception Trick 3: Humor)

Studies have shown humor’s effectiveness in alleviating anxiety. Savvy businesses, like Southwest Airlines, often use humor during times of potential anxiety:

研究表明幽默可以减轻焦虑。像西南航空这样的精明企业经常在潜在焦虑时使用幽默：

Waiting on a response from an application definitely raises anxiety levels in users, and humor can be a great tool to alleviate that. (This is best in consumer-facing applications, as it may not be acceptable in some enterprise applications.)

等待应用程序的响应肯定会提高用户的焦虑程度，而幽默可以是缓解这种情况的好工具。 (这在面向消费者的应用程序中最好，因为在某些企业应用程序中可能不可接受。)

进度指示器地狱的第四级 (The Fourth Level of Progress Indicator Hell)

永无止境的进度条 (The Never-Ending Progress Bar)

To users, it appears that a progress bar is moving somewhat quickly, then it slows down and down and down, until finally they can’t tell if it’s moving at all.

对于用户来说，进度条似乎在快速移动，然后缓慢地向下或向下移动，直到最终他们根本不知道它是否在移动。

This is a pretty mean trick to pull on users, though developers may have had nothing but good intentions. The devs coded a progress indicator that is essentially a throbber but looks like a bar filling up. It slows down as the request takes longer, crawling along the asymptote at an infinitesimal non-zero pace until the request is complete (if the request completes!), and at that point the meter shoots up to full.

这是吸引用户的一个相当卑鄙的把戏，尽管开发人员可能只是出于好意。开发人员编写了进度指示器，该指示器本质上是个th子，但看起来像是一条酒吧。随着请求时间的延长，它会变慢，以无限的非零步长沿着渐近线爬行，直到请求完成(如果请求完成！)，此时电表会弹起并充满。

To developers this looks like a working solution that is mathematically elegant. Unfortunately, users hate it.

对于开发人员来说，这看起来像是一个可行的解决方案，在数学上是优雅的。不幸的是，用户讨厌它。

“Changes in speed will be noticed and will impact user satisfaction: if the progress moves quickly only to hang on the last percentage remaining, the user will become frustrated and the benefits of showing progress will be negated.”— Progress Indicators Make a Slow System Less Insufferable

“速度的变化将引起注意，并会影响用户满意度：如果进度快速移动而仅仅停留在最后剩余的百分比上，则用户会感到沮丧，并且显示进度的好处也将被否定。” — 进度指示器使系统变慢少一些

进度指示器地狱的第五级 (The Fifth Level of Progress Indicator Hell)

rob子 (Throbber)

You see this all over software applications.

您会在所有软件应用程序中看到这一点。

These are just animations that loop. Throbbers tell users the application is working on a request, but make them wait too long and they’ll abandon it. Throbbers are best used with short requests. If used with perception tricks, they can move up two levels of Progress Indicator Hell. Else, they remain here.

这些只是循环的动画。攻击者告诉用户应用程序正在处理请求，但使他们等待太久而放弃。 short子最适合短请求。如果与感知技巧一起使用，它们可以上移进度指示器地狱的两个级别。否则，他们留在这里。

“Showing an animated graphic on loop offers feedback that the system is working, but it doesn’t give any information about how long the user will have to wait… And if a spinner is rotating indefinitely, users cannot be sure if the system is still working or if it’s stopped, so they may decide to abandon the task entirely. “— Progress Indicators Make a Slow System Less Insufferable

“在循环中显示动画图形可以提供系统正在运行的反馈，但是并没有提供有关用户必须等待多长时间的任何信息……而且如果旋转器无限期地旋转，用户将无法确定系统是否仍在运转工作或停止运行，因此他们可以决定完全放弃该任务。 “ — 进度指示器使慢速系统变得难以忍受

第六级进度指标地狱 (The Sixth Level of Progress Indicator Hell)

静态文字 (Static Text)

Or:

要么：

You typically see this on government websites or applications where consumers have little choice in the market. (My health insurance portal recently dropped this one on me.)

您通常会在消费者在市场上没有太多选择的政府网站或应用程序上看到此信息。 (我的健康保险门户网站最近在我身上放了这个。)

Intellectually, there is little difference between this and a infinitely-looped animation. But static text just feels so frozen.

从理智上讲，此动画与无限循环动画之间几乎没有区别。但是静态文本感觉如此僵硬。

Users are more likely to feel your app is stuck or broken with this type of progress indicator.

用户使用这种进度指示器更有可能感觉到您的应用程序被卡住或损坏。

The Nielsen Norman Group says it best: “Static progress indicators: Don’t use them.”

尼尔森·诺曼小组 ( Nielsen Norman Group )最好说：“静态进度指标：不要使用它们。”

第七级进度指示器地狱 (The Seventh Level of Progress Indicator Hell)

没有 (Nothing)

No progress indicator whatsoever.

没有进度指示器。

Just the still husk of your application’s frozen interface working hard in the background while the user sits there bewildered, frustrated, praying for the end to come.

当用户坐在那里时，只是应用程序冻结界面的外壳在后台努力工作，感到困惑，沮丧，为末日祈祷。

案例研究：连接进度指示器 (Case Study: Connections Progress Indicator)

With Connections, a web-based insurance management application, we sometimes left users in the Seventh Level of Progress Indicator Hell. It was my goal to get us to at least the Third Level.

借助基于网络的保险管理应用程序Connections ，我们有时会将用户留在第七级进度指示器地狱中。我的目标是使我们至少达到第三级。

We implemented a YouTube-inspired progress bar in our header to display the progress of the user’s database request.

我们在标头中实现了YouTube风格的进度条，以显示用户数据库请求的进度。

It’s basically a throbber, but we used a few perception tricks to ease the anxiety of waiting for our users:

从本质上来说，这是个麻烦事，但是我们使用了一些感知技巧来缓解等待用户的焦虑：

Visual augmentation that matches our brand design — The striping occurs right to left while waiting and then the bar fills left to right quickly when loaded. The animations also occur at a faster rate than framework defaults suggest (Bootstrap, I’m looking at you) so it feels faster.

与我们的品牌设计相匹配的视觉增强效果 -等待期间，条纹从右到左发生，然后在加载时，条快速从左到右填充。动画的发生速度也比框架默认值(Bootstrap，我在看着你)建议的速度快，因此感觉更快。
Textual Status Updates — We display a couple dozen text statuses (“Connecting to database,” “Acquiring connection,” etc.). They’re displayed in random 2 to 4-second intervals to feel real.

文本状态更新 -我们显示了几十个文本状态(“正在连接数据库”，“正在获取连接”等)。它们会随机显示2到4秒，以显示真实感。
Humor — If the query takes longer than around 12 seconds (painful, but sometimes necessary), our textual status updates get funnier and weirder. We hope queries never take that long, but if they do, we try to reduce the anxiety with humor.

幽默 -如果查询时间超过12秒左右(痛苦，但有时是必要的)，我们的文本状态更新会变得更加有趣和奇怪。我们希望查询不会花费那么长的时间，但是如果这样做，我们会尝试减少幽默感。

等待是痛苦的 (Waiting Is a Pain)

It’s a pain point of every software application. Hopefully I’ve shown that your application can rise from the depths with a little UX and design work. Don’t let your users wallow in the pits of Progress Indicator Hell. The uppermost level of an Accurate Progress Display might not be doable in your application, but with a little creativity, you can rise up and keep the waiting pain low.

这是每个软件应用程序的痛点。希望我已经展示了您的应用程序可以通过一些UX和设计工作而从深层发展。不要让您的用户陷入进度指示器地狱的陷阱。精确进度显示的最高层可能无法在您的应用程序中使用，但是如果您稍有创造力，您就可以站起来并保持较低的等待痛苦。

翻译自: https://www.freecodecamp.org/news/the-pain-of-waiting-navigating-the-7-levels-of-progress-indicator-hell-decd3e019495/