So I'm working on Information Visualisation using colours, something along the line of green being good and red being bad, but have you ever tried to blend red and green? The result is vary rarely pretty so I got to thinking about how to do it. Initially I went through The Gimp and the gradient fill tool with red being the background colour and red being the foreground colour. I created an image that was 90px long and 10 high and filled it with the gradient. Created another layer with black lines every 10 px. Copied and pasted the squares between the lines into another image and let the Gaussian Blur tool go crazy before pasting the result back into the image and anchoring the layer, I did this for all 9 squares and then converted to indexed colours using the web pallette. It worked a treat to start with but when it gets near the middle there is a really rather nasty brown!
After looking and looking I realised that there was something interesting going on in terms of the hex colour codes that was generated and they each seemed to jump in increments of 33 (that's 33 hex or 51 decimal!). So there was effectively a scale going on with 00, 33, 66, 99, cc and ff being the only red and green numbers... except for near the middle (where the browns live, with there being a blue at 33). Odd ehh? Have a look:
| ff0000 |
| cc0000 |
| 993300 |
| 996600 |
| 999933 |
| 669900 |
| 66cc00 |
| 33cc00 |
| 33ff00 |
Got to thinking some more and ff / 9 = 1c so I could make a scale between 00 and FF using 1c increments:
| ff0000 |
| e31f00 |
| c73b00 |
| ab5700 |
| 8f7333 |
| 738f00 |
| 57ab00 |
| 3bc700 |
| 00ff00 |
But then the penny dropped! Why not look at traffic-lights and replace that there nasty brown with Amber (Or at least Orange!):
| ff0000 |
| ff3300 |
| ff6600 |
| ff9900 |
| 999900 |
| 99cc00 |
| 33cc00 |
| 33ff00 |
Looks like I'm not the only ones to ponder Traffic Lights.
ReplyDeleteMy lights are now here.
ReplyDelete