I had been harping about a complete redesign for months now. I just couldn't find the time, being in final year and with all the project work. Even after that, unforseeable circumstances forced me to keep pushing back the big day. I have spent nearly half-a-year on the site (though I worked on it for just an hour on most days). The planning had begun as early as February 2009. However, it wasn't until June that I began serious work on it. Well here it is! Spanking new!

 

Those of you who used to frequent the older versions of my site will be quite suprised at such a dramatic makeover. So why the redesign you ask? The reason is simple: the old site sucked eggs! Who was I trying to fool? I mean, seriously, it was really bad. But that is never a substantial motive for a redesign or realignment. So these are the actual reasons. Ahem.

As you know, the site had been previously hand-coded with PHP-MySQL. My blog was powered by Wordpress, but the rest of the site was actual PHP pages, thus making it one hell of a nightmare to update. The homepage. The portfolio. Everyhing. I wanted to be able to update the site easily. I wanted everything to be more tightly integrated with the backend, so I wouldn't have to edit the pages eveytime I wanted to add or update something. In short, I needed a CMS for the entire site, not just for the blog.

Though I used Wordpress for my blog, I was never in a position to create a theme for Wordpress to make it look like the rest of the site. I did not have the time neither the capacity. As a result, the entire site was a mess, with the blog looking one way and the rest of the site another way. Enough was enough. I wanted the entire site to look consistent. Blog and all.

I'll finally admit I got tired of looking at my old site. Apart from being a visual nightmare on the outside, the code wasn't any better. Poorly written CSS. Nooby PHP. Sad.

 

So after kicking myself in the a** every morning for a week, I decided to make time and start researching about the new site. Even at the cost of my studies and college. This process started somewhere around February 2009. It was my final semester. Still remember the days. I used to actually stay up till 3.00am and then go to college the same morning at 8:00am.

Then I happened to read this article in Smashing Magazine about how the grunge-retro design style was gaining popularity among designers around the world, how the Web 2.0 look was dated. There's something about grunge-retro that makes it very sexy: the pastel shades, the raw hand-drawn elements, the dirty textures... I fell for it - hook, line and sinker. At about the same time, a lot of other blogs and journals began featuring the style as well. But I'm not saying I decided on retro just because everyone else was doing it. I did it for love.

I then had to decide on a CMS to power my new site. Which leads me to the story about how I found Textpattern. In fact, it's so detailed and elaborate, I could write an entire article about it. And I have - you can read it here: I've documented my entire experience with Textpattern so far: TXP's plus points, semantic model, the tag structure, plugins used and everything else.

These provided me with the initial inspiration. The rest of it is all me. To achieve the overall organic look that the site has, I used only stock images, textures and photographs.

 

The color scheme used in version 1 is derived from nature: the browns are from tree trunks and dark green from plants and leaves. I had initially contemplated using maroon instead of the dark green, but thought otherwise in the end.

 

The main navigation menu icons have been created by me using Illustrator, they are mesonprojekt originals. The zooming hover effect was inspired by Sony-Ericsson phones.

Coming to the typography, I wanted something very refined and sleek for all my headlines. And what sexier headline font than Gnuolane? It's my personal favorite and I use it wherever I possibly can. To achieve font replacement, I opted for Cufón, which I thought is more convenient than SIFR and other methods existant today.

The footer was influenced by Jason Santa Maria's site. I like my footers big. I have decided to licence the entire site with the Creative Commons Attribution-Noncommercial-No Derivative Works License instead of the traditional copyright, something I learnt through the CSS Zen Garden.

The most important aspect was the integration of the XHTML-CSS templates with Textpattern, which was a cinch. I need not elaborate here, it is covered in detail in the aforementioned article.

 

And a small note about the new logo. I just wanted a good-ol' fashioned type-based logo. The maroon goes better here, so I kept it that way. The font I used was Advent. The atomic nucleus/rings replace the dot on the "j".

After all this, I added all the small unseen things; you know; the bells and whistles that sometimes go unnoticed: like a new favicon (taken from the new logo), RSS feeds via Feedburner, sitemaps and the like.

 

Finally about the codename. Version 1 is called Flaming June. Why you ask? It's the name of one of my favorite trance tracks, by BT. Actually, it was during the month of June that I finished the bulk of this site's development.

 

So I guess that's it! After months of planning and execution, I could finally write this post. It was a long time coming, but believe me when I say I enjoyed every bit of it. Comments are welcome...