Post-Thumbnail

I don’t know why I didn’t do this sooner, every blog should have its own unique feel and look. Creativeoverflow is a ongoing project for me and improving it can only be beneficial. I contemplated for quite some time about the look and feel of the theme. I made quite a few sketches and started on designs and then just left them again because I couldn’t feel the energy and compulsion to carry on with it. I got over that phase though and here we are, united with the new Creativeoverflow’s Redesign. The theme took me 3 days to design and finish off and then it took me a week to finish the coding off, all the bits and pieces. I am happy to say though that it is finally finished and all my readers can fully enjoy it as much as I do.

I am going to run you through the basics of the theme in a moment, I just want to say thanks to everyone that has helped me out with Creativeoverflow along the way with support and article promotion, you guys rock.

Body

The original Body size of Creativeoverflow was only 600px wide, I increased that to 640px in this new theme and I can definitely say it looks much better than the smaller body. The sidebar is 300px wide, but the content size is 260px wide. Keeping things organized and good looking is the goal. Hope you enjoy the new theme and let me know what you think of it after you have finished this article.

Header

This new header boasts with some color and a combination of graphics and vectors. I sketched the header out for some ideas and planning on element placement and came up with this in the end. I even photographed one of my Monitors and my mouse and added it in, just adding some personal effects.

Creativeoverflow Logo

Yes that’s right, your looking at the new Creativeoverflow logo. I combined the old one with a bit of new styling, but deciding to keep it simple and elegant. It tells you exactly what its about when you look at it and that is the desired effect that I was looking to achieve. I hope you guys agree with me that its a good looking logo for the block and fits in well.

Post Section

I decided to keep my post look clean and simple, I used Arial as my Title Font with a size of 25p. My Meta-data is straightforward, showcasing the Date, Category and the author of the article. I then added a comment count, just to show the users the amount of comments that each post has. I then decided to use the Excerpt of the post instead of a piece of the content that you then split, simply because it works better and is less trouble to set up. My Thumbnail is run with a custom field and uses a width of 640 x 300 pixels. Underneath the thumbnail I places the Read More and Leave your response Links, Read More opens up the post and Leave Your Response navigates you straight down to the comments section of the post. I decided to keep it clean and simple in this case.

Sharing Section

Inspired by Hongkiat, I have always loved the way they brought the sharing message across. I intended to add my little bit of uniqueness to it and set it up as the base for my post sharing links. Hopefully it attracts some eyes and the posts get voted up quickly.

Comments

I decided to make my comment section known by using a broad comments sign. I kept my comments simple and not to overdone, they are threaded to a depth of 5 and have buttons to reply to a users previous comment. I think it serves a great purpose especially for debating about certain things.

Author page

I have finally setup the About page and Author section on the blog. Giving each author a photo and description with links to their Portfolio/blog and twitter accounts. I thought of keeping it simple and not to complicated. The buttons are normal rollover to black and links to the desired web addresses.

Menu, RSS and Twitter

I created a tiny navigation area about the Feed and Twitter area just to navigate to the main parts of the site which isn’t really connected to posts or anything. Its a simple 4 button rollover nav that rolls over to blue. As for the Feed and Twitter Section I kept it plain text, I’m not very fond of the chick-lets that a lot of people use, but that’s my opinion. You can either subscribe via FEED or E-mail. Be sure to subscribe if you aren’t already.

Advertising

I have decided to restructure my advertising on the blog. As you can see I added a advertising spot to the top of a single post as well. I also made some space for Text Link ads, I have been getting quite a few requests for it so I decided I will it to the blog.

I hope you like the redesign as much as I do, it took me a while to do and I’m happy with it so far. I can assume their are some bugs around, but just shout when you come across anything. Thanks for reading the article and checking out the redesign.

Now I will show you who’s behind creativeoverflow and An1ken.

Thanks guys, help me spread the word with this article and the redesign.

Buffer
About the Author:
Jacques is the CEO and Founder of the An1ken Group. Connect with him: Jacquesvh.com - @Jacquesvh - Facebook - Instagram - Pinterest - Google+

