Choosing the right colors for your interface

Many times the main determining factor for the liking or disliking of your interface is based on the use of colors. It is important not to allow personal preference to cloud your judgment when creating a layout. Colors are powerful tools and if you understand how to use them wisely you will benefit from it greatly. I’ll be covering some common issues when working with colors.

Avoid harsh colors

When creating a layout you need to consider your audience. If you’re creating a website for youth that have healthy eyes or expect users that would appreciate the use of obnoxiously bright colors then feel free to go crazy. In most cases however you want to keep in mind that using low saturated colors can create a harmony in your design and reduce eye strain for older viewers or users that would most likely view your pages in circumstances where there are low levels of light.

Don’t let colors make text unreadable

Very often you see interfaces where text is almost unreadable due to bad choices in color. It is not wise to use white text on top of a yellow background or green text on red. Such a case sounds extreme but there are still times that designs like that show up. There are more subtle cases when using predominantly dark interfaces. If you choose to use a black background with white text you will end up hurting your viewers eyes. Instead you can brighten the black slightly(for example #303030) and soften the white a bit (for example #f6f6f6) The general rule when applying colors is that you should always try to “soften” them down.

Find a balance

There has to be moderation when you’re choosing the colors for your design. Having 15 different colors scattered throughout your layout will most likely have it end up being one big soup of confusion. Try and pick a color palette sorted in a analogous,monochromatic, triad, complementary, compound or shaded way. It is good to pick around 5 colors that you can branch out from. Sometimes only having 2 or 3 main colors will also get the job done. In interfaces however it is important to have enough ranges of colors to distinguish function.

Shape a mood

There are many methods of shaping a mood in your interface with color alone. High and low saturated blues and low saturated yellows might calm a person making them feel like they’re relaxing at a beach house. Our brains connect memories and experiences to colors so this can be a very powerful tool.

Use colors and value to draw attention to important areas

Choosing the right colors at the right place can influence the way a viewers eye will follow your design, you need to think of your layout as a heat map, it also helps desaturating and thinking in values first. On this site I try to draw attention to the middle column by using dark elements with highly saturated icons for the navigation and having the 1st and 3rd column relatively light. You should always be mindful of elements that might distract from where you want the viewers to look. If you are doubtful a good exercise is to take a step back and blur your eyes and see which parts of your design attracts you the most.

Conclusion

These are only pointers that might make you aware of some factors the next time you are creating a layout for a user interface. There are so many other factors that have an influence but you will notice what a dramatic change colors can make. You can make some great color combinations as well as discover ones created by other people at http://www.kuler.adobe.com Here are links to other sites discussing this topic: - Color Wheel - Color theory - COLOR THEORY - Using Color Wheels and Color Theory to Design Harmonious Pages - Classic Graphic Design Theory - Elements of Design:Value & Color