User Interface - colour schemes
Traditional software developers used to do coding, by which I mean writing program code that made computers perform tasks. In recent years with the growing emphasis on web-based applications even developers like myself who are more comfortable programming the server logic of a web application often have to write the user-interface layer too. When the user interface was a Windows forms application the user usually expected (and got) an interface with varying shades of grey. Nowadays, with the user interface being presented in a web browser, in fact the same web browser that delivers music, movies, games, chat-rooms and other cool stuff, users expect colours, which can be a problem to those of us with a maths or science background who have no innate creative flair.
The following rules have proved useful in helping me to create passable colour schemes for user interfaces. I forget where I first found these but they are definitely not my own work!
- Work with a limited palette
- Pick two hues that work well together
- Use these colours throughout the design
- Add variations of these colours as needed
- adjust saturation and luminosity (lightness)
- don’t change the hue
- Add a few other hues as accents
- use these sparingly
- Use saturation like contrast
- relevant information has a higher saturation
I decided to add such a test to my ASP.NET 2.0 web form. A quick Google found a few paid-for controls that appeared to meet my needs, but since the website is not commercial I didn’t want to spend $50 or $100 that I wouldn’t be able to recoup. After a little more hunting I found exactly what I was looking for; a free, public domain offering from Peter Bromberg that doesn’t generate images, it actually forms the text characters in HTML at runtime (see