When it comes to making a powerful impression and pushing the identity of a brand, color is key. Just look at some of the most iconic color combinations of the world’s most famous companies – Coca Cola’s red and white, IKEA’s blue and yellow, McDonald’s ‘golden arches’ – the list goes on and on. These colors manage to burrow into our psyches, and give important clues as to the overall vibe of the company, and what we are to expect from their products.
There’s no doubt about the fact that the color of an app’s interface can make a huge difference to how the app is received by the user. That colors have inherent and cultural meanings attached to them is something that’s well understood by psychologists, semiotics experts, and marketing departments alike, and it’s also something which has an automatic, reflexive effect on whosoever is looking at them. In this article, we’ll take a brief look at the ‘meanings’ of some of the most popular colors for apps, and take a moment to think about how using the ‘right’ colors for your interface can increase your app’s popularity and ease of use.
What Do Colors Mean?
Let’s take a look at a few of the most common colors, and think about the impact they have on your users when viewing your app.
- Red
Red is passionate, energetic, and has undertones of love and romance. Using red in your app can give it a sense of urgency, but it’s worth bearing in mind that a little red really does go a long way!
- Orange
Warm, exciting, and dynamic, orange is a great color for youthful apps or those trying to put across a ‘cheap and cheerful’ vibe.
- Blue
Calming, deep, mysterious and clean, blue is a hugely popular color for apps trying to put across a sense of professionalism and efficiency.
- Green
Associated with nature and cleanliness, green is commonly used by apps which are associated with ecological and sustainable products.
- Pink
Light, feminine, and fun, pink is the perfect color for an app interface which wants to put across a light-hearted and cheerful vibe.
- Yellow
It’s the color of sunshine and childlike joy and is known to put users in a mood of confidence and inspiration.
- Purple
Purple is associated with regality and mystery and is often used in esoteric app interfaces or those associated with royalty, decadence, and class.
- Black and White
Minimal, classy, elegant, and straight to the point, monochrome app interfaces provide an ideal blank canvas onto which the user can project their own ideas and inspirations.
Gamma That People Will Trust
One of the most important things to consider when selecting colors for your app’s interface is the sense that you want your users to trust your product. While a large chunk of this idea will come from the content of your app and the way that it is laid out, color does also have an important role to play.
Think about it – if you wanted to put forward an app which was based around professionalism, handling money or sensitive data, or dealing with jobs and transactions, would you really want to make it burst with multi-colored rainbows of joyful tones? The chances are, probably not. Certain color schemes are simply too light-hearted or vibrant to be truly taken seriously, and while pink and yellow stripes or vivid splashes of color might be ideal for entertainment apps or youthful social networks, they simply won’t cut it when you’re trying to put across a more serious tone.
Out of all the color schemes for ‘trustworthy’ or professional apps, it’s highly recommended to stick with either muted shades which complement each other or to use monochrome tones with the color blue included in the design. Why? Because blue is not only a calming, reliable hue, it’s also the color of trust and fiscal responsibility. Even in the political sphere, we can see this being played out: blue is usually the color of choice for centrist and conservative politics, as it is understood as being the ‘reliable’ color which can most easily be trusted with serious issues.
Of course, this doesn’t mean that your options are limited to just black, white, and blue when it comes to creating a ‘trustworthy’ interface. However, it does mean that this is a tried-and-tested color scheme, with thousands of successful examples. Diverge from this palette with some caution!
Taking Care of User’s Eyes
Have you ever downloaded an app which boasts such a garish color scheme, you simply give up on using it after a while out of concern for your eyes? We certainly have, and while that might be at the more extreme end of a scale, there’s no doubt about the fact that the use of color is key when caring for your user’s vision. After all, nobody wants to be struck down with a migraine before they’ve finished browsing through your interface!
The fact that certain color scheme is kinder on the eyes than others is well understood. It doesn’t take a genius to recognize that bright, bold, vivid blocks of clashing colors side by side create an unpleasant browsing experience. However, the science and psychology behind gentler, more eye-friendly color schemes go beyond simply avoiding violent color classes on your screen. And there’s no need to panic – you still can use those blocks of bright color that your client demands just as long as they’re in moderation. Don’t scream their presence from your mobile device!
It’s actually been proven several times over that for apps which feature a lot of text, it’s kinder on the eyes of your users to create a darker background, with lighter colored words and figures. Supposedly, the most ‘gentle’ combination involves a dark blue background with yellow text, but let’s face it, that sounds a bit too garish for most apps, and doesn’t really hit those professional notes well at all. Pastel themes are not only trendy right now, but they are also great for easing the eye into a world of softer colors, and grey text instead of black on white is also a fantastic alternative for those looking to be gentler on their users.
The main key to keep in mind in this regard is to simply not overcrowd your app with colors. Two or three colors throughout the app should be the absolute maximum you use, lest you create a confusing, disharmonious interface which struggles to communicate effectively.
App Colors to Avoid
We thought we’d take a moment to point out some of the worst offenders when it comes to app color schemes. Each of these color schemes gives across the worst possible impression to the user – either by looking tacky and cheap or by clashing horribly and causing an absolute headache to those viewing them!
- Bright Green, or Yellow on a Green Background
The problem with these colors is that they’re all too close together on the color wheel and clash appallingly when viewing on a mobile device. The effect is cheap, tacky, and decidedly unprofessional.
- Pale Colors on a White Background
We get the idea behind this scheme – it’s supposed to look light, ephemeral, airy. The problem is, nothing stands out, and you need to strain your eyes in order to read anything.
- Rainbow and Neon Colors
You’re creating an app interface, not a poster for a rave circa 1993. Approach at your peril!
- Textured Backgrounds
The background needs to be exactly that: a background against which your text and features stand out comfortably. By using picture or texture backgrounds, you’re just creating a muddle and highlighting all the wrong things.
- Black and Red
Want your app to look like a teenage goth’s bedroom? Then, by all means, use this color scheme. Want to look clean, professional, and not give your readers eye strain? Then avoid at all costs.
- Brown
There’s just something unpleasant about the color brown on a mobile device screen. It’s dully, it’s muddy, it’s generally unappealing. Best left well alone.
Brand Colors vs Friendly Interface
A common issue which comes up time and time again for app developers is how to implement brand colors into an interface, without running the risk of any of the above problems we’ve discussed. After all, if your client’s brand is a garish green or brown, it would hardly be a good idea to have those colors as the primary backdrop for your stylish app.
The answer here, of course, is to use brand colors in moderation. Maybe implement them as header colors for certain pieces of text, or use subtler shades of the brand colors (for example, a very delicate green in place of a bold, striking one) in strategic parts of the interface. Also, you could consider dropping a logo or splash of color in one corner of each page, to ensure the brand gets its message across, without taking over the entire app. Ultimately, you need to use your initiative and approach the app design from the perspective of the user and you should be able to make it work.
Related Posts
Color blindness is the common term for a condition where individuals often mistake shades or lose their ability to distinguish colors at all. Women are less likely to have this disease when approximately every twelfth man is prone to it. In the article, I tried to gather and summarize notes of designers and developers about … Continue reading “Color Blindness: How To Design An Accessible User Interface”
Your app is so much more than just a collection of pages, connected to each other and constructed for a particular purpose. It’s an interface, a platform, a tool, and a virtual space designed to meet a specific need, or promote a company, or provide solutions to an identified problem. As such, careful thought needs … Continue reading “Top Tips for Great User Interface Design”
Each platform has its own personality. It’s always best to design elements that are cohesive to the platform’s personality as this will make your app feel right at home. It makes the app easier to learn from your customers as they will be familiar with the flow from using other apps. Like every piece of … Continue reading “Overview Of iOS Design Guidelines”
Material Design is a design language created by Google. Initially, it was announced on June 25, 2014, at the Google I/O developer conference. Before it was officially dubbed “Material Design”, employees referred to it by the codename “Quantum Paper”. With Material Design paper becomes a metaphor; the aesthetic represents a flat sheet of floating in … Continue reading “What Is Material Design?”