Status Updates in Digital Applications

David Linke
5 min readFeb 3, 2024

--

When using digital apps, it is crucial for the user to know at all times what is happening. In fact, if you follow the guidelines that Norman & Nielsen have defined as their ten Usability Heuristics, then you have at #1 the most important of them all:

Visibility of system status: The design should always keep users informed about what is going on, through appropriate feedback within a reasonable amount of time.

But how much is too much? This is the question you should be asking yourself to avoid annoying users and driving them away from your website or app, never to return.

It is easy to fall into the trap of frequently conveying status through UI interactions such as toasts and dialogs, but this could also result in disruption of the user flow.

The delivery approach should revolve around the concept of disruption, in other words, how much attention you need from the user, and if it is necessary to stop them from working.

There are 4 levels of escalation within this realm:

  • Subtle Indicators: The lowest level of attention grabbing, designed to inform without disrupting the user’s flow.
  • Moderate Indicators: A slight level of attention grabbing that may briefly interrupt but not fully disrupt the user’s activities.
  • Direct Indicators: These disrupt the user flow and demand complete attention.
  • Complete Interruption: Commonly known as dead ends, these halt user interaction entirely.

Subtle

These indicators allow users to receive updates while continuing their current task. They are subtle in essence yet clear enough to draw the user’s attention. The examples of subtle indicators are:

Inline Text: Unobtrusive yet effective messages, for instance, include a contextual text error or confirmation paired with an input field for validation.

Input Validation with Bootstrap library

Badges, Pills, and Labels: Effective when providing status updates that may or may not require interaction, but are distinctive enough to draw attention.

Badges, pills and labels across diverse libraries

Moderate

Moderate indicators are designed to draw attention, prompting users to take note of updates without demanding immediate action.

Banners: Banners are visible enough to draw attention, with their dynamic and transient nature reinforcing their visibility.

Banner alerts, Adobe Spectrum

Toast and Snackbar Notifications: These notifications provide updates without obstructing ongoing user activity. Displayed briefly before disappearing, they deliver updates without demanding an immediate response.

Toast in context. Carbon Design System

Direct

Direct status delivery methods capture immediate attention, necessitating that users pause their current task to address the situation. These methods should be used judiciously to avoid user irritation.

Dialog Boxes: Dialog boxes demand immediate attention and prompt action from users. To facilitate this, the messaging within these boxes should be clear and concise, with the input required from the user being minimal or optimized to one click if possible.

Material Design 2 Dialog

Pop-ups, Modals, Overlays: These are aggressive ways to capture attention, requiring immediate interaction. Unlike dialogs, they often necessitate complex input from the user to drive a specific outcome, thus their larger footprint and more elaborate composition.

Sign Up overlay. The New York Times

Complete Interruptions

Complete interruptions in digital applications often take the form of a full-page message that, more often than not, serves as a dead end, meaning the interaction requested by the user won’t take place.

Pixar 404 page

Examples of complete interruptions include 404 and 500 error pages on the web, and ‘no connection’ screens often seen in mobile apps. Full-page status indicators should be used only when the urgency of the situation justifies a complete interruption of the user’s activity. If possible, provide a way to help the user achieve the desired result or even allow them to reach support to have options to mitigate the disruption.

Google 500 error page

While these indicators are designed to interrupt, they should still offer clear information, guide users effectively, and maintain the aesthetic consistency of the application.

Enhancing Status Updates

Although iconography, color, sound, and haptic feedback commonly enhance status updates, it’s crucial to remember that these elements alone may not meet all accessibility requirements. The clarity of the message, the options provided, and the balance between politeness and assertiveness remain the principal aspect.

Nevertheless, since the majority of users will fully experience the application, enhancing status delivery in various ways is essential.

Icons: Widely recognized icons significantly improve users’ understanding of status updates.

Color: They further enhance updates by conveying status changes’ nature and urgency, with accessibility considerations, such as color blindness, taking precedence.

Inline Messages, BigDesign

Sound: In web applications, sound notifications have traditionally been avoided to prevent unwanted disruptions, a practice rooted in user preference and environmental consideration. Conversely, mobile applications more commonly accept sound notifications, which can enhance user experience through subtle chimes when used thoughtfully.

Haptic feedback: Enhances digital app interactions by providing tactile confirmation, improving accessibility, and making experiences more engaging. However, drawbacks such as potential annoyance, increased power consumption, inconsistent device support, and the challenge of designing intuitive feedback must be carefully considered.

Balance is key

The design and delivery of status updates play a crucial role in enhancing user experience. From subtle and moderate indicators to direct interruptions and complete stoppages, each method must be judiciously implemented to effectively communicate with the user without causing irritation or disruption.

It is essential to balance the aesthetic and functional aspects of these design elements to ensure they serve their intended purpose without compromising the user’s ability to navigate and interact with the application.

After all, the goal is to create an intuitive, engaging, and inclusive user experience that respects the user’s needs while effectively guiding them through the overall journey.

--

--

David Linke

UX Professional, User Advocate and Product Developer.