58 Comments so far

  1. Awesome redesign Jacques. My favorite part is the header! Reminds me of Web Designed Depot a little bit. Anyway, great job. I’ll look at the redesign in more detail later.

  2. Social comments and analytics for this post…

    This post was mentioned on Twitter by An1ken: Creativeoverflow’s Redesign, The New Look – http://bit.ly/bRrbdV | @Flipbooks @Minervity @sixrevisions @LoriMoreno @visualswirl @iBlend…

  3. Mike Smith says:

    I like it a lot. The one thing that bugs me is the icon part of the logo is straight lined right next to the letters (C and O). I’d love to have see it curved to match the shape of those letters. If that makes sense? :)

    I do like it a lot though.

  4. Ace says:

    Love the new design! Especially the header!

  5. Sneh Roy says:

    Well done! Everything looks awesome and full of life :)

  6. Kawsar Ali says:

    Nice redesign. Very colorful and creative. Good Luck

  7. John Statin says:

    Awesome redesign wow.

  8. Manuj says:

    Very nice work mate. Very clean design and nice header

  9. Awesomeness! I really like it Jacques. Keep it up mate:)
    .-= Shurandy Thode´s last blog ..Illustrator tips Part 1: Basic shapes, layering and sketch to vector =-.

  10. Richie says:

    Lovely redesign Jacques. You’ve made a stunning header. As the name suggests, its overflowing with creativity. I liked the sharing section., with the huge image :)

    Well, I am surprised that you’ve kept the footer simple !! Is there any reason behind it? :)

    Also, I visited your portfolio. Wow!! Thats one stunning piece of digital art you’ve got there, mate! It looks really professional

    Good job, Jacques

    • Hi Richie, Thanks for the comment, the reason for keeping the footer simple was that I want to incorporate the top piece in the bottom as well. I will be looking into that today.. Glad you like the blog and the portfolio.

      • Richie says:

        Well, that was exactly my next question :D

        You can incorporate similar design like the header. It would be outstanding. Waiting to see it :)

  11. apsorks says:

    When I arrived at the site, and I saw the header, I was impressed! It’s big, bright and beautiful. I love big headers.. they give you a clue of what to expect from the rest of the site. However, at first glance, the Ps, Ai and Dw icons look like they should be buttons; I was actually surprised to find they weren’t, and was a little disappointed!

    Reading further down the page, I noticed the Arial title font, and immediately thought “could have splashed out a little bit more there!” I really don’t think Arial does that great header justice!

    The huge graphics must be a pain for people visiting the site on a slower connection, too, and to my mind just simply use too much space! Sure, it’s nice to have graphics in your posts, but they strike me as being too big!

    Overall, I think it is a really good effort. It’s just minor things, like choice of typography, graphic size, etc, that make the general feel of this blog feel… unpolished, in my opinion.

    I hope you don’t mind my sharing this opinion with you! I’m not saying “eurgh, your site is pants!”, I’m just pointing out what stood out to me!

    I really like the huge, bold “LIKE IT?” sharing section, and the “comments” part.. but where does the green fit in with the blue/white colour scheme? Seems out of place.

    • Thanks for the informative comment, I took you up on some of your advice, I changed the Comments Part to a Blue gradient, moving away from the green. I also changed the font on the titles to something that’s more eye catching, Georgia Font and a secondary Sans-serif, not so boring font. As for the Graphics, I am keeping them as is I am just compressing them for faster load times. The PS, AI, DW could act as pretty cool buttons so I think I will be setting them up as buttons soon, perhaps linking to photoshop tutorials, AI tutorials, Dreamweaver Tutorials. Something in that line.
      Thanks for the comment, appreciate the feedback.

  12. Nice redesign Jacques. You have done a good job on header.
    .-= Smashing Share´s last blog ..Weekly Smashing Web Design Inspiration – #6 =-.

  13. David W. says:

    Wow, I love the design! Only thing I see wrong, is there is no search bar. :D
    .-= David W.´s last blog ..Ghost text tutorial =-.

  14. David W. says:

    Oh, and in Firefox, on the authors page, the site and twitter links aren’t level.

  15. The Landman says:

    This is top notch mate! Hahahaha! You’re such a poser dude! ;)
    .-= The Landman´s last blog ..Digital Painting =-.

  16. Jacques you did an awesome job. I’m with Jad it does remind me a little of WDD but thats def not a bad thing! I love it man!
    .-= Shane Jeffers´s last blog ..10 Popular Design Blogs and How They’d Smell =-.

  17. Tomas says:

    Looks awesome! Great job Jacques. Now I envy your redesign. Hope I’ll redesign WDF soon.
    P.S. there’s a lot of space under footer and it doesn’t look good.
    .-= Tomas´s last blog ..Software Development ABC =-.

  18. craZy says:

    Dude, this redesign is so totally hott.

  19. Colt says:

    very nice indeed – an inspiration ;)

  20. Ben says:

    awesome redesign – I really like wide websites with the average screen resolution 1024×768 you have to have a site thats around 1000 px wide , im redesigning DAE at the moment and definetly gonna have a wide site – hopefully a fluid layout.
    promoted
    .-= Ben´s last blog ..7 Proven Ways to Boost Your Creativity =-.

  21. Well Done Jacques! A big improvement over the last look. It throws me off a little that your sidebar stops after the content. I also was hoping to see a fat footer that extended some of the awesomeness of your header. But a great job, nonetheless. Keep rockin it!
    .-= Chris Thurman´s last blog ..Saturday Swirl 5: Tasty Snacks From the Design Community =-.

  22. sheena says:

    I really love the site Jacques….love the atractive colours and the impact it makes the minute you enter. Also love the large font choice which seperates the content sections…. Really works well!!

    Maybe one suggestion though…. it might be an idea to seperate each of the categories with a slight transparency (kind of like the appearance of rows of a table). Will help to define them better and make take up a bit of the blank space!! Just my two cents :)

    Excellent work….

  23. looks great… reminds me a lot of Web Designer Depot. Great job! I did notice a little white space on top and bottom of the page but that can be easily removed. Also, thanks for including theWebBlend vote button!
    .-= Louis Gubitosi´s last blog ..How to Use Any Font on the Web =-.

  24. Denny says:

    looks great

  25. starr says:

    :O Oh my this is astonishing. What an amazing design. Love it :)
    .-= starr´s last blog ..Truly Amazing Collection of Hypnotic Animations by Davidope =-.

  26. Awesome redesign, great work Jacques! keep it up!
    .-= Andy Feliciotti´s last blog ..Spice up your Gmail Signature in Chrome =-.

  27. Gopal Raju says:

    Well done Jacq! Its creatively overflowing!! :)
    .-= Gopal Raju´s last blog ..Welcome 2010 – A Free Wallpaper For Your Desktop & Iphone =-.

  28. I absolutely love it! So fresh and exciting – yet still so clean! Nice work :D
    .-= Tom | Build That List´s last blog ..The Aweber Code….And Why You Need To Promote It! =-.

  29. Nick Parsons says:

    Awesome work, Jacques! I definitely love the new design. Somehow I had never seen your blog before, but I’ve subscribed to it now and am looking forward to more great content!
    .-= Nick Parsons´s last blog ..5 Steps to an Effective Freelancing Schedule =-.

  30. ManuelN says:

    Awesome redesign, i really like the header so colorful. Nice Done.
    .-= ManuelN´s last blog ..Top 10 jQuery Menus =-.

  31. adi says:

    this is a great effort !! the thinking involved behind each feature is also valid….in few days you will get more clear about it

  32. Whiim says:

    Great new design!
    Love it! :)

  33. Rockin’ job with the redesign man. Looks really good…
    .-= The Pro Designer´s last blog ..23+ Crazy Funny Cubicle Pranks =-.

  34. Dimi says:

    Beautiful, great work!!

  35. Ben says:

    Just out of interest, what did it look like before?
    .-= Ben´s last blog ..Create a Glossy CSS Menu =-.

  36. mfl jerseys says:

    thank u for ur sharing,

  37. Nice. Thanks for sharing.

  38. Nice post. You seem to be well versed with your design skills.The design really overflowed my thoughts.

  39. Good effort and hard work surely pays you back.

  40. [...] This post was mentioned on Twitter by Davin and Samantha, Ellsworth. Ellsworth said: http://bit.ly/a4eiRt http://bit.ly/aOsZF8 Installing Gnome on Kubuntu [...]

  41. Very creative design. Thanks for the beautiful work.

  42. apaajanews says:

    can’t say a word,just bookmark it

Have your Say