Expand your prototyping knowledge

Loading times: make the wait feel shorter

Loading times: make the wait feel shorter

When it comes to user experience, a fast app or site beats a slow one every time. But how can you deliver fast loading times even when the connection’s slow?

Generation Internet feels the need, the need for speed. Fast functioning is integral to a positive user experience, and the slower the loading times on your mobile app or website, the more likely users are to bounce from your software. Plus in terms of e-commerce, slow load speeds can directly impact revenues: a recent Kissmetrics article noted that a 1 second delay in page response can result in a 7% reduction in conversions. Of course, in web or app design there are technical tricks, such as speeding up server responses, that you can leverage to reduce loading times. But what can you do about a bad connection? Well, technically nothing. But with UX design there are several ways you can create a general feeling of responsiveness that will satisfy even the most impatient of users. Follow these helpful tips to work round slow connections and give your users the impression of a fast mobile app or website experience.

Step up your progress bar game

Progress bars are there to give your user a visual clue that something is, well, in progress. But guess what? They’re not always 100% accurate. And that’s a good thing. Even if connecting to the server has stalled, your progress bar should be designed to give the impression of activity. So set it to go steady and not stop: the feel and movement of your bar has a direct impact on the perception of performance. A progress bar with backwards moving ribbings feels faster than one with forwards moving ribbings, while circular progress bars that perform a greater number of revolutions create an illusion of speed. You’ll see this kind of signalling when you open the majority of apps on your phone: the majority will go to a splash screen featuring the app’s logo, animated with some sort of progress bar. So you know you’re app hasn’t frozen, it’s just loading. You can even design your progress bar to move quickly at first but slow down as it nears completion; users won’t mind that last minute wait because they’re… almost… there…



The Dark Loading Bar, designed by Jeff Broderick

Design for instant feedback

When users tell your software to do something, they want to know that message has been received. Instant interface changes following a tap or click can be vital to user experience. As Luke Wroblenski points out in his awesome YouTube video on this topic, the Google search app is a great example of instant feedback: as soon as the user taps on the interface their action is acknowledged by an unobtrusive animation, effectively reassuring the user that their message has been received loud and clear and your software is dealing with their request at warp speed. You can create the same effect with audios as well as animations.


Airbnb’s loading screen

Background operations – your secret UX weapon

Distraction is one of the best weapons in your arsenal to fight loading fatigue. Why not get your users to perform other essential tasks while they’re waiting for the main event to happen, just like Instagram does: while you’re thinking up a caption for your picture, ironically hashtagging and choosing share options, the app is actually performing the core task of uploading your photo. By the time it’s done you hadn’t even noticed the delay, right?

Dummy wireframe content isn’t for dummies

A cleverly designed progress bar or load wheel is all well and good, but sometimes there are better ways of keeping your users on board during a delay. Slowly populating your app or webpage with dummy wireframe content, such as image and text placeholders, distracts users by sketching out the expected page layout. Make sure your load screen shows just enough but not too much information. Facebook’s grey placeholders are a great example of subtle use of these temporary information containers. Or you can take inspiration from Medium and use a small, blurry image placeholder before transitioning to your larger final image.


Dummy content from Capptivate.co

Loading times take-aways

If there’s one thing that frustrates users, it’s being made to wait. While some elements of site and app speed will always be beyond your control, as a designer you can create the illusion of speed and responsiveness even when connection times conspire against you. When it comes to loading fatigue, perception definitely trumps reality.

Creating a stellar user experience isn’t simply about speed, it’s also about putting yourself in your users’ shoes. Exploring what they want and what they need. Interactive prototypes are a great way to experiment and are way cheaper than building something that you think everybody needs but in reality nobody wants. Turn them in to usable designs than with a comprehensive prototyping platform. Download Justinmind today.download-justinmind-prototyping-tool-banner-1

Cassandra Naji

About the Author

Cassandra is Marketing Content Editor at Justinmind

Comments are closed.