Overview
A Mood board is a collection of inspirational ideas, materials. Collection of reference for creating a design, color swatches, fonts, and typography, etc is known as a mood board. A mood board helps a designer to convey a general idea or feel about the project or task he is working on.
In short, whatever the designer needs to start the project, all those things are collected in the mood board and help them to accomplish a project/task.
Mood boards can set the tone of a project and guide a large team project during the design process, and assist new designers joining or working with an unfamiliar project.
The user creates the mood board with a different type of ideas from realtime pictures, various textures, typography, colors theme, etc. From this, the user can visualize ideas and concepts.
The mood board doesn’t show the wireframe or any other detailed pictures of the projects.
The mood board helps designers to collaborate with the client and team-members and turns conceptual ideas into real ideas. In this way, designers can effectively share their ideas with the other team-members because visual material always works better than fluent phrases.
Three Types of Mood Board
1. Free collage
Collect high-resolution pictures, illustrations, typography, and colors. Create a theme by choosing a color from picture collection and create a typography hierarchy from the reference which is collected in free collage. Also, collect real-life images related to the project which helps you and the users to understand the concept of the project.
2. Reference collection
The designers can collect stimulus design. They can collect reference that is relatable to their product for visualization, which helps to understand how it looks like after design! Here, the designer can collect references for a particular screen, page or section, and design according to the reference collection.
Reference collection
Design from references
3. Template board
This mood board is used to show the structure and visual hierarchy of a product. Using the Template board, a designer can create a visual flow for product design using the reference collection for the different screen, page or section. It will help you to show the client how the product will design.
Create a Color Theme in Mood board
The world is so beautiful and filled with millions of colors. So when we click the photographs, they are also full of colors. We can use those colors for our project and make it beautiful.
To create a color palette, collect high-resolution photos, illustrations, and other stuff which helps you to create a color palette and choose project-related colors that give an attractive look to your project and arrange them properly.
How to Create a Better Mood Board
- Be clear about what you are trying to make.
- Choose a few directions/ versions of the project and store them in one place for future reference.
- Write and collect thoughts, concepts, and inspiration from references.
- Add an existing project/ theme references & elements that are relatable to your project.
- Collect inspiring designs around the web.
- Add related photographs.
- Add colors and fonts which we will use in the project.
- Add references for animations and motion.
- Arrange all parts of references as per their importance using its size and scale.
- Write a note for elements, why some elements are chosen.
Here is an Example Using a Tablet App of a Mining Company
This tablet application is to be used by the employees. Utilizing this application, employees have to fill various types of forms regarding the whole procedure of mining.
I’ve created the mood board of this app in sketch. In the sketch file, I have collected and created some references & components.
- Created various types of input fields
- Radio Button
- Toggles
- Options selection
- Typography
- Colors
- Image References
Design from mood board
Design from mood board
The elements of this application are filing-forms, entering details, and readability of the text. So we didn’t include High-intensity colors, Graphics and all those things which can rattle the user’s focus from text data.
This app contains lots of forms for formality and procedure of mining which is filled by employees or crew before they start fieldwork.
The client had a hard copy of the forms he wanted. In case you don’t have a hard copy, ask the client necessary questions and create a rough hard copy first. As per the requirement of our client, there are so many required text input fields, radio buttons, toggle buttons, a different state of an input field, input fields for date and time. So we can add a collection of references or samples to the mood board for all those fields.
Only one font family is used to design this application. The main purpose of this application is to make the entire form-filling process easy for users. For the same reason, we haven’t use funky or eye-catchy colors.
Online Tools to Create a Mood Board
- Canva
- Mural
- Milanote
- Evernote
Conclusion
In short, Mood board is a basic step to start a project. Also, it is an important part of the design to have a collection of photos, references, and relevant ideas that help you to know the basic concept of a project.