Mood Board

Mood Board Downloads

Using mood boards is the next best way to visually communicate ideas between parties and ensure everyone is on the same page before getting too deep into a design. Let's face it, at the beginning of a project, the spectrum of web design possibilities is so wide that you have no choice but to start to narrow your focus. Often, each person's vision of modern or clean may differ widely.

It's often most practical and efficient to narrow the focus by translating those obscure terms into visuals that all parties can come to agreement to. A great way to achieve this is by using mood boards. While the shape of a mood board varies greatly, the goal is fairly common.

It is important to note that these are not designs. Make sure that your client understands that anything shown in this step is purely for discussion.

You want to make sure that you're all on the same page. You want to give a visual to a particular word or phrase. Start by collecting imagery and just use stock art photography to do this. Examples of type treatment, colors, images, anything that's going to help to communicate that feeling or set of words and capture the essence of the company. Look up the keywords that describe the business. Sometimes they're literal, either related to the brand name, the product, the target audience, and other times, they're more conceptual, words like rustic, adventurous.

You're going to search for images that represent those literal keywords. You're going to find supporting images, look for photos, textures, patterns, letterings, styles, anything that helps to give visual to those words. You want to notice color trends between the images. Colors are packed full of meaning and have a huge impact on the mood.

Ask yourself why certain images inspire you or your client and why they help influence the overall style of the mood board. Then you're going to put it all together. Use varying sizes to establish visual hierarchy. Make the most important images larger and keep the secondary supporting images smaller.