Menu Search
Jump to the content X X
Smashing Conf Barcelona

You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.

Improve User Experience With Real-Time Features

Real-time technology delivers information to your users as it happens. But how does it help improve your product and align with your customers’ expectations?

Only a few years ago words like WebSockets1, low latency and real-time functionality were at the forefront of bleeding-edge development. Fast-forward a couple of years and this technology has become an integral part of many of our favourite apps: Facebook with its in-app notifications; Uber with its real-time location tracking effect; Google Docs’ multiuser collaboration feature; and Slack’s live chat. So should you be using real-time features in your product? Let’s look at the reasons you should consider real-time.

Further Reading on SmashingMag: Link2

Identifying Important Product Features Link

Over time, we often see features in products move from being cutting-edge and nice to have, to become an essential, must-have element of the product.

Take touch-screen technology: in 2007, Apple launched the iPhone, revolutionizing the smartphone market. It soon became the norm to swipe your fingers across a screen and pinch images. Alfred Poor wrote an article7 for Computer World describing the technology of touch screens:

“Now we not only take touch input for granted, we expect to be able to use multitouch (using more than one finger on the screen at a time) and gestures as well”.

No longer do we see touch-screen as an attractive feature, it has become a core part of the smartphone user experience.

Is real-time an attractive or must-have feature in your product? A management technique that helps us understand this better is the Kano model.8 Thinking about real-time technology against the Kano model’s four categories makes it clear that real-time is moving from being an attractive feature to one that must be included:

  • Performance: “They are the ones where customers like having them and dislike not having.”
  • Must-be: “Customers go from tolerating to expecting to have the feature.”
  • Attractive: “What we’re proposing is both new and attractive.”
  • Indifferent: “These occur for any ‘I’m neutral’ or ‘I can tolerate it’ answer.”
Kano10 classifies features into four categories.

Let’s take a look at the origins of real-time and how it’s now expected by users and coming to have a must-be quality in many of our favourite apps.

Early Adopters Of Real-Time Technology Link

If we look at the history of real-time technology we start to understand how it has become such a core feature in many of today’s products and tools. One of the early examples of real-time functionality was seen in the stock markets. Allowing traders to execute their trades with low latency has revolutionized the financial sector. In his article “Wall Street’s Quest To Process Data At The Speed Of Light11” Richard Martin states:

“A 1-millisecond advantage in trading applications can be worth $100 million a year to a major brokerage firm.”

Today, high-frequency trading represents over half of all trades in the US equity markets.

Seamless Integration Of Real-Time Link

Real-time technology has become integral to many of our favorite products and as a result we often don’t recognize it as a specific feature – it is simply expected. If someone messages us on WhatsApp12, we expect to see it instantly.

Another good example of this is Google Docs13, released in 2007 and with an estimated 240 million monthly active users by October 2014.

GoogleDoc Animation14
Collaborating experience on Google Docs. (View large version15)

Writing, editing and collaborating could function on a basic level without the integration of real-time technology. However, allowing multiple users to edit in real time as collaborators, without friction or delay, is a key component to its success. Looking back at the Kano model, this supports the argument that real-time functionality has moved from being an attractive feature to a must-be core feature across many products.

But real-time tech isn’t just confined to chat and collaboration apps anymore. It is being used to track scores in sports apps, and even your own health in things like Fitbit activity trackers. And this is only the beginning.

How Companies Are Engaging Their Users With Real-Time Link

Real-time functionality is present in many of our favourite apps. Whether it’s the pop-up in Twitter to notify you of an update, or seeing the progress of your journey on Citymapper with real-time geo-location, we have come to expect such features. In-app notifications are prevalent in a lot of popular apps today such as Twitter, Slack and Zendesk, to mention a few. If new information about something we’re interested in becomes available or somebody sends us a message, we expect to know about it straight away. If you issue a support ticket, you want an immediate response. Keeping users waiting is quickly becoming a thing of the past. Facebook uses live in-app notifications to bring your attention to any new stories, messages, friend requests and so on that relate to you.

Facebook in-app notification.

It’s important that we understand this human interaction element. Do we want to engage our users? Yes. Do we want to spam our users with endless and irrelevant notifications or show them so much information that it’s impossible to see? No.

Studies have shown17 that 100ms is instantaneous to humans and 250ms is an average human’s reaction time. A good example of this is the Twitter feed. With millions of tweets every second, having a user interface that updated in real time would simply make it incomprehensible to the user. Instead, Twitter controls the frequency of its feeds and gives users prompts, making it easily digestible.

Getting An Edge Over Your Competitors With Live Data Link

Deliveroo is currently shaking up the food delivery industry, boasting over 300 delivery drivers and cyclists serving over 50,000 customers, not to mention its expansion across the UK and internationally.

What are the keys to its success? Deliveroo markets itself as a food delivery service that brings high-quality local restaurant meals to your door. Deliveroo offers its customers a premium experience when using their service. One such feature is their live tracking functionality on food orders. Customers can track their delivery in real time18 “maintaining real-time visibility on every step of the food preparation and delivery process.”

Deliveroo20 real-time tracking.

This is a prime example of a feature that is currently attractive helping to enhance their user experience by offering their customers a premium service. In stark contrast, Domino’s has a similar feature which lacks the live element, instead asking its users to refresh, but only when the countdown has finished, giving its users a frustrating experience.

Domino’s22 track your order page. (View large version23)

With companies like Deliveroo and Uber leading the way in live geo-location tracking experiences, it’s only a matter of time before such features become an essential component in their respective industries.

Real-Time Is Part Of Our Everyday Lives Link

This technology is fast becoming integrated into our day-to-day routines, whether it’s checking live train departures through the Trainline app24 or tracking your daily fitness with the Apple Watch.25

