Tales of a Designer

A Tale of a Redesign

It is very satisfying seeing your work live and running after putting a whole lot of hours into it. And on top of that, it just being for yourself, and not a client. I can say that I spent well over 40 hours working on this new version of my site and there were lots of ups and downs, but luckily, more ups than downs. I also think I’ve learned more with this redesign than I have with past redesigns of this site, therefore, confidence is rising!

A few months back I began to simply sketch out a few different ideas on where I wanted to go with the design. The one that I first liked seemed a little too normal, and granted the style of it was nice, it seemed that too many people were using that sort of style now. I’m sure you can notice it if you looked on CSS Mania or something. Anyways, I wanted a layout that I didn’t see around the web too much and came up with a pretty solid sketch. Since I wanted to be different, I veered away from the centered look (margin:0 auto;). This was the part I was unsure about until I got the design into photoshop, and then I liked it even more.

Everyone has their own way of starting a design, and for me, I always start with the header. It’s always the first thing I notice when I go to other designers’ sites, and I felt that I wanted mine to be solid. In all of my past designs, I’ve always had a good piece of photography for the header/masthead. I searched Flickr for hours for good photograph, and came across Maurice Jesper’s page. He has some really good shots, and that is where I came across, in my opinion, a diamond in the rough. So of course I emailed him asking for permission to use it, and with his approval, I slapped it in there and it matched my design just the way I wanted it to. Good photography is priceless. So thanks again Maurice.

I wanted the typography to be alot stronger in this version than the last. Since moving to a higher resolution monitor, the text in my last design just seemed way too small, so I wanted it to be a little easier to read, so I bumped the text size up and switched to Lucida Grande for the main text, and Trebuchet for the headers. I also went from the bold black text to shades of gray, and it seems to be alot easier on the eyes. So overall, the typography came together pretty nicely.

I didn’t want tons of colors. Maybe two strong colors, and then subtle colors to compliment. The red used, was actually the color I used for links two redesigns ago, and I am just really drawn to that color, so I decided to bring it back. Since I wanted the second color to obviously match the red yet hold enough contrast against the gray background colors, I played with shades of blue, and found the perfect fit. So those were the two colors I chose for my links and hovers.

One thing that I was pretty excited about was breaking out of the 800×600 trap that I’ve been in for a long time. This is the first time I’ve been able to design for larger screens. The majority of my users/visitors have at least 1024 resolution, so I figured that it was appropriate to start moving up in size.

The biggest challenge in this whole process was creating my own theme in Wordpress, and that was quite the battle. I had my photoshop comp coded up in XHTML/CSS before touching Wordpress, just so that it would make the work a little easier. Now, there is tons of documentation for Wordpress, which is really useful, but they don’t exactly tell you how to make your own theme, they just give you template tags and such. So I followed this other tutorial which was very helpful in getting me started.

The thing that made this such a challenge was getting used to the structure of the template tags, aka, the programming stuff. To say that I’m a rookie at programming might be an understatement, and my brain tends to phase out when I start to see things like “?php…”. So that was something that I had to fight through, and I did a fairly decent job. Once you learn the ins and outs of using the template system, life becomes so much easier, and it was smooth sailing once I got it down.

I made the ‘Distractions’ sections a little better this time also, in where I am bringing feeds from my Del.icio.us links, which I just signed up for, so the most current link will be on top. The previous one was horrible, and just put the links in whatever order it wanted, which I didn’t like at all. So not only will you be able to go and see past links that aren’t on my site anymore, I will have a record of all of my past links as well, because I really wish I had alot of the links that I used to have.

So that is a rough idea of all that I went through for this design. Of course I could have said more, but I will leave the rambling out! Everything else on the site is pretty self explanitory, so I don’t really need to go into anymore detail. I hope you like the site, you might need to refresh the RSS feed because I believe it’s different than the last one. So thanks for stopping by, and I hope you come back!