How to Create a Mood Board

As I’m writing this post, my eyes are drawn to what’s going on outside the window beside me.

The trees are swaying back and forth in the harsh and relentless wind. The individual leaves on the tree branches are fluttering on their stems, like an emerald kaleidoscope. Bits of dust and the occasional piece of garbage wheels through the sky and disappears past the window frame.

It’s striking to realize just how much of our human experience, for most of us, is informed by what we see.

We’re such visual creatures that we take what we see for granted most of the time. The world is just whatever’s in front of our eyes.

I find it interesting to think about how our own personal tastes and preferences are so closely linked to what we see. We have such strong, immediate feelings about what our eyes take in.

For instance, I was on a walk earlier this morning and saw a few houses that appeared to be composed entirely of red bricks. Just bricks, some windows, and a wooden door. It seemed so boring and bleak to me. My immediate reaction to seeing that dull house was, “Nah, I don’t like that one bit.”

Later during that walk, I spotted another house that was more pleasing to my eye. It was mostly dark stucco, but with a contrast of formidable rocks of different shapes and colors. The contrast between the two materials on one house piqued my interest. I thought, “That’s more like it.”

What we see helps inform what we like and what we like depends on the appearance of what we see.

With this understanding, you can use your personal tastes and those of your clients to create something called a “mood board,” which sets a roadmap for where you want your visual style to end up.

What Is a Mood Board?

A mood board is an arrangement of images, materials, pieces of text, etc. intended to evoke or project a particular style or concept.

Put more simply, a mood board is a collection of images that shows a style. Let me give you an example of a mood board I created for a recent client:

Do you get an immediate sense of what sort of style the client was going for?

It’s clear they were aiming for a look that included varying shades of purple in the final product. That color was used extensively in past work they’ve done, so it was important that I keep their preferred color scheme consistent.

In the questionnaire I gave to them before starting in on the official design, they stated that they’re drawn to the style that Apple and the film production company, A24, employs in their websites.

The client was impressed with the minimalist aesthetic that’s become a hallmark of both companies. To paraphrase him: “They get the point across without being overly flashy.” I sought out images that were striking without having to yell at you for attention.

None of the images in that mood board literally say, “I’m minimal and demand your complete focus.” Like all good art, it’s the emotion the images impart that makes them powerful. They follow the rule of “show, don’t tell.”

Creating a Mood Board

How do you go about creating one of these things? Well, that’s a piece of cake; they just take a little time to complete.

I’m a big supporter of Pinterest for a job like this one. A Google image search will also get the job done, if that’s your preference. The aim with this first step is to gather as many images as you can that have a certain “feel” to them.

If you’re creating a website (or any other design project) that has a red color palette, then we’re going to search for “red.” Furthermore, if we’re creating a website that has a red color palette and sells upscale clothing, then let’s search for “red dresses” or “red suits.”

Once you’ve accrued as many images as you can that fit with a particular style, weed out the less than stellar images that don’t perfectly capture the look you want.

Be as harsh as possible with this step. Better to have exactly what you need than a confusing pile of images you couldn’t possibly use.

The last step will require an image editing program of some sort. Photoshop is the standard for this sort of work. You can also look into my preferred editor, Affinity Designer. Pixelmator Pro is a great image editing program, as well. These are somewhat advanced programs, but they’ll serve you well for a long time.

The easiest method of arranging the images in a mood board is to use a template for this exact sort of situation. You can find many template files through a quick internet search. Place your chose images into the template, export, and celebrate!

I believe mood boards are still an underrated tool. They’re used by many people in all sorts of industries, but not nearly as much as they should be.

Knowing how to create a website is one thing, but understanding how a website feels is how you can begin creating designs that stand out from the rest.

A mood board can carve out a path to follow in your design work before you even begin designing it. With one, you’ve already done the hard work of figuring out how a website is going to look. You won’t have to toil away at throwing different ideas into a site hoping that some look will stick.

Think of it this way, spend a little time at the beginning as the visual creature you are. Put together a look that speaks to you without having to say a word. By the time you get through creating a mood board you’ll know the design backward and forward.

Knowing something so deeply will give you the confidence to knock the project out of the park.

Feel moody (but in a good way), cats.