HIERARCHY
BackgroundHierarchy is a visual way of communicating conceptual structure. Infusing a sense of hierarchy guides the viewer in terms of the order of viewing. It suggests what information should be processed first, second, third, and so forth.
The concept of hierarchy is one that we learn early in life. It is the idea that some items are above or encompass other items. For instance, tools are inside a toolbox, children are within a family, and so forth. Often this has visual analogs. Even a subtle thing like menus on a computer are visual hierarchies. For instance, the Figure below is a screenshot of the files associated with this module: Eye Movement and Hierarchy
When people view a page, the largest element is the first thing seen. Then the eye tends to move from left to right and top to bottom. An understanding of this can inform design with a sense of hierarchy. When everything is important then nothing stands out. The Figure below represents the visual organization of this web site. It was used to plan the menu system for how web pages would link together.
|
PurposeHierarchy is a visual way of communicating order, structure, and priority.
Visual hierarchies are conventions which the mind has become accustomed to seeing. For instance, the top-level is usually superordinate to lower items. In a document, items to the left are superordinate to items further to the right. For example, the title is generally at the top of the page (or on the first page). Subtitles are often at the top of a section centred or left-justified. This format works with outlines as well. This knowledge is culturally defined, so the conventions for textual representations are learned. For instance, these conventions would be different in a Japanese textbook with a different orientation than English text.
This hierarchical understanding can be taken into account when designing visual portrayals. If the visual message's content has a hierarchical component to it (dimensions), then information elements can reflect that through the attributes of spatial orientation. Creating visual hierarchies is a way of drawing the eye to important information first. TechniquesContrast, alignment, proximity, proportion and even colour can work together to communicate a sense of hierarchy in visual representations. See the Figure below as an example that uses multiple cues to communicate hierarchy.
Hierarchy in Photo Composition
Consider the visual hierarchy in photos or videos. In the following Figure, note how your eye is drawn to the road's dark lines and how that leads you to the subordinate elements of trees, hills, and then the sky. Consider the cactus flower in the photo below and be attentive to what your eye is drawn to first, second, third, etc. For instance, when you notice the white stamens, the purple petals, and the orange interior elements and then the background?
|
References
Begin, Mary Jane. (2013). Creating a visual hierarchy. Lynda.com. Retrieved from http://www.lynda.com/Design-Color-tutorials/Artist-Work-Creating-Visual-Hierarchy/144780-2.html