How to create a mood board for your website design project

A mood board is a compilation of

Ideas & thoughts

It can be created either digitally or traditionally. However, a digital one costs less, is faster and more agile than its traditional counterpart. Creating a mood board is an essential step for any art or design project. For a website, you will have to think about how the visual elements affect the overall user experience. By making a mood board, you’ll save on your client’s and your own time. Less is more. Don’t go too far with your mood board. Prioritise quality over quantity and don’t cram it all with pictures. Present it in a clean look, with only what is required to portray a good visual. Let’s get started.

Things to include on your website mood board

Your website mood board should be solely focused on the UI.

The colour scheme
The brand image of your client
Descriptive words for your website (adjectives to describe its appearance and vibes)
Pictures
Inspiration taken from other websites in your niche (remember not to plagiarise!)
Fonts for your headings and body text
The layout of your website
How categories and other website components will be displayed

While coming up with the above elements, think about how the user would feel about each. If you’re going for a pastel colour scheme, jot down the feelings they may evoke.

How to create a mood board

There are many ways to arrange your mood board ideas. You can create an online collage or mosaic of all the images. You can also group similar themes and ideas. For instance, bringing shades and hues of colours together. You can create a mindmap of words that describe your website. Link each word with an element on your website. If an ad is an element, what kind of ads will be featured? Describe them in a few words, e.g., ads related to clothing. One good tool for mood board creation is InVision. By using InVision, client-sharing also becomes much easier. It will also allow you to add extra elements in, whereas compiling images will only take you as far as collecting pictures in a folder.

Use social media resources

Remember to use social media resources but don’t plagiarise! Always credit where due.

Pinterest is one of the easiest media sites for mood boarding. You can create a ‘board’ there and fill it with relevant content. These could be pictures and videos related to the brand image of your client or anything else that can be pinned to help relay the expression of the brand. This can be colours or icons, or anything else that you find interesting for the project.

Craft layout ideas for your mood board

Add at least 2-3 layout ideas to your mood board. A website layout consists of how various elements will be positioned. Try to keep your mood board to just one page. If you require multiple pages, limit the content on each. You can keep pictures on one page and use words or brain mapping for the next one. Similarly, the third page can have the proposed layouts.

So, do you need a mood board?

Yes, this will help you set the overall theme. Communication between you and your client will become easier and you’ll be clearer about their brand image and what they’re looking for. A mood board will make you take a few extra steps. This is particularly useful before you start producing the mockup for your website. You can add brainstorming points along with the colour schemes and images you find relevant. This will help you and your client understand why you’re choosing something for the project.

Remember that the whole idea of a mood board is to kick off and set the tone for having a great design. Content can be added later on and it can always be improved. Start mood boarding today, you never know where it will lead you.