Design for Realtime – User experience principles for realtime and reactive systems

Great set of example videos (both right and wrong) on how to properly build interfaces that are updated reactively – without a page refresh (viz. β€œthe realtime feed”).

Imagine the difficulty in communicating the rationality of the system to the end user. In the realtime world our challenges are not only to build delightful features, but to translate complexity (= expressing the complexity within our apps in a way that is natural and easy to understand) and illuminate causation (= the relationship between cause and effect) in data.

For example:

Expect Change: When drastic state changes are possible, foreshadow the result of actions. Giving users opportunities to process what’s going to happen prevents surprises.

Shown on the left is a feed that scrolls automatically: the user might lose track of his position. On the right a notice is shown when new messages have been received: the user will decide for himself if he will scroll up to them or not.

And that’s just one example. Many more are included on the linked page below.

Design for Realtime →