UI Synchronicity describes the way a user interface reacts to user interaction, whether that be in a blocking or non-blocking manner.
Sync UI
A Sync UI is a user interface that is tightly coupled to the state of background data or processing. Some examples of Sync UIs are loading spinners or modal dialogs. The intent of a Sync UI is to block the user from continued interaction until the relevant processing or state changes have been completed. Sync UIs should be used in situations where the next interaction is dependent on the completion of the current interaction.
Async UI
An Async UI is a user interface that is decoupled from any processing or background data state. Async UI has perceived benefits over a Sync UI:
- The user interface responds to feedback immediately and feels responsive
- Processing occurs in the background
- UI Continuation doesn't block the interface
A UI that doesn't block continued interaction is perceived as more responsive than a UI that blocks activity. Users report that they feel applications "run faster" or are "snappier" when using Async UIs, even though the background processing can not be noticed as changing.
UI Continuation
With an Async UI, there may be issues with interactions stemming from network errors, input validation, or simple notifications. If the UI has already acknowledged that the interaction is complete, then how do we notify the user if something went wrong? UI Continuation refers to the techniques that are used to deliver these notifications. Some examples of UI Continuation include:
- Silent rollback of user changes
- Non-interstitial notification bar
- Sounds and haptic feedback
When adopting Async UIs, it is important to incorporate an intelligent UI Continuation into the interaction. Remember that oftentimes UI Continuations can be their own Sync or Async UIs; use the right tool for each situation.
Async First
With the benefits that Async UIs have over Sync UIs, it is recommended to adopt an Async First style. With Async First:
- Attempt to craft UI interactions using Async UI as the default.
- If the interaction is not logical for the operation, or is in violation of business rules, only then switch to a Sync UI.
Async UI may not be applicable in all situations, and adopting an Async First strategy will help you determine what parts of your application need to be tightly coupled to processing and data, and which can stay decoupled.