Fog Creek Software
Discussion Board




Better User Interfaces - Colors

Even when using Windows 3.1, I could never quite "imagine" the "files" and "file cabinet" as being real.  I always envisioned the DOS commands that were being executed whenever I clicked on those pictures.  I guess I never made the connection between the folder icon and directories because once you opened the folder there was just a list a files.  Or it could be that I'm not that imaginative! 

The reason I liked the icons in Windows was because they attracted your attention.  I also liked the really colorful ones!  I like color and lots of it.  Especially contrasting, bright colors.  Those of you who have looked at the website I setup to demonstrate the forum software can see what I mean.

Someone ) left a post at that site that read, "You can have any color you like as long it's black...".  I believe they made that comment in reference to my background color and Henry Ford and the Model T.  It only came in black.  I took it to mean that they were either making a witty comment or they didn't like the color scheme.

With that comes some questions:

How important is color in a user interface? 
How should color be used in the UI?
What are the appropriate places to change the color?

Dave B.
Wednesday, April 23, 2003

Read the Tufte books.
http://www.edwardtufte.com/98990410/tufte/

Danil
Wednesday, April 23, 2003

You'll never please everyone, no matter what color scheme you choose.  I always shoot for something conservative, bordering on plain.  You want the web surfer's attention to be directed toward the content of your web page, not the incidental graphics.

J. D. Trollinger
Wednesday, April 23, 2003

Use restraint or you'll end up with an Angry Fruit Salad.

http://www.jargon.net/jargonfile/a/angryfruitsalad.html

fool for python
Thursday, April 24, 2003

If you're writing a Windows application the rule is simple; use the system colors. If you want to indulge in your artistic tastes, wear a tie (preferably in your own house)

Stephen Jones
Thursday, April 24, 2003

I have found that the most agreed upon designs are achieved by sticking with one hue and using variations of intensity for the various elements (my personal favourite is yellow), basically making monochromatic interfaces, with at most one other hue. This tends to achieve the most professional look that garners the most universal agreement.

Dennis Forbes
Thursday, April 24, 2003

Few hues in the same palette. Colours that fit with each other. Think "autumn colours" or "pastels" or "marine colours".

Dimitri.
Thursday, April 24, 2003

Muted colors.

Programmers almost always end up using bright, saturated colors.  But it's much easier on the eye to have a soothing scheme of muted colors that work together.

Flamebait Sr.
Thursday, April 24, 2003

Dave B,

I personally like your outlandish default forum color scheme. Although bold, it is legible, easy to read, and not tiring to look at, which is not easy when dealing with a rainbow hue of fully saturated colors -- the large amount of black is probably what made it work.

>How important is color in a user interface? 
Depends I guess. Can we narrow this down to web pages vs shrinkwrap? Are games included?

>How should color be used in the UI?
Depends. There are whole books and there are people who successfully break the rules of whole books.

>What are the appropriate places to change the color?
What do you mean? What parts of the UI users be allowed to customize? For desktop apps, I think very few areas; I am not a fan of skins. For forum software, either none if it is black and white text and blue and red links, or the colors that are in the body tag. My opinion only. Using templates can allow the user to do it all very flexibly themselves.

I do think the advice about hues was good. Stick to one hue. Then add a second. Three if you are daring and good at selecting colors. Among those hues, vary saturation and intensity as needed to create other needed colors. Same as painting a room -- keep the number of hues down unless going with all-white furniture. The images on your page are like furniture I suppose - take for example Joel's use of photos as decorative elements that add a small bit of color.

Dennis Atkins
Thursday, April 24, 2003

This is a cool way to get some nice color harmonies: http://www.easyrgb.com/harmonies.php

Matt Kennedy
Thursday, April 24, 2003

Matt

Yes, it is!  Thanks


Thursday, April 24, 2003

Thanks for the compliments, advice and links everyone.  I think I know where to go and look now.

Dave B.
Thursday, April 24, 2003

I should say, 'I think I know where to go from here.'

Dave B.
Thursday, April 24, 2003

I have an example of when color is criticial.  When I started on a trading application it seemed perfectly reasonable to show stocks prices that are up in green and ones that are down in red.  Doing something like this really alerts you to the presence of the color blind population (red and blue work better).

Oren Miller
Friday, April 25, 2003

*  Recent Topics

*  Fog Creek Home