Influence Of Color On User Experience
Colors has a strong impact on design solutions that we produce. Moreover, it plays one of the most valuable roles in User eXperience.
First of all we start building relationships with users of our product from the first impression. And it means that color palette can increase success as well as decrease it. The first impression is important for building further relationships and project right expectations.
Also, I think that color palette creates atmosphere. And if this atmosphere associates with a better feeling than we can influence on the time that users spend on our digital products. The more time people spend on our products the more success we can get from it.
Colors And Their Meanings
With the meaning of colors, in color psychology, yellow is the color of the mind and the intellect. It is optimistic and cheerful. However, it can also suggest impatience, criticism and cowardice.
Internet Movie Database (IMDb) uses yellow color. And it's largest database of movies in all Internet. So, it's about the mind.
Orange is aggressive color, creates a call to action. We can use it for subscription, "Buy" or "Sell" buttons. In most of the cases this color works with impulse shoppers.
Direct mail marketers tend to use orange in email marketing campaigns to draw attention to a product they are selling. Orange is best known as the color for sexuality and creativity and is associated with affordability. This color is also an attention grabber, but is best used sparingly or as an accent color.
I think that it is successful selection for eCommerce solutions. Amazon use orange color in combination with dark color that almost black.
Also, orange is the color of social communication and optimism. However, we use orange rarely for social networks. You can notice that the most popular social networks designed in blue colors.
Blue is a calming, relaxing color that accompanies red and yellow as primaries. Blue symbolizes the comfort, sky, water, sleep, the mind, trustworthiness. And safety (think Police Officer uniforms). Most importantly, blue represents communication ï¿½ which makes sense in regards to websites designed for communication.
Think about your associations with this color. Blue is the color of trust and peace. It can suggest loyalty and integrity as well as conservatism and frigidity.
A lot of business websites use blue color. Social networks and messaging applications often painted in blue as well.
Indigo is the color of intuition. In the meaning of colors it can mean idealism and structure as well as ritualistic and addictive. This is one of the seven colors of the rainbow: the color between blue and violet.
Indigo stimulates right brain or creative activity and helps with special skills. We often can notice this color on creating websites.
Behance is a creative website where you can explore a bunch of artworks of graphic designers, photographers, illustrators, etc. You can see that they use light indigo on attractive web interface elements.
Also, you can find this color on musicians and artists' websites. Or in promotional materials for appropriate events.
Purple and turquoise belongs to blue family colors as well. Purple is the color of the imagination. It can be creative and individual or immature and impractical. The color meaning of turquoise is communication and clarity of mind. It can also be impractical and idealistic.
Red is the color of energy, passionate love, seduction, violence, danger, anger, and adventure. Our prehistoric ancestors saw red as the color of fire and blood ï¿½ energy and primal life forces. Most of the reds symbolism today arises from its powerful associations in the past.
Red focuses behind the retina, which forces the lens grows more convex to pull it forward. Therefore, we perceive that red areas are moving forward. This may explain why red captures attention.
That is why in most of the cases we use this color for error notifications or emergency actions that we need to do immediately. So, we should focus only on one part of interface to do this action right away.
Green is the color of balance and growth, life and nature. Greed is life. Abundant in nature, green signifies growth, renewal, health, and environment.
The most common understanding that green is the color of the money and business. Take a look at financial interfaces, websites, applications. I will not even mention that dollars in cash are painted in green. Many corporate websites painted in green color.
It's helpful to use green in call to action elements. Many designers reveal that their call to action section/button receives more clicks and attention when they are green in color.
From the User experience design perspective green color works well in places where it's good to start something. For example, Envato websites use green. And it is their dominant color in places where they have key actions.
Starbucks brand use green and usually it's good start of the day.
Also, it is a good sign to go on the cross roads.
The color psychology of pink relates to unconditional love and understanding, and the giving and receiving of nurturing.
Pink is feminine and romantic, affectionate and intimate, thoughtful and caring. The deeper the pink, the more passion and energy it exhibits.
AirBnB (Air Bad and Breakfast) uses pink color. Since, they care about their users. You can find on their home page hero video with calm and cozy atmosphere. Deep pink color complements interface with noticeable action elements that underline their brand and purpose according to customers.
The brown color is a friendly yet serious, down-to-earth color that relates to security, protection, comfort and material wealth. Brown takes its obligations seriously. It encourages a strong need for security.
From a color psychology perspective, gray is the color of compromise - being neither black nor white. It is the transition between two non-colors. It is unemotional and detached and can be indecisive.
Don't use it too much. Because it can create sadness and depression and a tendency to loneliness and isolation. Mix it with some other colors to change this.
Silver and Gold are hard to show in web environment or mobile screens. I recommend to avoid this color for interface elements. However, you can use it in your images and photo materials to create an appropriate atmosphere. For instance, you want to sell jewelry. And your interface should be calm to highlight gold and silver colors of products. It allows to create an atmosphere that associated with abundance and prosperity, luxury and quality, prestige and sophistication, value and elegance.
White is color at its most complete and pure, the color of perfection. The color meaning of white is purity, innocence, wholeness and completion.
Black is the color of the hidden, the secretive and the unknown, creating an air of mystery. It keeps things bottled up inside, hidden from the world. Sometimes we can invert white design conception to create something opposite. This allows to create a starting point for further brainstorming of different ideas.
It is important to choose the right color palette for purposes of your business. Since, you create appropriate associations and interaction with your customers in the way you want. Thus, you can create User experience that you need.
Of course, all the solutions should be tested. But it is easier to begin with a thoughtful hypothesis. And choose the right direction for development of your project from the starting point.
Color Principles That I Found Useful For Interface Design
Too many colors - Adding one color to distinguish important items in a set significantly reduces search time. Adding more colors still improves user performance, but at seven or more, search performance degrades significantly.
Avoid use of saturated complementary colors - it is hard to focus on this kind of solution, because it has "vibrate" effect.
Excessive saturation - moderately saturated colors can be appropriate in small swatches to capture user's attention. When multiple saturated colors are used together, chromostereopsis and other perceptual artifacts often occur.
Inadequate contrast - objects and background should vary in brightness or saturation, in addition to hue.