In this episode, we explain in great detail what a mood board is. What are the parts of a mood board. How you may want to think about color, textures, patterns, images, and type.
To create mood boards, I like to start with the mood, and I think it's best to ask like, "What is a mood?," and sort of take us through this process of kind of visually understanding what we're about to create. What a mood board is really comes to is the mood, so the first thing I like to say is, "What is a mood?" Ask yourself that, "What is that ..." When you think of a mood, what does that mean? What comes to mind?
The way I like to think of that is a feeling, a style, that that feeling can sometimes mean like you're really happy or you're really sad. A style could be far, I think more complex sometimes, the way that we think a visual imagery and characteristics make up a style, and so what we have a hard time with is how do we actually go and describe these things through ... We might be able to go and write about this, write a couple paragraphs about this style or feeling that we have, but that might not translate visually to someone else. It depends on how you maybe receive information. If we read something, we're going to use our imagination and imagine how we want it to look, but visually, we need to get everyone on the same page to say like, "That's the color we're going to use," or, "That's the type we're going to use," or, "I love that image," or, "I love that style," so we need to be able to think about the way we describe these and sort of set a vocabulary for this.
The way I think about this is five elements. This really, I think targets a brand, and a brand ... I think everything is a brand now, everything ... Though, we may not realize it, it becomes a brand in itself, whether that's bad branding because the company hasn't done any work whatsoever, meaning like they literally don't even have a good logo, or good colors, or they've thought about type, or positioning, or any of those things, they still really have a brand in that space. The way I think about those five elements are color, images, type, textures, and patterns, and those are the things that in general, when speaking visually in a mood board or a space, are the things that matter. We can break down each one of these things into its various vocabular sections, so let's do that.
Think about how you feel when you look at these things and when I talk about them, and what sort of interpretation that you have for this, as this will be important later. We'll start with color. When we look at that color, there's a couple different values of that color, as we can see here. Do I feel red? Do I feel passion?
Do I see anger? Do I see a brand in mind when I see that color? Here's another. Now, we have a little bit of a color combination here, where we're contrasting colors. Here's another one. Now, we have three colors and the way they go together.
Already, we're a couple color swatches in, and you might look at this and sort of start feeling a specific target market might match up with these colors, right? Hopefully, that makes sense. When I look at this, I think of something kind of youthful, or maybe sporty a little bit. Now, that interpretation of colors is going to change across, I guess you could say trends, the way that trends will use that, those colors, as well as cultures. Cultures may look at a specific color and have a different meaning for that color.
I don't want to go too deep into this, so let's keep going. Here's a couple more colors and the way this feels, right? These are a little bit more muted, that brown or peach color and mustard color, and the way those kind of worked together. It's kind of interesting where that might go. The general thing here is, "Do colors have meanings?" Yes, of course, they have meanings.
Here's a general sort of chart. I think this is pretty common of what some of the colors mean. Again, culturally now, that might mean slightly different things, but in general, from, I guess you could say Western society, and this is kind of how we think of colors and the meanings behind those colors. The next thing we talk about is images. How do images ...
Now, I think color is complicated, right? Color for sure is a complicated space and you could spend a lot of time studying colors and the way colors work together, and the way your users feel about a specific color, but it's even more complicated is when you introduce images. Images say so much. They're going to say so much about your market, like the people literally like, "Who is this for?" It also says so much about the subject matter.
I'm like, "What is this thing?," and then finally, is the style that makes up that image. I wouldn't say then finally, you ... When I say the style that makes up the image, I'm talking about the composition. I'm talking about the lighting. I'm talking about the color, the contrast, all of the things that make up a really good photo.
Immediately, I jumped to this. I've been using this photo for a while when I talk about mood boards. It looks like a son and his father here, and they're sort of ... There's lots of excitement. The kid's super excited. He looks kind of sleepy with his eyes closed, but his mouth is open, and there's lots of excitement here in this space.
They're out looks like on a boat maybe, and their clothes are pristine, like they're ... It almost seems like a Gap ad or something like that. We look at this photo and we get somewhat a certain feeling maybe from this, right? We perhaps might relate to it, or we might not relate to it at all, and we just might be able to identify something from that. Let's look at another photo. Here's this, so a person in a suit here.
What is that? It's classiness, right? We think of this photo, we think of classy or maybe expensive. Let's look at another one. Here's somebody ... Here's a lady running.
It looks like kind of up a hill a little bit, beautiful sort of sun coming up, and the sky and nature, and it's sort of going on this journey or quest. There's a lot of visual imagery in this image that we can assess and composition wise as well, the forms and shapes that make up the negative space of this composition. Again, all of these images have so much meaning behind them. Here's one more. I love this beautiful cat here, sort of almost like praying kind of pose or maybe begging for some food or some snacks of some type. Great bokeh in the background where the image is blurred there, and the cat's in sharp, a little kitten, beautiful eyes, like sort of warms my heart.
There's something really nice about that image. Finally here, I think this is one of the last ones I like to talk about, is a forest shot, and I like ... It's wonderful. You can see that the road or the trail is quite worn, meaning you probably see a lot of vehicles go in and out of this. I think you can interpret this in many different ways. I think initially, I look at this and I see these beautiful trees and the sun kind of coming through the trees.
It's this like warmth and sort of love of the world and nature, but you can also see this picture in a negative way. You could see like, "Hey, this path is really worn. Is this like tree farming? Are they cutting down this forest, and that's the truck that's sort of driving in and out of the forest, getting the wood." Now, you could say, "That's sort of quite negative or that's life as well."
The way you crop this photo in a mood board or in a collage will also determine that. If I didn't show this sort of worn road or trails here, we get a very different feeling from this image, so think about that when you set up a composition of your image itself. Let's talk about type next. How do type determine a mood and a vibe? The type choice that you choose really affects that brand and the way people interpret it, so we look at this type.
Now, some of these type examples, they're not the best type, but there's lots and lots of different type out there, fonts essentially that you can purchase, and free fonts that are out there. It's also the way you execute using those fonts, the thicks and thins of them, the way you squeeze letters together, tracking them closer or tracking them farther apart, as well as leading, separating the lines from one line to another lets sort of the air and oxygen sort of breathe into the type itself. When we look at this, think about where you would see that type used on a brand. Let's look at another one. Here's ... Right, quite the contrast between those two.
Where might we see this? Think about this maybe from packaging perspective, right? Like I looked at something, I grabbed a box of something off the shelf at a store. What would I expect this brand or a vibe or product to be selling, and what do they want to be interpreted as? Here's another one.
What about this one? Where do you see this being used, right? You can see the big, thick letters themselves. They're very angular in form. Sort of I see this as may maybe like, could be used as maybe some sort of like future hiking space like that, maybe something like REI, in that space, but also maybe something like ultra-modern, that could be played out. Here's another one.
Really, a fun letter forms in here, sort of like balloon almost like, but then the sharp twists sort of on the S there and the N really makes it fun. How might you use this in a board and what visual style might this give your users? Here's another one. Finally here, I think this is United, is the typeface here. Very geometric.
Very extended x-height on the type itself. How might you use this? What style does this give? Now, when you look at this type, all the type examples that I've shown would have been on just black and white, and they don't speak too much. They speak in their forms of the letter form, but from a color perspective and image, you don't have that, right?
It's the combination, the way you apply all of that together. Here it is again. Same typeface, now thicker, bolder weight for it. It feels very different now, right? The other one here, this is all caps, and this super high ... The letter form's really, really big versus this, right?
You're like, "Huh, I'd prefer this over this." I look at this, I'm like, "I don't know exactly where I would use this." It seems kind of maybe industrial, is a place that I might be able to execute something like this on. Here is really beautiful type and forms of numbers and special characters here, and the way all this kind of goes together, the way the negative space goes through the letter forms themselves and sort of makes this background collage, so using type not only for its readability or its content, but also for creating form and background with it. Here's another one.
I'm going to just jump over to the next section now, patterns and textures. We have colors, we have images, and we have type down, and so when I say these five things, sometimes a lot of my students will say like, "Patterns and textures, wait. Aren't those kind of the same thing?" Well, I define that a little bit different. I think of patterns as something that you might apply to something.
Now, of course, you could do that with textures as well, or sorry. I think of textures as something you might apply to something, so for example, I have a big, bold typeface and I put a little bit of texture on that typeface, and it makes it look like the type is warm, where patterns are something that I see as more of as a background or an element that is designed to accent something. Let's explore a couple of these. If you look at this pattern, sort of just kind of something crazy with your eyes here, sort of vibrating, that form in itself is overwhelming, but if we lighten, maybe put a light color on it, light opacity, maybe a blue or something that's really light, that form starts to give you a different feeling. Here's a pattern or a texture that could be used as well, this sort of ...
This was a shot of a tree, looking sort of up from the ground, and you can see the branches and the leaves of this, but this has been essentially just taking the two colors and vectorized, and now, it could be used to almost as this beautiful background pattern and put image and type on top of it. Here is this sort of gold texture, and it's almost like liquidy in its form, all of these different sort of modules or shapes of liquid that's so zoomed in on this gold pattern or texture. Here's another one, just brush strokes. You can see a little bit of pink in there and white, and then this contrast of the teal and the way that sort of makes that, that vibe, that feeling for you. I know, that was a lot there.
We talk about those five things, so textures, colors, images type, and pattern. The way we combine these things together is to make a mood board or a collage of images. When we combine it, that's where things really come together. That's where it's not just the individual items by themselves, it's the way they work together in a collage. It makes something new.
When you add just two images together, there's already this contrast between them, but now, imagine adding 20 images or 30 images together. How does that change the vibe and feeling of the direction? Let's take a look. Here's the first board. Immediately, look at that.
What are the keywords maybe that you think of when you look at this? Right? This sort of seems like businessy, minimalist, maybe a little bit of office sort of vibe into this. You have this layout down below in the bottom left corner here, or this sort of nice collage of different items. It kind of gives a little bit of texture in the background of that. We have some glasses here.
We have some shoes. We have some type, we have our textures, we have a little bit of color. Kind of works all these things, elements. We have a little bit of pattern as well of the circles on top of the imagery, the watch up top, our selected typeface here, just ABC. You can see that gold kind of mustardy color and the way it works together.
If I look at this and I presented this to a client, the client would look at this and sort of get a sense of like, "Is that them? Is that what they want to see their brand represent as?" Now, none of these assets might actually be in the final outcome, right? These are collected images, so this pattern, for example, and this type, we'll be making custom patterns, we'll be maybe making a custom typeface or buying a typeface. The imagery that we use, we would be either buying that stock footage or hopefully being able to go out and actually capture some of that footage itself.
Here's another mood board. This, we can see immediately the color palette here, these blues and yellows. Looks like it's something to do with music, and it has this great type, this $5.26 extended x-height on the letter forms. I believe that is the typeface knockout. It has this kind of like ... You got Snoop Dogg in there, you got Alicia Keys in there.
It has this, I guess you could say like tough kind of vibe. It's not overly over to the top like angry or like, "I'm a badass," but it's confident, a contrast that, well, you can see the different patterns and inspiration maybe that they used this stripey line pattern, the big type, the maybe contrast between black and white photos and colored photos, this separation between this yellow and blue color. Here's another one. Look at these contrast between this blues and oranges. This is for a restaurant. You can see up top here, this textured wood and the different items on top of it.
You can see orange and blue in this ... Just that orange is just so striking. I keep coming back to that. You also get this sort of like authentic sort of distressed vibe from it. You have these little, which is a beautiful photo of these little mushrooms that are sort of like ultraviolet, like this yellowy orange color.
There's a brick texture, this motorcycle sort of at this old sort of building, and the dirt and the authentic sort of vibe of this, this aged and comfort. Beautiful board in that form. Here's another one. This is a little bit more straightforward, like it's ... It doesn't give ...
I'll talk about this a little bit. When I look at a board like this and someone maybe was to present this to me, I have a lot of visual direction where I can go still. It's still open. It's defined enough, like it's comfort, it's nostalgic, it's little bit of energy, it's tasty. Based on the colors and some of the textures and where the type's going, I have some inspiration where what I make is going to be similar to what somebody else makes potentially, but I still have that reach to be able to explore.
When I look at a board like this, I don't really have that reach. It's pretty defined. We're going with this space galaxy look. We're going to apply it to things. We're going to use yellow type on top of some sort of form, and it's, looks like it's primarily targeted towards clothes because we have so many examples of clothes.
Though, useful from a direction immediately saying, "Hey, here's space galaxy style theme," I don't really know enough where I might go with colors, textures, and patterns to be able to execute this or give myself enough room to be able to work with it. All right? Here's sort of that authentic Spanish food restaurant. We have great photos of imagery of the food, these beautiful patterns and type on top of it. Some great examples of typography, just the way the forms and hand lettering has been done on that.
Just really great sort of visual direction. I know I'm giving this. Like I said, this is the board. You need to go and create a website for this or create a brand for this. I would know what I need to go and create.
I have lots of inspiration here. It's not the most sophisticated. It's kind of what you would think it would be, I guess, like what is the generic perhaps a little bit, but in its space, you still have lots of flexibility on what your outcomes could be. Here's another board. This is for ... It looks like the brand's TRBLMKRS.
Again, clear color palette here, like this kind of muted gold, mustard color, reds and grays, the photography style, either black and white or has this multiply effect on top of it. It has a lot of style, right? We look at the shoes, the imagery, the illustrations, the type choices, the patterns, the sort of vector illustrations. Someone gives me this board, I'm like, "Wow, that's a great board. I know the visual direction you want to go." Like it's not a jump in my mind.
Here's another example. This is for another Mexican food restaurant. Beautiful examples of type, some hand lettering, some freshness to this. You can see the vibe. It's not that sort of traditional colors with lots of red. It's lots of blue in this now, and this little bit of yellow and green kind of playing into it.
This illustration of this painting up top in the top right corner, that says so much about this vibe. It sort of gives you this feeling of like fresh. Still authentic, but delicious food. Again, someone gives me this board, I know exactly where I need to go with this. I know what they're thinking, what sort of style, yet it still gives enough options of where it could go.
Here's an example of a board. It's a little bit not defined enough, right? We see some blueberries and wood textures. We got a little bit of type, a little bit of color. I don't really see color swatches so much.
I kind of get a sense for these bottom two, or maybe this is a light blue and maybe this like, I don't know what color you would say, like a light peach, sandy kind of color there. It looks like it's for a bakery, but I just don't really have enough to go on, so not the best example. Here's a interesting one. Now, when I make boards, I like to include images of people, because there's always people, right? Anything that we make, it involves people. Here's an example of a board that doesn't have people in it, and so when we look at this board, what do we feel?
Sometimes, yes, there's tiny like hikers there, but in general, when we don't see people, it feels cold. It feels desolate, without life. Sure, there's always life everywhere, but when we talk about humans and the connection, we think of that in that space. From a cold palette, it looks like there's this minty teal color, just a traditional teal or aqua kind of color and purple, and of course, we have blacks and whites. This seems very scientific, very like global warming, that space, this infographics.
It's a cool-looking board, the way that these images been collaged, the type choices here. There is a lot to go on in this. Lots of inspiration here. It's still defining a direction, but there's still options there, so I would say this is a successful board. Would like to see maybe pictures of people.
I know in this instance of this actual board, why they didn't do people in this was the project itself is to talk about the changing of the earth, central global warming and climate change and how it affects things, and the idea to abstract people out of the picture and to sort of observe nature in its form and how nature is changing by people. All right. Here's that third board for that Spanish or Mexican food restaurant here. This is the combination of that red now that we had on that boards a couple of boards ago, but this red is less more saturated and vivid. It's contrasting with this yellow, almost like super mustardy color, like amazing sort of contrast between those things.
Great type choices, great inspiration, still contrast between the wood, fresh food, great images of that. The bowls on the top, I really like where it's like a nice wood bowl, and that has its vibe, but then they've added color to it and it's just so much more about character and style. You also have some hand-done type of top there. Nice use of the wood. You have a little bit of pattern on the UNBURGER packaging there, or maybe the way you could apply the packaging patterns and things like that too.
Really great example of a board. Here's another one here, oranges, and white, and grays. Looks like something to do with music again, so you have artists in here. You have the classic Apple versus PC sort of vibe in here, this cut-out pegboard metal texture type on top of it. If I look at this direction, I get a clearer sense of where it's going, what that vibe is as well.
I think this is the final one. This gives you an example, sort of tech. It gives you, again like looking just the comparison between this one and this one, like how they contrast in form. Imagine presenting those two to a client. These are very, very different visual directions. It has some of the same concepts in mind.
Some of the vector icons here, some of the illustrations, these little cards or modules down below. This side image here of the gradient with the map, and sort of these things have this little bit of depth and shadows to this. Color palette's a little bit all over, I would say. It seems like it's going to be some sort of orange and blue, maybe red as well, so maybe a little bit more visual direction on where this would go, maybe a little bit more on how you might style images of people. This gives a little bit of like the illustrations, maybe a vector or maybe an overlay or something like that on top of it.
This one, under food one, so greens, color swatches clearly like here's the pallet, here's the image of the photography, the style, a little bit of an inside shot of what that could potentially be, some abstractions of like these pots and these forms and shapes. Someone gave this to me and said, "Hey, this is the vibe we want to go with," I would say there's something there. I don't know if it's enough that I'd feel that inspired. I would say it's limited my palette and I know kind of that style now from a creative direction perspective, but I don't know if I know enough where I should take this. We create all these boards and we ... Normally, for a client, I make three boards, and I work with my students.
I talk about that. Normally, that number is three. Sometimes that number is six. You don't really know where you're going. You just want to make a lot of inspiration.
Make six boards. The idea about doing this process is to do it quickly. It's gathering images, it's thinking about those five things as you gather images, so whether you're going on Pinterest, or Design Inspiration, or Behance, or another site, it's thinking about, "What are those images?"