HIERARCHY (hi·er·ar·chy)
- A body of persons having authority.
- Categorization of a group of people according to ability or status.
- Order of things or people depending on importance.
- Ranking system.
That's the dictionary and thesaurus definition, this gives you a hint about how hierarchy is used in design. In basic terms it means ranking, pecking order or classification of things according to relative importance. Having strong, obvious, consistent visual hierarchy is key to quality design. It is the pecking order in which you can assure the audience will view your work. Imagine how annoying it would be if people went and looked at the terms and conditions before they looked at your beautiful logo. What do we want them to see first, second, third… and last. How to we want them to digest the information? By thinking about this as we lay out we increase the communication of our design piece.
They are few main reasons why hierarchy is so important:
1/ It affects the way we understand.
How does looking at the picture first influence the way we read the rest of the article? By reading the story first we bring a more informed knowledge to the picture. By looking at the picture we bring a flavour to the words. Which is better, it’s up to the designer to decide what they think is more important. This not only provides smarter design but also forces you to think about your images and how they have an effect on the content. The two must exist together and therefore will influence each other. It’s up to us to work out what that influence is and how it is to be seen.
2/ It eases information intake.
A big mistake of designers is trying to make everything in their design stand out. Not only does this make the design look busy it is also is information overload for the viewer. They don’t know where to look and more times than not, dismiss the design altogether. Remember, humans are generally lazy, anything that requires too much effort is normally ignored.
3/ It keeps control.
By not using hierarchy we start to lose control of how our information is being received. Control of communication is our bread and butter. We lose control of that then we are not doing our job, the message can be lost or worse still taken the wrong way.
Hierarchy should be incorporated into all forms of design. It should appear in identities, web pages, posters, packaging, page layout, everything we design. Put yourself in the viewers shoes and think about how they might view it. Have a look at this example.
So how do we actually give something hierarchy. There are a few basic design principles that you can use.
Contrast
more contrast = more emphasis / less contrast = less emphasis
Size
larger = more emphasis / smaller = less emphasis
Positioning
more space = more emphasis
less space = less emphasis (clutter)
Color
darker or brighter = more emphasis
lighter or duller = less emphasis
Check out these examples here. Josh from Designside also has some good thoughts.
___________________________________________________________
HERO SHOTS (FOCAL POINT)
A hero shot is an image that is larger, heavier and more visually arresting than everything else on the page, the main area of visual interest. It is a trick used by designers to get people started at the right point. Most commonly used in publishing, the hero shot is a good way of grabbing attention to a particular part of the spread, drawing the viewer’s eyes without them really being aware of it.
Hero shots are also controlled by the psychology of how people read in the western world. Typically people will start on the top left hand corner and travel diagonally to the bottom right. Because of the way we read lines (left to right) the right top corner also gets attention if you have text near there. The eye will read along a line, resting at the end, giving a chance to wander slightly. The corner that misses out most is the bottom left. Even if there is body copy there, our eyes typically go straight to the start of the line and ignore anything outside of that.
Top to bottom, left to right, big to small, heavy to light.
___________________________________________________________
NEWSPAPER HIERARCY
Newspapers use hierarchy very effectively and most obviously in the headlines. They create clear hierarchy firstly with size and secondly with boldness of font.
The headline is the biggest and grabs the most attention. It is short, sharp and to the point. The sub-head leads you further into the story and is smaller in size. It could also be of a different font, maybe the same family but a lighter weight. Finally the body copy is the last thing you see and is noticeably smaller and of a lighter weight. Indecently text, especially body copy, is the last thing that people look at. They may glance at it, but to actually acknowledge the presented information requires effort. As discussed above, in hierarchy, anything that requires effort gets left till last.
Have a look at this example put together by Jason Santa Maria, a designer from Brooklyn, NY.
How is the hierarchy affected when we add in a picture?
What do we look at first in this example.
I can pretty much guess we all would have looked at the picture first. Secondly we would have looked at the headline. Where do you look after that? I can imagine we might start to differ at this point but the point here is the designer forced you to look at two things in the order he wanted you to look at it in. Pretty powerful stuff.
___________________________________________________________
POSTER HIERARCY
Great band, great poster. If you ever want to see a band that will blow your mind as much as they blow your ear drums - Mogwai is it. I'm too old now, my ear drums too delicate.
___________________________________________________________
BOOK COVER HIERARCY
___________________________________________________________
INSPIRATION & EXTRAS
Each week the lecturers throw up things we find that relate to what we've been discussing or working on that week. Sometimes it might be things that relate to your major assessment and sometimes just stuff that we thought was worth seeing. If you find something you think we should be showing or something we just have to see let us know in class or throw an email over to me at matt@billyblue.com.au and I'll get it up here or on the Bluni inspiration site.
___________________________________________________________
