Design principles for UI consistency

  • Users orientate themselves to UI zones through muscle memory
  • Confining novelty to consistent zones increases the chances it will be positively received
  • Each positive engagement builds trust and acceptance of this UI zone as a place for experimentation

There’s a tendency to equate efficiency with familiarity: most of us work more rapidly when we know where to find our tools and materials. The same is true in digital interfaces, but what happens when we want to create a sense of serendipitous discovery or introduce a new capability?

Novelty is best channelled through a consistent and discrete zone, ensuring the majority of the UI remains familiar.

As an example, consider that most basic of user interfaces: the light switch. Users are accustomed to its pattern and can often perform its primary function – switching it on or off – without conscious thought or sight.

Now imagine we wanted to introduce a new capability: an automatic mode where the room was illuminated only when in use. It may be possible to add this feature by extending the existing pattern: automatic mode might by activated by flipping the switch twice upwards and de-activated by flipping it twice downwards.

A consistent zone for inconsistency in the UI

However, to do so may confuse and compromise the primary function already encoded in the users’ muscle memory. In this context, a consistent zone for inconsistency might manifest as introducing a new plane of interaction – flipping the switch left – where users could experiment with automatic mode confident their familiar up and down controls remained unchanged and accessible.

To go deeper on this theme, watch James Haliburton’s talk from MEX/13, where he touches on this principle in his exploration of how users switch between modes of interaction.

The principle, part of an emerging series in the MEX journal, is summarised below in a tweetable, shareable graphic. Thank you for citing appropriately.

Establish a consistent place for inconsistency - MEX Design Principles

+ There are no comments

Add yours