We've talked about the principles of design - and as you know by now, these are guidelines for organizing the information within a single composition. The same concept applies when you're working with more than one piece of information, more than one painting, and need to guide a viewer's eyes through the content. The video in today's post shows the design process for my personal portfolio site - explaining the my layout choices and why I scrapped each one leading to the final composition.
Arranging Objects, Large and Small
Information design is necessary when you're trying to clarify something to your audience. For instance, navigating an airport is a information nightmare: everyone is rushing, and no one is familiar with the layout. As a result, the designers tasked with creating signage have an important task. They are trying to prevent people from getting lost, and are forced to compete with a barrage of noise, sound, and crowds. Next time you're in an airport, though, you'll notice that they did a pretty good job: signs are large and visible, often written in multiple languages. The signs are placed where they're the most likely to be seen, and they are generally surrounded by negative space or blank walls. Visual tricks to draw the reader's attention, just like the 2D principles of design. In fact the more you look into the subject of information design, the more overlap you see with the 2D principles of design. It turns out these guidelines aren't limited to arranging objects within a canvas, they are used to arrange nearly everything.
Apple: Information Kings
Even though I'm a PC user, I can't help but admire the way Apple advertises their products. They understand the importance of an information hierarchy, and it's evident by looking at this diagram (right). I've taken screenshots of the entire vertical scroll for their iPhone 5 website, and stiched them together. Next to this image I created a diagram simplifying the use of photos and major layout elements into solid color rectangles. See the shape? It's like a funnel. It starts big and bold, and as the reader continues through the piece it gets more and more specific. The images get smaller and smaller as minute details are explained. It's an information hierarchy.
Does Your Portfolio Need an Information Hierarchy?
As I discuss in the video, there was a lot of thought that went into the main page layout for my portfolio. What I didn't say, though, is that my old portfolio didn't even have a main page. Until recently I limited my website to only my dozen best paintings. The portfolio section was... the entire site. And if you're just starting out, I'd recommend this school of thought. Until you've been working for a few years, it's unlikely that you'll have enough work in total to need an information hierarchy like mine. My site has upwards of 50 paintings, and those are selected out of a much larger total grouping. As a result, though, I couldn't get away with a single page website any longer. For the sake of my audience, I needed to put a road-map for the content and make the general groupings more obvious.
As the internet becomes more and more cluttered with content, art and otherwise, you'll need to compete harder for attention. In this environment, knowing how to control a viewer's attention and gaze is crucial. Are you considering your personal information hierarchy?