Among the issues that could make your users feel frustrated or anxious when performing their tasks, the perceived speed of your website/mobile app is arguably the most important.
Speed is a critical part of user experience and has been definitely proven to feed back directly into your revenues and users’ engagement. A study in May this year found that optimizing page load times from 8 seconds down to 5 seconds translated into a 18% jump in revenue. That’s free money.
There are a lot of well-documented technical approaches out there to reduce page load times by speeding server responses and optimizing the payload being sent. That is beyond the scope of this article.
In this article I want to talk about techniques that DON’T physically increase the ability of your app to respond (since device’s connection speed is out of your control) but instead can help to make your app feel faster.
How is this possible? Well, the answer is simple: you give your users the illusion of speed and responsiveness — even under a slow connection.
This certainly doesn’t mean you shouldn’t try to improve your website’s actual performances. But although this is a critical factor, what matters most is that your users are aware of that improvement.
So here are 3 design tricks that will make your app feel much quicker, without altering your infrastructure
1. Give Instant Feedback
I find Luke Wroblenski’s insights and suggestions useful and enlightening (I suggest you to have a look at one of my last articles titled “Obvious always wins” inspired by one of his statements).
I had the same positive impression (and total admiration) after watching this screencast on YouTube. In this video, to demonstrate the importance of providing instant feedback to users, he shows the performance of the Google search application, focusing on what happens when someone taps on the user interface control.
You see that the interface change happens instantly, and this is good since people know (actually “believe”) that their action has taken effect.
Why is so important to provide users instant feedback? Because users need an indication that their action has been acknowledged. Studies have shown that human beings have a “mental barrier” that means that we perceive events that take more than 100ms as slow. while events under 100ms is felt essentially instantaneous to the user.
This is the reason spinners and progress bars have proliferated in UI. To make your website/mobile app feel faster, you need to make your buttons respond immediately to a user’s touch and give that user a clear visual indication that something is happening.
If this topic interests you, you can read this great article on Mobify about the concept of ‘Perceived Performance’.
Google also uses animation effectively that convinces users things are loading, – even when they actually aren’t. If you tap a link, the animation begins and the server request is made. Even if you’ve disconnected from the internet, the app continues doing it’s best to assure you that everything is fine and totally under control.
Server response times start to become meaningless if your mobile site/app does not feel fast. Whether you’re a designer or developer, your goal shouldn’t just be to create the fastest site mathematically; it should also be to create the fastest site experientially.
2. Perform Tasks in the Background
Whenever you can, try to perform actions in the background when users are not even paying attention. Luke Wroblenski provides a copybook example of this behavior in a very common application that I’ve often mentioned recently: Instagram.
Instagram users would know that the famous photos & videos sharing service begins uploading your images while you’re still busy composing a title, writing a description, tagging friends and so on.
Through instant visual changes (a progress bar again) Instagram gives you the impression that things have been done before its server is actually ready. When you’re ready to press the share button, actually you’re unaware of the upload time and can share your picture instantly. Win.
3. Dummy content
If a user’s connection is slow, it can take an annoyingly long time for an app to populate the screen with content. We’ve all stared at an empty display waiting for a stream of tweets, thumbnails or posts to flow in. Will it be 2 seconds? Will it be 20 seconds? Maybe it’s stalled?
There’s no doubt that making the user stare at a loading bar or spinning wheel increases bounce rates.
To keep users engaged, you can use dummy content in place of text and images to block out the expected layout.
For example, the Facebook mobile app shows uses gray blocks and lines to represent images and text as the app loads. Once it finishes loading, the images and text are swapped in of the is dummy content. In pure technical terms, this is no faster than having a loading screen, – it’s possibly slower – but in the user’s mind it feels faster.
Conclusions
Great magicians don’t need mysterious other-worldly powers. They don’t even need clever props or blinding speed. The ability to force their audience to watch their left hand while their right hand pockets a coin.
Our UX decisions can often benefit from taking a similar approach.
