Mood boards (sometimes called inspiration boards) are used in a variety of disciplines. You've no doubt seen them used for Interior Design, where fabric swatches and paint chip samples are grouped together on a poster to show a homeowner what type of atmosphere the new decor will create. They are also used frequently in Fashion to highlight trends and styles. In essence they are a compilation of inspirational elements used by designers to flesh out ideas at the beginning of a design project.A mood board is extremely useful for establishing the aesthetic feel of a web site. It usually fits into the process somewhere after wireframes and before design mockups. Things that can be explored in the mood board include photography style, color palettes, typography, patterns, and the overall look and feel of the site. Soft or hard? Grungy or clean? Dark or light? A rough collage of colors, textures and pictures is all it takes to evoke a specific style or feeling.
The mood board is intentionally casual; it lets the designer start with broad strokes and get feedback before too much time is invested in the wrong direction. Think of it as rapid visual prototyping.The idea was to show the client a variety of color schemes, patterns, photography, typography and illustrative elements to see what their responses were and to ultimately establish a visual tool set on which we would eventually develop our visual prototypes. We decided that it was important to establish a "mood board template" to standardize the way we presented the information to the client. The purpose behind the template was to allow the client to focus on the desired elements rather than getting distracted by a variety of different layouts.
1. Mood boards don't only have to apply to the web.
If the client hasn't already established branding and identity, these same elements could easily translate into print or multimedia design as well as for the web. In fact, mood boards can even be used to indicate writing styles if so desired.
2. Mood boards help clients narrow their focus to specific elements.
By separating these visual elements from presentation, it helps guide the client through each step of the process without any additional confusion. After all, most of us developers have been through the full prototype process just to have the client tell us at the end that they don't like the colors or other visual styles we've selected. By using mood boards, we seek to minimize the chances of this happening.
3. Mood boards facilitate more rapid visual prototyping.
As mentioned earlier in this post, by having already established many of the visual styles, more attention can be focused on layout and presentation and can ultimately streamline the entire visual "comp" process.
WHAT ARE THE BENEFITS?
Faster mockup production
Some clients will argue that they don't want to pay for mood boards and would rather go straight to mockups, but a few short hours spent up front can save countless hours down the line. With a visual guide created and a clear vision of where you're headed it's much easier to jump right in to the visual prototyping process. There is no blank-canvas syndrome to deal with, and no gnawing feeling that you are wasting your time on a concept they might not like. Best of all, there are no big surprises. Since using mood boards I have yet to run into a project that was a complete do-over.
Smoother client buy-in
Additionally, early client participation makes them a bigger part of the project. When clients feel involved they are more likely to trust you. Mood boards make it clear that you are listening to them and considering their input. They also gain insight into the thinking behind your decisions, dispelling the all-too-common notion that designers choose everything on a whim. Knowing why you picked something will often keep personal preferences (ie/ the client's favorite color is purple so she would like to see that as a background) from creeping in as change requests.
Less frustration, more fun
Mood boards are so much fun, they hardly feel like work. Designing loosely lets you brainstorm, explore and play with different styles without all the limitations a layout (and coding realities) will later impose. They also keep revision cycles to a minimum, something every designer can appreciate.