“During a dedicated cardio workout, the Workout app shows real-time stats like elapsed time, distance, calories, pace and speed…”

Naturally this technology is starting to edge into all aspects of our daily life with the advancing development of the Internet of Things as well as traditional applications. Just take Nest, a leader in smart home technology. The company is taking everyday household utilities and making them intelligent. Its products use a real-time API to create instant interactions between the user and product without the need for physical contact, meaning you can always stay connected and in control of your home wherever you are in the world. Nest Labs was acquired by Google in 2014 for an estimated $3.2 billion.26

Nest thermostat. (Source: Tech Advisor28) (View large version29)

Nest’s thermostat30 allows you to control your central heating through an app. As with similar products, being able to act and get alerts instantaneously is a key component to the service.

What We Need To Consider When Using Real-Time Link

When using real-time features, two things that need to be carefully considered are how best to design for it, and what the possible drawbacks can be when using this technology.

What happens when the connection is lost on your app, or the screen updates without notifying the user? It’s important to consider things such as giving the user feedback or notifications. If your real-time app has a connection dropout (unavoidable), not notifying the user can become detrimental to their experience. Dominic Nguyen outlines in detail the new challenges we face when designing for real-time in this blog post.31

As with all the latest technologies, it’s important to consider if real-time is the right approach for your product. While real-time comes with many great benefits, we also need to be aware of potential drawbacks. The technology works to deliver data to the user as soon as an update becomes available. Could sending a real-time notification unprompted interrupt the user’s flow?

Depending on the usage, this data can also become a drain on the user’s network. Take sending a large image over a news feed, or notification to someone’s mobile. If you are sending large amounts of data then real-time may not be the best way to distribute it. Some solutions include waiting for input from a user before downloading additional data, or detecting if their device has a Wi-Fi (rather than cellular) connection before sending it.

Making Real-Time Work For You Link

The examples above clearly demonstrate how real-time technology can work to enhance your product. But it doesn’t stop there – there are so many creative ways to make real-time work for your business.

Take something as mundane as a management tool. Adding in real-time functionality can allow users to collaborate on tasks and do live updates across all devices and platforms, and ultimately become much more productive.

Real-time functionality is also commonplace across booking and e-commerce sites. These real-time notifications can show how many people are viewing a deal and notify them if an item is sold while they’re viewing it, encouraging them to buy before it’s too late.

So what are you waiting for? The internet is full of information on everything from building a real-time chat app32 to adding real-time commenting33 to an article.

Wrapping Up Real-Time Link

WhatsApp, Google Docs, Facebook, Zendesk, Twitter, Slack, Trainline, and Nest rely on offering a real-time experience, powered by real-time technology. And that’s just the tip of the iceberg. There’s a new wave of companies driven by real-time on the horizon.

Companies like Deliveroo and Jinn have let us order almost any item for instant delivery, and track it all in real time. Put simply, if your application doesn’t offer this type of experience, you’re getting left behind.

Can you improve your user experience with real-time features such as in-app notifications, geo-location tracking, collaboration and data visualisation? Real-time functionality can increase customer satisfaction and ultimately give you an edge over your competitors.

Real-time technology is fast becoming an integral part of our everyday lives; it’s in many of our favourite apps and it’ll soon be a big part of the smart homes of the future. Remember: expect today’s attractive feature to be tomorrow’s must-be.


Footnotes Link

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16
  17. 17
  18. 18
  19. 19
  20. 20
  21. 21
  22. 22
  23. 23
  24. 24
  25. 25
  26. 26
  27. 27
  28. 28
  29. 29
  30. 30
  31. 31
  32. 32
  33. 33

↑ Back to top Tweet itShare on Facebook

Lauren has a keen eye for detail and a passion for digital and product design. She previously led a design team at an award wining computer games studio before moving into the tech world to head up design at Pusher. Follow her at @laurenmplews.

  1. 1

    Jabran Rafique

    April 6, 2016 7:54 am

    Great insights with some brilliant examples. Thank you.

  2. 2

    Very good overall explanation in this article! Thank you!

    Realtime stack is very important for news organizations as well. From delivery of breaking news banners to live blogs and beyond!

    What are some of the providers of th said tech? Here are some examples I have used recently:

    – Pusher
    – Firebase
    – Pubnub
    – Nginx Push Stream Module (open source)
    – SocketIO

  3. 3

    Nest is lost, therefor not the best example to show successful services.

  4. 4

    Nicolas Hoizey

    April 6, 2016 1:57 pm

    What about WebRTC/ORTC?

  5. 5

    Kushal Jayswal

    April 7, 2016 9:05 am

    Informative reading.

    I would like to add one more JavaScript framework
    – Meteor (

  6. 6

    Michael Schmidt

    April 7, 2016 2:33 pm

    It is extremly important to mention the problem when you don’t have connection. On our app, you can subscribe to a trainconnection to stay informed about delays or other informations.
    In the first version of the app, we didn’t notify the user if the real-time information is unavailable due to connection problems.
    But many users rely on our real-time delay-informations. We got many customer complains about the missing delay-info although they subscribe to this service.

    If you deliver important informations in real time, this is a very important task to think about!

    But it’s a great article.

  7. 7

    Great points. I’d would have liked to see a few more resources and case studies/research/facts included too.

  8. 8

    Excellent article Lauren. Great insights and well-explained too. The Real-time feature has pretty much moved from the attractive phase to a must-have phase. Thanks, Niraj (Founder at

  9. 9

    IPL 2016 Live Stream

    April 12, 2016 11:26 am

    Nice Info!!

  10. 10

    Denis Mosolov

    May 31, 2016 8:13 am

    Big thanks for the Kano model!

  11. 11

    Thanks for this… great round up


↑ Back to top