At Long Last…
Wednesday, August 27th, 2008
It’s been nearly three years since I broke onto the scene with my previous design. And for many reasons, I was in no rush to replace it. But at the same time, I’ve been itching to redesign for quite some time. In fact, if you follow me on Twitter or Flickr, you’ve seen mention and proof of a redesign in progress for what seems like, ever. I’m proud and excited to be releasing my latest effort into the wild, at long last! If you’re reading this in your feed reader, be sure to hit my domain to check it out.
What Took So Long?
When I first decided that it was time to retire the old, trusty design, I was working on it in my spare time at a casual rate. Obviously, there’s no hard deadline when I’m working on my own stuff, and since I was doing the bulk of the work in my spare time, progress was slow at best. Right when I started making good headway, Addison joined our world and my redesign took a backseat. From that point, my spare time has dwindled and I found myself preferring to sit on the couch with my feet up rather than return to my desk to work when I had some time to myself. But about a month ago, I lit a fire under my own ass and promised myself I would get it done by mid-September. Here we are, about 3 weeks shy of my self imposed deadline, and while the site isn’t everything I had planned it to be, the bulk of the work is done.
Phases
If you were to take a look at my brainstorming notes, you would see a lot of things that didn’t make it, in what I’m calling Phase 1. I came to the realization that if I were to pack everything that I had planned for my redesign into a single release, it would be months before it would be completed. So instead I’ve opted for phases. Phase 1 being the blog overhaul. Phase 2 will focus on the design section, which I have big plans for.
Tried and True
While I was mocking this new design, I focused first on the homepage. When it came time to mock the article layout, I hit a roadblock. I ended up with half a dozen wireframes, but nothing that really sat well, so I decided to stick with what works. As you’ll notice, the article layout is pretty much the same as my previous design, with extra bits of content sprinkled through-out.
Take a Look Around
I was going to list all of the new additions and major revisions, but I’ll leave them for you to find. So please, take a few minutes and click around. Be sure to drop a comment and let me know what you think.







