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 →

Published by Bramus!

Bramus is a frontend web developer from Belgium, working as a Chrome Developer Relations Engineer at Google. From the moment he discovered view-source at the age of 14 (way back in 1997), he fell in love with the web and has been tinkering with it ever since (more …)

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.