clipped from: www.lukew.com   

Visible Narratives: Understanding Visual Organization
by Luke Wroblewski


How we see: visual relationships

Whenever we attempt to make sense of information visually, we first observe similarities and differences in what we are seeing. These relationships allow us to not only distinguish objects but to give them meaning.

The principles of perception give us valuable insight into how we visually group information.

Fig 1: Principles of perception: proximity, similarity, continuance, and closure.


Introducing variations in one or all of these categories creates visual contrast. The more contrast between two objects, the more likely they will be perceived as distinct and unrelated.

Fig 2: Visual differences between objects.


Telling a story: visual hierarchy

Fig 5


Fig 6: If all the elements in a page layout are given equal visual weight, making sense of the page is difficult. Meaning is created through the differences and similarities among elements and their place in the page's visual hierarchy.


Fig 7