We came to the conclusion that we had to come up with an option that added something meaningful and gave the user something valuable while they wait.

A cute loading indicator may be delightful the first but soon gets tiresome for heavy users.

Hipmunk searching Chipmunk (I’ll never get sick of you)

Having a hot tip, or a piece of information, needs to cycle through regularly enough so that users don’t get bored. There’s an Australian Network TV app that gives the same tired piece of trivia every time a video is loading. If you’re binge watching a show, which to be honest we probably are, seeing something you’ve already seen, again, makes it feel like a long wait in between episodes. Especially when Netflix loads so much faster.

Not only does copy need to be fresh, but it needs to be short enough that it can be read it before it goes away, otherwise that’s just frustrating. But, not too short that I read it and then still have to sit and wait. Slack does this well.

Slack loading tip

I’ll admit, I still didn’t think we could do it. But we tried anyway.

There were two different approaches we could take:

  1. Having an interim screen with some meaningful information.
  2. Building the wait into the current page.

Option 2 meant that we were following Norman’s Waiting Principles, namely — “Provide a conceptual model, feedback and explanation” and “Keep people occupied: filled time passes more quickly than unfilled time”. It also meant we didn’t have to worry about moving past the interim screen too quickly for users to understand or read what was going on.

I built a conceptual prototype to show what this could look like and explore whether it would actually work. The first rough concept was done in PowerPoint as it was the quickest way to get everything moving using animations, timings and automatic slide advancing.

I sat back and watched the whole prototype. We’d done it.

Now we had to get buy-in.

Show don’t tell

Our very rough prototype — Text cropped on purpose

We first showed the prototype in our critique session with fellow UXers and made some improvements based on their feedback.

Next, I showed the project team. They watched the animation, and liked it but one asked…

“That’s great. But how will it work for the 8.5 seconds?”

I looked at them and say…

“That was 13 seconds”

We’d done it!

The executive leadership team were also sceptical, until we showed the prototype.

We firmed up the prototype in Axure — holding it together with animated gifs and complicated Case statements to put it in front of users.

Testing the Concept of Time

We put the prototype in front of real users, set them a task to do and let them at it.

Participants did not seem to have an issue with the 8.5 seconds animation. Rather, it was positively received as they felt it was more transparent about the steps SEEK was taking, particularly when compared to the current design. None commented on the time without prompting. When they were prompted we got answers including:

“In an instant”


“A couple of seconds”

“5 seconds”

Given what we know from Nielson’s guidelines, and own observations from research, we’ve decided to implement this solution. We are confident that we’ve created occupied time in a useful manner and reduced the perceived wait.

TL;DR — How do I warp time?

  1. Even if you don’t think you can, just give it a shot with a (very) rough prototype in PowerPoint using animations. You may surprise yourself.
  2. Provide meaningful information within context, that doesn’t disappear. The copy should also explain the wait and useful transparency of system status.
  3. Use animations to communicate that things are happening, but don’t rely solely on ‘delightful’ animations.
  4. Get buy-in from other sceptics with a rough prototype to show how you are manipulating time with the above tips.

Good luck!

Source link


Please enter your comment!
Please enter your name here