Sunday, July 20, 2008

Making A Firefox Theme : Part 2

As my previous post showed you the basic way to kick-start your mind in the direction of making a good theme, this one tells how I did it.

First of all, I took a Bible-Blue theme by Bodizzle (AMO), and… well… ripped apart the theme to see its entrails… Then, I set off into creating new icons, but soon saw that just the icons would not do enough, so changed the Toolbar background image… After doing some basic icons, I felt satisfied and used it on Firefox (now I’m calling it Fx)… To tell the truth, it was not bad, so i quickly posted it on AMO (addons.mozilla.org), and even though it recieved many glowing reviews, and a 4.3 star rating, I knew, by use, that just changing the icons and toolbar background wasn’t enough. So I set off a bit deeper, and changed some more icons.

By this time, I came to the saturation point (in the field of icons), and knew I had to put my thoughts to CSS. But when I opened the files, it was next to greek… But that was because I had had a long hiatus from any HTML coding. But as I spent one more day, things started becoming clearer, and I tweaked some properties, and released another version at AMO (very prematurely).

Then after some so-so kind of reaction, I dived into CSS full time, and forgot that I was a human, and spent 2 whole days (and half the nights) tweaking every aspect of my theme. But I realized that I didn’t know what every inch of the CSS did, so I used 2 or more themes as a ‘reference’ and compared my CSS to theirs, and found out that I had made a very big mistake in my choice of the base skin… There were many loopholes, and the Bible theme was lacking many features which even the Firefox’s Classic theme had. But since I had already given my theme so much time, there was no point in turning back… Finally I overcame the shock, and after another 2 updates, I finally managed to address much of the designing part, and the theme now is… well… sort of… Complete. (But this is just v1)

Here are some screenshots :

Preview Incomplete v1.0.3

This is the original… not anything to distinguish it from…

Close-up Incomplete v1.0.3

Here is a close-up of the toolbar : very plain…

Preview Incomplete v1.1

If you think I had done enough to make it look pretty, then look below

Preview Incomplete v1.2

This is the current release : very usable, very stable, and of course, very Gorgeous. Reinvented everything from scrollbars, to the dropdown menus…

Close-up Incomplete v1.2

Come on now… Give it a try… It ain’t tough at all…

No comments: