Color harmony in app design – Part I

Image

We tend to take for granted when color combinations are visually successful and we quickly notice when they are not. An immediate visual rejection happens when color compositions are not balanced and harmonious, or are too complex and over-stimulating.

Color harmony occurs when the arrangement of color gives an end result that is pleasing to the eye. And when a color combination is successful, it evokes feeling and emotions and naturally draws our attention. These color feelings can be fun, scary, serious, peaceful, nostalgic, etc.

When the combination is not successful, the color arrangement can be considered disturbing, glaring, chaotic, or perhaps worse, bland and unnoticeable. Taking a very simplistic approach, I classify colors into three categories:

The Vibrants (the hotties):

Red – Yellow – Orange

The Peaceful (the cool ones):

Blue – Green – Purple

The Neutral (the nerds):

Grey – Brown – Black – White

This is a basic classification and is not to say that neutrals can not give a peaceful effect, or that peaceful colors can not be vibrant. Much depends on the intensity (saturation) of the color and how it is used.

Looking at any of these images, I’m sure you have a gut reaction – you smile, you are perplexed, you are intrigued or your eye passes over the image without registering anything . Colors either makes sense visually, or they don’t.

When creating an app, how can you make color work for you? There is nothing wrong with just choosing a color because you like it, but just be aware that in any design color choice is extremely important. For your app, these four things will have the greatest influence on your apps’ success.

Content – Function – Visual appeal – Exposure

Since color plays an important role in the apps visual appeal, not giving your color choices careful consideration will be an opportunity wasted.

Everyone copies, Apple included. It’s how you do it that matters »

Image

Dieter Rams’ 10 principles

1. Good design is innovative
2. Good design makes a product useful
3. Good design is aesthetic
4. Good design makes a product understandable
5. Good design is unobtrusive
6. Good design is honest
7. Good design is long-lasting
8. Good design is thorough down to the last detail
9. Good design is environmentally friendly
10. Good design is as little design as possible

App Icons – Using text

Image

App icon - Human Body

Using text in icons is very tricky. If the icon contains an image or symbol as well as text, each should be placed so that they complement one another.  If the image explains all, there is no to use words at all.  This icon is very busy, but it is bright and lively. The colors are balanced and not aggressive. There is a lot of text, but it does not distract from the image.

More on icon design – Creating Apps, the Guide for Ordinary People