110 people have had something to contribute so far.
As I said on Twitter. Awesome!
Reply
First! XD Maybe. I have to say this just feels awesome. It’s been great watching the log and seeing how much time and effort you put into this redesign. It shows, it definitely shows.
Now when are you going to give me those grunge classes I requested?
Reply
You know how it is, when you just have to let go of something even though it might not be 100% in your eyes - I’m definitely feeling that with the launch of this design. So it’s good to hear that it does appear up to snuff to everyone else… especially designer eyes.
Alright, I’ll add “grunge technique tutorials” to my topic to-do list.
Reply
WOW it’s amazing. You topped Back in Black. I love it seriously. Well done Matt!
Reply
Wow, great redesign, Matt! Nice to see you’re using Last.fm to update the music on the front page, too. since the last redesign, they’ve become a bit more reliable, IMO.
Good job, I’m going to go explore now.
Reply
totally agree on last.fm, previously would get delay in displaying latest music, now I have no problem
Reply
Actually, I’m not using Last.fm to update the music on the homepage. That’s handled by the built in Links engine. I’m merely linking to Last.fm as it is the most likely place where samples would be available for the majority of the music I listen to.
Reply
Looks brilliant. Congrats!
Reply
Damn fine work, as always.
Reply
New design is really sweet! you can tell alot of work has been put into this! the grungey brown is nice touch!
Looking forward to seeing the next phase, be sure to check out my blog, I recently re-designed it myself
Let me know what you think
http://selfconclusion.co.uk
Reply
Stu, I really like the minimalistic feel of your site. Great job!
Reply
Indeed, your site is nice and clean… quite unlike mine.
I like the big Twitter update in the header. That will no doubt keep you conscious of what you’re posting.
Reply
uhm….
http://www.poccuo.com/
just sayin’. i don’t know who copped who, but, damn.
Reply
@brent: wow, how you manage to find that? Meanwhile, seems Poccuo.com has that design since February ‘08, http://web.archive.org/web/*/http://www.poccuo.com/
Reply
i stumbled upon it while browsing sites in the CSS Beauty gallery.
Reply
It’s been a while since I went to this site. You’ve really outdone yourself this time Matt! I guess it didn’t take more than an hour after the launch before this site was submitted to CSS sites all over the web!
@Brent: So who ripped who?
(Comments will not nest below this level)
Reply
sorry guys didnt check for replies, poccuo have had this design for a while I think, i think there site is great, hence I used there header idea yes, but I coded from scratch myself, I know its little cheeky using similar header (the twitter bit on mine) but the look through the site, posts, archives, categories, flickr/last.fm/delicious integration all tweaked into wordpress from nothing, not been in the game too long soo give me little cred :), I have other designs… http://stugreenham.com lol
with selfconclusion, I have been tweaking here and there on my dev webspace to hopefully make it more mine
Reply
As always, great work Matt. I especially like the color choices, as they brake away from what’s out there now.
Those textures are drool-worthy.
Reply
Congrats Matt, looks great. Working on your own stuff is always much harder - deadlines ftw!
Reply
Man! That is TRULY kickass!
The long waiting has been rewarded
Time to dig deeper into other pages…
Reply
DUDE, I THINK THE SITE IS QUITE BADASS. VERY GOOD LOOK. I’LL BE POKING AROUND METICULOUSLY
Reply
Incredible work. I am really digging the brown, too.
Reply
Looks great Matt! Really diggin the brown. Seems like brown is the new black, as I’ve been seeing it around some of the better designs.
Reply
The inspiration for this colour scheme (at least the brown and pink) comes from real world items. My wife picked up a set of luggage a few months ago that’s brown with hot pink and white lining and it looks just awesome. Originally, this design was light with dark text. Still neutral colours, but not as rich.
Reply
Excellent work as usual. Love the Flickr and Twitter integration.
Will you be releasing your old theme to us non-designers? Any news on releasing the theme you did for Pirillo?
Reply
I knew someone would ask about my old design. I’m really not sure how it would work as a theme. I mean, the homepage specifically was totally customized to my preference. Maybe the article layout would work, but even then I’d have to come up with a different header entirely. We’ll see, I may put some time into it at some point.
WicketPixie was released about a month after I wrote about it here - beginning of July I believe.
Reply
Freakin awesome redesign! I like the brown. Kudos!
Reply
Your design is nothing to laugh at. Very slick.
Reply
Thanks, mine is a work in progress. Matt’s is complete.
Reply
Looks as good as the screenshots. This really brings me back to my Quake 1 days with Team Fortress (before TF Classic and TF2).
Reply
Ah, I didn’t know where TF originated. I used to play TFC and Half-Life until 4am when I was in college. Good times!
Reply
An awesome design with using brown. It’s about blummin time some one has done it. Well done Matt.
::Gavin off for a look around::
Reply
You don’t know me Matt, but I’ve been admiring your work from afar for a while… in fact, you were one of the first designers I took inspiration from when I took the leap from Developer to Developer/Designer.
For that reason, I’ve been waiting on your redesign since you first breathed about it months and months ago
So, just a quick one to say - the redesign is f**king awesome. Awe inspiring. I can only hope one day I tune my skills enough to knock out designs like this!
So yeah, keep up the good work. Sorry to sound like an ass-lick, but I figured you deserved some ego massaging after putting together such a fantastic theme
Reply
It’s always nice to hear from those who you’ve inspired, so thanks for commenting and saying so. Your kind words are totally appreciated, and no worries, they won’t go to my head.
Reply
Great to see this! I like the warm brown hues — it still has your “matt brett” feel without being as stark as your other one (black/pink). I also like the emphasis on the design & development work more now that you’re back to doing sexy freelance.
I so soooo get your struggle to update your own site. I think we both started around the same time (3 or so years ago) and haven’t updated the same amount of time, too. So this gives me hope. But, unlike you, my site still has a mid-September launch… but alas, we’ll see.
Congrats!
Reply
Thanks Leah!
When I first completed the homepage, I was still working for Graphics.net, so I went back and added the design & development “bar” to the homepage to get that stuff right up front. It worked out better than I had hoped, so I made sure to drop it in other pages. I had thought about totally separating the 2 aspects of my site, but I’d rather keep it more integrated.
And yeah, the November 1, 2005 CSS Reboot was the big one when a whole bunch of us web geeks bumped elbows for the first time. Or at least, I know I did. I couldn’t let it reach the 3 year mark, and it was starting to look like that might happen. But here I am! Hopefully you can get yours wrapped up some time soon as well. Good luck with it!
Reply
Funny you bringing back 2005 CSS Reboot. That’s pretty much MattBrett.com > all =)
Reply
Yeah, I think keeping your work stuff integrated throughout your blog because I think you probably have a good enough SEO rank that a lot of traffic comes from blog posts, so you’d want to keep reminding people or letting new visitors know that you’re out for hire.
I laughed when you mentioned the CSS Reboot. Totally true (bumped elbows for the first time)! Oh, how times have changed…
Reply
Awesome! I really like how your latest tweet is in a thought bubble coming out of your head
Reply
You wouldn’t believe how many revisions the Twitter section went through before I settled on that. Once I moved it up to the header, it just made sense to do it as a thought bubble.
Reply
Awesome job. I loved the black site but this just feels better.
Oh, and what’s the font you’ve used for the navigation/headings?
You don’t have to tell us if you don’t want to….
Ah go on…
Reply
I used Dirty Headlined through-out the site. Normally I switch it up between a couple main fonts, but I stuck with that one this time around.
Reply
Nice job Matt!
The switch to brown is very refreshing and yet there is still a vibe of the prev design .
Reply
Very nice work. Liking the consistent feel between games, music, and Flickr thumbnails — pulls everything together.
Reply
Looks great Matt, will definitely have to take some time later today to go through and check out all the cool new bits and pieces you’ve added in. Great work.
Reply
Congrats! It was definitely worth the wait!
Reply
The new site looks great Matt. I’m trying to find time to finish up my own long over due redesign and this inspiration to get it done.
Reply
Amazing! You’re my favourite web designer, and while that was never in question, this redesign has just confirmed that all over again. Amazing work. You should be really proud of yourself. Really inspirational.
Reply
Too kind, Ashley!
Reply
Superb job mate, seriously.
Well done, now take a well earned break
Reply
Bah, I wish! Although, I’ll be able to ease up on the after hours stuff. It would be nice to have a week or so off, though.
Reply
This should have been immediately obvious, but I just noticed the top of the site doesn’t say ‘Matt Brett’. I find that very interesting and different. I’d love to hear any info on why you decided to do it that way.
Reply
I’ve always had an issue with “branding” myself. I’ve made a few attempts at coming up with some kind of icon or logo to represent myself, but it’s never felt right. I did try a simple text logo for the header in earlier versions of this design, but I ended up pulling it all together.
Reply
Looks great. Love all the texture and little details. Well done!
Reply
Looks great! It’s interesting that despite the massive visual overhaul it still gives the same vibe as your previous design.
I know what you mean about designing for yourself - I’ve been without a site for three years, and finally decided to break it into phases. Good advice!
Reply
Hey, awesome redesign! You might not care, or you probably already know, but I just wanted to mention that some of the background images don’t look quite right in IE6. Easy fix I would imagine if you cared; great work anyway!
Reply
I haven’t even opened IE6 once to check this design. I figured at the most, I would simply hide the PNGs from IE6, but I might not even go that far. I might just sign up for the Death March and be done with it.
Reply
This is the best design I’ve ever seen. Ever. Congratulations, Matt, expect to see this on thousands of website showcases. Amazing work.
Reply
I love it man, absolutely love it!
Reply
This is pixel perfect!
Brown amd powder Blue go so well together!
CSS’s design wise…it’s striking!
Reply
Major influence!
Reply
It looks fantastic! Great work.
Reply
Man! I’v been waiting for this for a while, loving it. Well done. ill have a better look tonight, after school.
Reply
It’s… chocolately. With pink.
So like a chocolate cupcake. And really, who doesn’t love cupcakes?
It rocks!
No, really. Awesome color scheme. I think your icon should go back to a controller though.
Reply
I was trying to think of a name for this design, as I went with “back in black” and “pretty in pink” for a couple previous versions. But I couldn’t come with something remotely clever that wasn’t related to food. It is rather delicious, isn’t it?
I totally forgot about the favicon until I was uploading to the live server. So I quickly threw a new one together. The game controller isn’t the best fit, since my site isn’t just about games. And while I’m definitely partial to the Xbox 360, I wasn’t keen on looking like a fanboy. Any suggestions for something else?
Reply
Why don’t you organize a “name-my-redesign” contest? I have a few: “better in leather” “chill in chocolate” “brewing in brown” “breaking in brown”…
Reply
Thanks to everyone for the feedback and kind words. I totally appreciate it.
Reply
It’s stunning. It’s just you.
Reply
[...] Brett just launched a new design. I really like the way comments are styled. The site has one of the best implementations of [...]
Reply
Wow, looks great!
Reply
This looks awesome! This site really showcases your talent
Reply
Truly great and inspiring work Matt. Really like what you have created. I like your Phase 1 of the Design section, definitely looking forward to seeing how you are going to improve that down the road.
Reply
I’ve got big plans for the design section, which will likely involve it being in it’s own WP installation. Probably be a while before I roll out Phase 2, though.
Reply
Amazing Design Matt!
Reply
Sick design bro. Love the whole look. Great job!
Reply
Excellent work - and congrats on the new design.
I was looking forward to this and rushed to see the site when this post appeared in my Google Reader. : )
One bit of constructive criticism, I would agree with one of the previous posts about your missing “Matt Brett” title at the top of the page.
It was the first thing that I noticed and it feels like it should be there.
I know you were saying you feel uncomfortable (if that’s the right word?) about branding yourself. But have to say, think that’s a non issue at the point because “Matt Brett” is a brand : )
You have a very unique style and should be proud to display your name against it. Especially on your own site.
Anyway, great work as always.
Reply
Yeah… I don’t know. I don’t really feel it’s totally necessary to have my name up there. And as is, there’s no room for it. One thing I wanted to ensure I did better with this redesign, is make better use of my header space. I did have my name in there at one point (which you’ll see shortly), but once I did some re-arranging, I lost that space and wasn’t crazy about it anyway.
Reply
Lovely design Matt. It looks superb. I really like the attention to detail that you’ve done. It really shows dedication.
Sexy.
Reply
Very nice redesign. I stumbled on the page and thought I was seeing things wrong until seen this post. Definitely a huge step up from the black theme you had before.
Reply
Looks great! I love the threaded comments (and I usually can’t stand them). Wonderful work.
Reply
What a pain in the ass the threaded comments were, too! But I’m happy with the outcome and glad I put in the effort. It makes replying to comments a whole lot easier for me, and looks better too.
Reply
[...] If you haven’t already you should definitely go and check out Matt Brett’s awesome redesign. Its been in the works for quite a while, and is a worthy successor to his previous design “Back in black”. I really like the use of all the transparent pngs, gives the whole thing an extra dimension. Read about it here. [...]
Reply
wow… great job. glad you kept the grunge effect, and made it a lot better then previous. big fan of yours.
Reply
GJ on the redesign Matt… as usual.
Meanwhile, what WP plugin(s) did you end up using for your Comment section if I may ask?
Reply
I’m using a very heavily modified version of Brian’s Threaded Comments. And I see now that I still have a bit of work to do. The “your post is waiting to be moderated” functionality isn’t working, and trackbacks are supposed to be separated. I’ll get to them in time.
Reply
Excellent design, Matt! I can tell that you put a great deal of thought into all aspects of this site. Congratulations!
Reply
Great re-design! Love the color scheme! At the same time, it still feels familiar, even t