Editor’s note: It can be harder to create a color scheme that works better with your design than it is to discover amazing color combinations. In this post, WE share 7 ways to find a color scheme that looks good and works, starting with knowing your target audience.
Color matching is a powerful tool for designers to focus users’ attention, express emotions or convey information. In order to let everyone know how important Color matching is to convey information, I quote a sentence from The article “The Impact of Color on Marketing”. According to The research, 90% of users buy products because of their Color matching.
To make the use of color schemes more effective, which is very important in design, is to come up with a new color scheme. Each color has its own unique meaning, and combining them can deliver infinite possibilities.
This article describes how to make your color scheme work better with your designs.
Select the color palette for the color scheme
Review images
Color schemes, sometimes like bamboo shoots popping up in your head, but more often, we can use some planned methods.
Be clear about your purpose
Before we do that, let’s be clear about purpose and design philosophy. A color palette with meaning is one of the elements of good design.
We can ask ourselves the following questions.
- What kind of message do you want to send through your design?
- What is the purpose of the design? What information do you want to deliver? What do you want to guide users to?
- What kind of feelings and consciousness does it contain?
02. Know your target audience
Review images
Colors are different for each person they meet. The same color, because of each person’s personality, cultural background, experience will produce different effects. With this in mind, we need to understand how users will react when presented with such a design.
The meanings of some colors are universal in all parts of the world, but others are not. Green, usually the color of plants, is associated with nature. But red is different. It varies from culture to culture. In Western culture, red refers to Fire, Violence, Warfare, and sometimes Love or Passion. But in China it means Prosperity and Happiness.
Review images
Since colors have different meanings, it is important to understand the feelings of your audience when creating a palette.
If you want to learn more about The Meaning of Color and country, you can read The articles Psychology of Color in Marketing and Branding and The Meaning of Color.
03. Know the basics of color schemes
When choosing a color scheme, you need to know some basic knowledge about color schemes. The basic of matching color is the basic theory and construction of matching color combination, which is a practical guide. He gives a comprehensive summary of how to use the color wheel and what each one means.
He has a detailed division of color, you can get reference from this article.
Try to find inspiration
Sometimes the necessary color scheme for visualization is difficult to design. In those moments, you can take inspiration from other designers’ work.
Dribbble and Behance, to name two sites that are handy for matching colors. Sometimes when you want to give your Material design some special inspiration, recommend the Material UI site. Flat-like color palette, you can take advantage of FlatUIColor this complete.
The sites listed above are very convenient. Let’s take a look at the effects of different designs. This unique and unexpected approach allows you to create some more interesting palette. Interior design, for example, is a great example.
Review images
When you want to create a different color scheme, try switching your mind and using designs from other cultures. For example, Korean music videos and practical colorful color palettes are impressive. Each scene can be a reference for your inspiration.
Review images
We can also get inspiration from everyday life. When you go outside, any view outside can be used as a reference.
Review images
When you see an exciting color palette, make them into a color palette. You can use Photoshop, or some online tool, to adjust the color scheme we found.
05. Create your own style guide
The style guide you need to know is to put all design elements into a unified design framework. There are all kinds of design elements involved, including buttons or fonts. We should think about what buttons or navigation menus should be used when designing.
Here are some web examples of how to use style guides in practice. Designers come together to learn the carefully selected style guide for 50 well-known brands in this article, which details how well-known flat brands are utilizing the style guide that can be used for reference.
Review images
Because it can be a simple sketch, it’s a great way to help you create your own style guide before using the palette. Know at a glance what kind of design elements to use, then you will know what color scheme to use for production.
KISS (short: Keep it Simple, stupid) when choosing a color palette for your design and production. First, to reduce the color as much as possible, we need to consider the following points.
- Background color (UK: Background)
- Primary Color
- Secondary Color
- Warning Color: Error Color
- Success Color
The main color, as an important CTA (Call to Action, we can see this article in detail: www.webpowerchina.com/knowledge/p… Buttons or accent colors are used, and many companies use them in LOGO design.
Review images
Secondary color, usually used to distinguish between colors of action. For example, the colors used for warning and success are usually green and red, as in the example below, which you can use to design to convey current status information to the user.
Review images
06. Choose a color palette
If you have a design idea, a style guide and some simple sketches, then you can choose the color palette.
Some basic color palettes, artists often arrange them together in similar colors, which is a great way to do it.
Review images
We can take some inspiration from these color schemes. Let’s take a look at how to get the best color scheme out of the many we’ve tried.
As mentioned above, when choosing a color scheme, you can try to ask yourself the following questions in order to determine what message and emotion you want to convey to your users.
- Is this color scheme easy to use?
- What color will have the most impact and draw people’s attention.
- Is it necessary to make this color lighter/darker? When does the user use the product or design?
- What kind of message do you want to send through your design?
It’s safe to say that colors have different roles to play in design because of the style guide, and various colors have different weights. For example, accent colors are used more often than background colors.
Review images
You can do some practice with this, and in the actual page you can put colors into different sizes of shapes depending on their importance. Below is Invision’s color palette.
Review images
Colors such as accent colors and matching colors are shown in a graphical pattern below.
Review images
07. Apply color palettes
What colors are appropriate for a style guide? Let’s take a look at the easy to understand example of Airbnb. Airbnb’s accent color is red (Rausch), which shows the address of the company’s home. Turquoise (Kazan) is the auxiliary color, and two grays (Foggy/HOF) are used as the background color.
Review images
Many Airbnb pages use a bright gray background color (Foggy). In the following example, reserving a room is a very important action, so red is used as the main color (Rausch).
Review images
Turquoise (Kazan), use it to attract more attention. In the example below, you can see that it helps the primary colors well as an auxiliary color.
Review images
Airbnb’s error message suggested that the red (Rausch) had been tweaked to take advantage of a brighter red. The exclamation mark used in the figure (! English: Exclamation Mark), combined with red, is an immediate Exclamation Mark that communicates the current system status to users.
Review images
Let’s try using the original colors for the design. Try to put them at the center of your layout and design. Once that’s done, apply the palette to your design.
Review images
Consider the hierarchy of the Visual. Consider what kind of elements, what kind of color and design is the most matching. Also, consider using different colors for hover and click actions.
The last
Beautiful color matching, need to be repeated, repeated to try. As for the best color, there is no single answer. Once you’ve decided what your layout and design should do, experiment with a variety of color schemes.
It is important to keep learning how to use color for design. Before the design begins, no matter what color combination can be visualized, you can choose a better color eye for the design.