Software should be clear, which is to say that it should be easy to understand.

A person should know what they’re looking at. They should know where they are. They should also know what they can do. The person should know what is expected of them, if anything.

Software can support this with a design that supports fast scanning and understanding.

When the software communicates with a person, that communication should be as simple as possible so that more people can understand it.

Both the interaction and visual design should be coherent. That is, each element should feel as if it belongs to the whole.

The interaction and visual design patterns used should not deceive anyone, whether intentionally or not.

Many of these qualities can be helped with good layout. Elements should be well aligned, grouped, and have a recognisable visual hierarchy. No view of the software should be too crowded.

Areas should be spatially associated. For example, a toolbar which controls a canvas should be the same width as the canvas, and should be aligned with it. This gives the impression that the two are related.

Software should make use of control effect hierarchy. That is, controls that affect more of the software naturally sit further out from the centre. The most overarching controls should be at the outside edges, and the most specific controls should be next to what they affect.

If physical/spatial animations and navigation are used (as in mobile apps), there should be spatial consistency. If a screen slides in from the right, and is then dismissed, it should slide out to the right unless there’s a good reason to do otherwise.

Those same animations should feel natural and meaningful. They should also be helpful: they should let the person know something, or point something out to them.

Animations should also suit the interaction used to trigger them, or their purpose for existing.

Next chapter →

← Previous chapter

Back to the table of contents