Roll Your Own Color Scheme for twhirl
I love purple. It's my favorite color. It makes me happy. It makes me so happy that when an application allows color customization of some sort, I usually tweak it to some type of purple if I can.
I also love twhirl.
Twhirl has a color scheme called "Purple Rain" but it's just not quite purple enough for me. It's a little more on the pink side, but I really like the way it differentiates different types of messages using different hues. It's a nice feature in the UI that really helps me digest information quickly. I just love UI design and I can tell the twhirl development team has put a lot of work into this application.
I remembered reading somewhere in some support comments that you could change the color codes inside the xml files manually. I didn't know exactly what that meant so I went snooping around inside of the package contents for the application to see what was in there. This was a fun experiment and learning process for me.
I located the color schemes folder and then found the .xml files. I don't even know what xml is really but I'm always curious about code so I opened one of the files up to see if any of it would make sense to me. I always tell people I'm not a programmer type and I could not code my way out of a paper bag but one thing I do recognize is a little bit of html color code. So, I set out to start changing things and low and behold, I developed my very own purply goodiness color scheme for twhirl!At first, I didn't know what colors corresponded to which design element of the UI, so I made a new xml file, named it "rainbowtest" and proceeded to change the color in each line of code to a different color — as many different colors as I could so that I could see what belonged where.
Here is what that looked like. Remeber, this is not an acid trip, it's just a test!
Now that I could see what part was which color, I could begin to understand how the layout was constructed and how the colors worked together.
Next, I set out to start picking out a color palette that might work together. This was not as easy as I thought it would be. To begin the idea generation, I used this really great web tool called Color Scheme Designer. This is just an example of how I began thinking about how colors relate to each other.
Here is a screen shot of my artboard in Adobe Illustrator. It took many trials to pick just the right colors to make sure messages and function buttons were readable. Several times I had to quit and restart twhirl so it could recognize the new xml file I copied into the twhirl/Contents/Resources/colorschemes folder.
I was having a hard time trying to decide two of the text colors. They needed to stand out and be very legible so my eyes wouldn't have to strain reading the small text. 16 point type is the maxium. It turns out, the colors in the twhirl logo seemed to work out nicely so I used an approximation of them based on a screen shot of the logo. I used the eye dropper tool in Adobe Illustrator to get an approximation and then further tweaked the colors to make them more readable against the color backgrounds I chose.
I am pleased with the final result and now have a twhirl color scheme that coordinates with my nice clean, empty (almost always because I'm a freak-job like that) purple desktop.
Here is the final result without notation and development artboard.
Here is part of the code that will give you the purple color scheme I created. Just replace the colors with these if you would like the same purple scheme I'm using. Blogger won't let me copy and paste the code for some reason. I shall call it "twhurple" and if you're brave enough to tweak and know what you're doing, I hope you might enjoy it as much as I do. Just don't blame me or twhirl if you break it, ok?
If you've found this tweak useful and were able to successfully implement it, I would love to see a screen shot of your desktop if you wouldn't mind. Loic and #teamseesmic are also looking for screen shots of desktops featuring twhirl in action. It would be really fun to see if this could work out for someone else and how many other purple fanatics there are out there!
Have fun and follow me on twitter, seesmic or FriendFeed — all three of these services are available in one place using twhirl! Isn't that great?