I’ve been chatting up a redesign for MyInkBlog on Twitter and this site for quite some time now. The redesign/rebranding of my blog has proven to be one of the most challenging design jobs I’ve ever had to complete. I’m not at all surprised that most designers are their own worst enemy, and I was certainly no exception to that theory. I mocked up a new design, threw it out, then started again about 5 times before completing the design iteration you’re seeing now. I’m pretty stoked with the final result, but I’ll never be fully satisfied; more tweaks and changes are sure to come.
About the New Logo
The first thing I did when I started to brainstorm for the redesign was to rethink the logo. I figured most of the branding and styling would fall into place much smoother after that. I’m not sure it actually did, but it seemed like a good place to begin.
I was definitely ready for a new logo, the previous one had begun to feel dated, and unoriginal. I wanted something more customized, something that fit my blog’s style and personality a little better.
Out With the Old
In With the New
For my new logo I began sketching on paper, long before I ever opened up a design program. I hashed out a bunch of different ideas before going with Museo for the words ‘My’ and ‘Blog’. The ‘Ink’ portion of the logo is a customized script I created from my drawings. I scanned in my sketch and traced ‘Ink’ with the pen tool in Illustrator. A few more tweaks later, and that’s the new logo you see now.
Typography
One of my main concerns obsessions with the redesign was improving the site’s typography. Site’s like Brian Hoff’s and Elliot Jay Stock’s have always inspired me because of their attention to detail in this crucial area. The aesthetics and readability of a site are so important to me, and most every designer, so being a design-focused blog I really wanted to make some considerable improvements in this area.
Utilizing Typekit
For the headers, I felt that I needed a unique, bold, but simple font. I decided to check into Typekit and look through the awesome new options that are available. Forever limited to web-safe fonts, it was quite liberating to have an exhausting array of choices at my disposal. I eventually selected Ronnia condensed bold.
The sidebar headers are a serif font stack headed by Palatino. Other meticulous decisions were made on spacing, contrasting levels of grays, and the new, more vibrant blue that you see for the links.
Comment Improvements
I also spent a considerable amount of time trying to improve the comments area. After all, you folks and the discussions that you help create, are vital to the health of this blog. I made an effort to improve the styling, and added threaded comments. So you can now directly respond to anyone’s comment.
Having Fun With CSS 3
I’ve spoke often on this blog about how awesome I think the features in CSS 3 are. It rocks that only 17% of my visitors use IE. That gave me plenty of confidence to use styles like rounded corners and box shadows. It’s nice to add a bunch of progressive enhancements knowing that many of you will get to enjoy them.
I didn’t completely ignore my IE users. I added DD Roundies to the corners for most of the divs that needed them, and I did my best to make this site look good in IE 7 & 8. I did run into a few unexpected, frustrating issues, but I suppose those areas will just have to be examples of graceful degradation. As far as IE 6 is concerned, I very consciously did not support it. The joy of running a design-focused blog is that less than 3% of my readers use IE 6. And if sites like YouTube can stop supporting it, then I think MyInkBlog can as well :)
Author Pages
MyInkBlog is far from a 1-man-show. There are a lot of talented authors that drive the content on this blog. I wanted to add more ways to highlight who they are, and what they’ve done. Every author now has an author page with their bio, links, and the articles they’ve written.
Category Navigation & Search
I have future plans to organize the navigation even more efficiently, but for now I’m happy to have the category links in a more prevalent location. I hope that moving the nav to the top of every page helps you find what you are looking for even quicker. In the same breadth of usability I moved the search bar to the header.
Big Ole Footer
I really like the trend of designing big, informative footers on blogs, so I decided to join that club. I figured it was a great place to add some inspiration, twitter updates, friend icons, and site info. The footer was one of the places on the blog that I tried to infuse a little more personality, but I hope that shows throughout the site.
More On the Way
I’ve got a bunch of future plans bouncing around in my head, but if I tried to accomplish everything at once I may never actually launch this redesign. I’ll leave those plans as a teaser for next time. On a side note, this is actually my 3rd version of MyInkBlog, but unfortunately I couldn’t find a screenshot of how terrible the first version looked.
Your Thoughts & Feedback
I’m really looking forward to getting your feedback. Staring at your own design too long makes you blind to the obvious bugs and usability issues that persist. So drop me a comment and give me an honest assessment of what you think. Hopefully I can use your invaluable feedback to improve and refine this design even further.
If this post was helpful to you, please consider sharing it with others, it's a great way of saying thanks.
Contribute
piervix
February 9, 2010
Great job dear Andrew. It is clean and fresh… I really like the footer!
Good luck!
Walter
February 9, 2010
Loving the new design, great job Andrew. I’d make the rollover on the menu be yellow like the logo. Just an idea :)
Andrew Houle
February 10, 2010
Thanks Walter. Glad to hear you like the redesign. I’ve always been a big fan of your site and the bold, vibrant design you’ve created! I think I will give the yellow highlight a try, a few other people have made that suggestion as well.
Angie Bowen
February 9, 2010
I absolutely love the redesign Andrew. Both the header & footer look awesome!
Rob Bowen
February 9, 2010
Looking good, Andrew! Definitely looking good. Very sleek and sharp. Sign me up as a fan!
jPomfret
February 9, 2010
OOO nice. loving the new look! good job
Chad Mueller
February 10, 2010
Great redesign Andrew, looks very professional and makes reading a pleasure.. I do agree with Jacob and Walter…
Making the category menu hover links yellow to match your logo – and I am unsure of the blue links around the site – I understand users see blue as the default link colour, but I would like to see some yellow links possibly…
Really like the footer typography as well… great job
vectorss
February 9, 2010
Very nice redesign. Great
Preston D Lee
February 9, 2010
Andrew, I love the new look. It’s cleaner and very beautiful. Many of the usability issues you addressed were vital ones that I addressed when redesigning GDB as well a month or so ago.
I have to admit, I miss the splatter. Even if it was just a background thought in addition to the design (not necessarily part of the logo, just the theme) then I would feel like I’m where I want to be.
The splatter said “Ink blog” to me–I think it needs to be kept somehow.
Anyway, just a few thoughts. I love the new design. Thanks for sharing the process and motivation behind it.
Andrew Houle
February 10, 2010
Thanks for the feedback. In some ways I miss the splatter as well, but I like the simplicity of the new logo and site. Maybe I can work a splatter into the background at some point down the road though :)
sriganesh
February 9, 2010
Andrew , its a great job. the new logo is unique and the new looks give me new feel. and the footer is with round corners – i seen very few has this. good going :)
Amey
February 9, 2010
Nice redesign. Inspiring me to do something.
Tim Smith
February 9, 2010
Wow! I remember when you first showed me the PSD for the re-design! The site looks great and I also appreciate the adjustments that you’ve made to the UX.
I’m also loving the footer. Useful, practical and… sexy. I don’t know how else to say that.
Overall… great job! I knew you’d deliver an awesome new design :-)
Brian Lovin
February 9, 2010
Wow, a 100% improvement Andrew. Beautiful attention to detail! Congrats on the redesign and keep up the good work on MyInkBlog.
Anna
February 9, 2010
I like this re-design. The logo looks good to me (I like the yellow black color combination). Subtle texture is also a nice touch. Good job!
Aaron Irizarry
February 9, 2010
Congrats on the makeover buddy looks great!
designfollow
February 9, 2010
very nice design.
Good luck.
Martin
February 9, 2010
Wow a beautiful re-design.
I’m a big fan of the new logo and that huge footer is awesome, all these great re-designs are making me itchy to re-do my site!
BebopDesigner
February 9, 2010
Wow! Looks fantastic. Congratulations guys!
Tracey Grady
February 9, 2010
I’m really impressed with the new look for your site and logo. Thanks for sharing the process you went through. I feel encouraged for when I get to work on my own redesign in the not too distant future.
Louis Gubitosi
February 9, 2010
slick Andrew, very slick… I love the new logo and the attention to detail in the new layout. Really good job man!
FAQPAL
February 9, 2010
Looks fantastic, good job guys.
Sneh Roy
February 9, 2010
Well Done Andrew! And congratulations :) So loving the new logo and I really like how you have still stayed true to your roots. Great Job!
Richie
February 9, 2010
ooooo … Love the redesign. The logo looks authentic, Andrew. The footer is simply brilliant. Excellent Job. Keep up the good work, pal :)
Waheed Akhtar
February 10, 2010
Thats awesome work Andrew. Very well done with the new design. Love it specially footer :)
Marco
February 10, 2010
Looks very good and professional – well done mate!
Alicia
February 10, 2010
I’m definitely liking the redesign, the large footer and the author pages are a nice touch.
I was a fan of the old ink splatter logo, but I think I’ll like the new one just as much. :)
Xpirt Design
February 10, 2010
Lookin’ good. Real good! The new commenting styles are great too
Thorsten
February 10, 2010
Nice redesign, great job Andrew. Especially the footer looks good.
Kevin
February 10, 2010
The new look is great. Really sleek and clean!
Andrew Houle
February 10, 2010
Wow! I’m flattered and thankful for all the encouraging feedback. It’s nice to see the new design go over so well, I poured a lot of time and effort into it. Thanks for taking the time to comment.
Mathew Carpenter
February 10, 2010
Congratulations Andrew on a successful redesign. I absolutely love the new logo – so much better then the old one. Everything about the new website looks and feels great. Well done!
Franz Jeitz
February 10, 2010
Hey Andrew. Congrats on the new design. I especially love the footer & typography work. Keep up the great work. You’re a big asset to the design community!
Chris Spooner
February 10, 2010
Sleek new look indeed! I’m a big fan of the contrast between light and dark – works really well
Adrian Bornea
February 10, 2010
I love the design and also the logo, but the “I” looks more like and “l(L)”
Warren
February 10, 2010
Nice work bro, but the h3 tags are displaying a little wonky. I’m running ff on Windows 7 . . .
Andrew Houle
February 10, 2010
I wonder what the deal is with that. I had another person send my a screenshot in a win7, FF 3.5 environment that looked pretty crazy. I’ll keep digging to find out why that’s happening.
Shannon - SKS Designs
February 10, 2010
Love the new design but the “ink” reminds me a little of the Chase Ink credit card… glad you went with yellow instead of blue.
Great work with the entire design though!
Andrew Houle
February 10, 2010
It’s funny you mentioned that. I had actually finished the logo about 6 months ago, before I ever saw their ‘ink’ campaign. Then a couple months later one of their ads came on, and I couldn’t believe they went with an ‘ink’ branding like that. Oh well, I suppose I can’t have the market cornered on a word :)
Nonny
February 10, 2010
I came to your site from a twitter link, liked it, disabled adblock, then saw you had what appears to be 10,000 ads in the right sidebar that pushes any useful content way down, and then promptly put adblock on again.
Think about it – why don’t you just raise your rates and sell LESS space? You’ll probably make the same amount of money, if not more, and your advertisers would get far more attention from users. Simple supply and demand man. This is freaking awful right now. I dont care about any of those ads right now because there are so many of them, none of them stand out.
Andrew Houle
February 10, 2010
Sorry the ads were such a disturbance for you. All of my sponsors offer useful services to the design community and I’m stoked to have them on board. Their sponsorship makes the amount of time I spend developing this blog possible.
Chris Thurman
February 10, 2010
The logo and the footer are definitely my favorite parts, although I like it all. Great work Andrew! I know it must feel great to get this done.
Mark James
February 10, 2010
Love the new look, keep up the good work!
David Leggett
February 10, 2010
It just keeps getting better Andrew :)
Andrew Houle
February 10, 2010
Thanks David! That means a bunch from you. I drew a lot of inspiration from the Tutorial 9 redesign :)
Romi
February 10, 2010
new design look really great i love black and white work a lot great job
Bruno Moniz
February 10, 2010
It’s awesome… The typography, the colors, all together.
Excuse me, i must pick up my chin from the floor!
The Geek Talk
February 10, 2010
Very clean and beautiful, i love your footer section, good job
Umut Muhaddisoglu
February 10, 2010
Everything looks very clean and slick. Loved the new logo too.
Jason
February 10, 2010
I like it, great job!
Kennedy's Garage
February 10, 2010
Great new look. I love the new logo and for a dark looking website, you nailed it! I always love seeing a website redesign for the better.
Liam McCabe
February 10, 2010
Beautiful Andrew.
The logo is simple superb and is beautifully complimented by the textured background.
You have done a wonderful job with the typography. :)
If I had any critique it would be the use of the light blue links, it would be nice if you could use the orange/yellow used in the logo throughout the design, however I understand that this may look a little bright on a white background (ugh had that problem over at CD :( )
Nonetheless, a huge improvement Andrew, I’m sure the content will continue to be as awesome as ever :)
Andrew Houle
February 10, 2010
Thanks for the kind words and feedback. Yeah, as you well know from your blog colors, yellow on white just does not work, but I may try some more tweaks on the link color.
Lisa
February 10, 2010
It’s lover-ly! Crisp, super-clean and your attention to the commenting area is much appreciated. I’m inspired!
chris
February 10, 2010
W.O.N.D.E.R.F.U.L all these details!
Murlu
February 10, 2010
Wow, this is really nice looking, congrats!
I must say, I kind of liked the ink spot :( but the new logo is very enjoyable :)
Rickard
February 10, 2010
Hey man,
Like the site. The development of the logo leaves the old one in the dust.
Keep it coming…
Jacob Cass
February 10, 2010
Really feeling this new redesign Andrew, you must be happy. Great job. It’s interesting reading about your design choices as I am also in the midst of redesigning JCD, with a similar layout as yours. I really like the footer!
I have one nitpick about the ‘Ink’ part of your logo, it doesn’t seem smooth flowing, in particular the ‘I’ and how it curves back around. I think some small adjustments or a redraw of it will bring it out even more.
I’d also make the links easier to distinguish (light blue is too similar) and maybe the menu rollovers to be another colour (yellow?)
Also, the INK logo as the pic in the comments, I thought these were coming from you, but were in fact guests. Maybe worth changing.
All in all, great job!
Andrew Houle
February 10, 2010
Glad you liked the new design. I’m really looking forward to checking out the JCD redesign when it’s ready. I’m sure it’s gonna be awesome.
Thanks also for your very helpful feedback. I will definitely consider your logo suggestions in my next design iteration. I see what you’re saying on the guest avatars. I’m gonna rethink those.
Bilal Çınarlı
February 10, 2010
Nice and slick new design, but theme’s source code is really messy and not readable :(
Shurandy Thode
February 10, 2010
I love this new design. Much better and friendly for the eyes than the previous one. Nice job Andrew. :)
Damian Herrington
February 10, 2010
Nice design, really like it and a great read above into your thoughts and processes.
Adam Wagner
February 10, 2010
Really nice execution (and explanation) Andrew.
Jeff Finley
February 10, 2010
Nice design! Much more inspiring than the last. Nice use of Typekit, but I don’t really like what it does to your headlines.
Andrew Houle
February 10, 2010
Thanks Jeff. Ugh, the weird fonts must be a windows environment thing because a few other people mentioned this. It’s weird cause it looks ok in my winxp FF/IE virtual machine I have setup for testing on my Mac. I’m gonna have to do some testing on a win7 machine.
Rype
February 10, 2010
Love the new design!
Suhela
February 10, 2010
New design is looking gr8…
Timothy Blake
February 10, 2010
Wow the site design is just amazing i love it, The new logo looks super sexy great job!!!
Blake
February 10, 2010
Looks great! The hard work will definitely pay off!
Aaron
February 10, 2010
Really like the new design. Keep up the good work
Alvaro Brackins
February 10, 2010
Excellent blog, showing maturity in your response. I should just give up and take lessons from you
Follow me on Twitter
Nikola Lazarevic
February 10, 2010
Excellent work Andrew! Congratulations :)
Everything is in place. Love the new logo and big footer
jared thompson
February 10, 2010
really digging the new logo, and a big fan of the footer. so organized and something i would love to make myself in the future. Kudos on it all! most definitely a great re-brand and a new look to admire.
promoted as ever with a great article :)
Lea Botwinick
February 10, 2010
I see I’m late to the party, but better late then never – congrats on the new site design. Wicked choice of colors and loving the contrast!
Thanks for sharing your design process as well. I’m on version 5 of my own site and know how rewarding it could be.
Keep the good work coming!
Mihai O.
February 10, 2010
This is one great design, good job Andrew :)
Tony
February 10, 2010
Congratulations on your new design…love it!
Andrew
February 10, 2010
I have to say, I am quite enjoying the new design.
Only thing I would say is it would be nice to insert a little CSS fix to remove the border that appears around links after they are clicked.
If you just add “outline: none;” to your basic link class, the problem should go away.
Other than that, I am really enjoying the site, nice work.
Matan
February 11, 2010
Excellent! This is way better than the old design.
I actually really like the navigation bar as it is now. Maybe just add some minimalistic hover effect and it’ll be perfect :)
Tanaka13 - Créations du Net
February 11, 2010
A really nice and enjoyable redesign. Very nice footer too, lots of useful infos ;) Clean and sharp logo too.
Ivan Mišić
February 11, 2010
Great redesign :-)
James Qu
February 11, 2010
Hello Andrew, the new design looks absolutely great! clean and fresh :)
the new logo is wonderful and I love the representation of the word “ink”, very exciting!
Graphic Design Blog
February 11, 2010
Hey Andrew…congrats on the successful redesign and truly “Ink” is written beautifully. The footer also looks nice…now i am having itchy fingers for my blog design too ;)
Stratos
February 11, 2010
Very nice change! It looks awesome. I loved the colors!
Benjamin Rama
February 11, 2010
wow you got a great response , I hope I get the same when I have a redesign in a couple of years . Excellent re-design – like I said before I love the footer Overall looks v smart
- awesome design + awesome content = awesome blog
Tomas
February 11, 2010
Redesign looks great, refreshing and imroved. Good luck!
Laurent Jouvin
February 11, 2010
Yeah… I liked the splatter as well. Like you said, you might be able to add it back in later down the road… perhaps a more iconic version of it. You’ve taken a complete different route and I like it. It takes a lot of courage to make a change of that size. Great job!
Joshua Smibert
February 12, 2010
Great stuff Andrew. Very clean. I love that it ties information together intuitively. Congrats.
Ben Sky
February 12, 2010
The new logo is SO much better, great job.. love it.
Kitty
February 13, 2010
Congratulations on your new look! Just in time for the new year (the Chinese that is)… Looks great! Keep up the great work for all the amazing stuff you do for the design community!
Angela Shetler
February 13, 2010
Out of all the great updates to the look of your blog, I have to say the new logo is my favorite. Absolutely love it.
RUGRLN
February 14, 2010
Wow….this is fantastic Andrew!!
Very modern…very W2.0…very cool!
A fantastic redesign!!
Tutozed
February 15, 2010
Perfect ! i love it
Aidan
March 3, 2010
There are no perfect design but good design. The re-design definitely show maturity and experiences being put to good use.
Really liked the new looks! Though I would like the typography to be just a bit bigger. :)
JTT Designs
March 3, 2010
I really like the new slick style you put on the design. Simple, but it brings out the essence of what you are about!
I also love the information on the website. Packed with a lot of useful tips and tricks.
Dany
March 5, 2010
Amazing job. I just can spend hours on your website admiring the design and enjoying the content!
dj quietstorm
March 8, 2010
Respect! I love the detail that you’ve put into every corner of your world here. The type and the colors and the spacing makes it a pleasure to be here. Oh, and thanks for the _content_, too!