Introduction in New Designmodo

This week, we’ve decided to launch a new website design which has already gotten a lot of positive feedback on Twitter, thanks to you. Now, we are officially rolling out the new design and sharing the new features with you.

Here’s what’s new and why we’ve decided to change the design, including the switch from a dark theme to bright, light scheme.

New Logo

The logo is radically different from the previous one. In addition to the logo itself, we have a beautiful icon, including a stylized “e”. The source of inspiration for this letter is the spiral related to the Fibonacci sequence (short video).

Sketch

Designmodo Logo

Final version

Designmodo Logo Designmodo Logo Designmodo Icon

The logo was created by Higher studio, Slovakia based branding agency. Check out the other work from this studio on Behance as well. Higher is one of the most appreciated and followed branding agency at Behance.

Readability / Typography / Menu / Icons

We’ve decided to increase the readability of text on the site by changing the typeface. We used two types of fonts: Open Sans and Varela Round. To ensure these fonts visible across browser platforms, we used Google Web Fonts.

We made the site menu floating so it will be easier and more convenient to navigate across the website pages. On the website, in the menu and in the content itself, DesignModo icons were used: Unicons and Linecons (soon we will share them with you on Smashing Magazine). All icons were converted into fonts using the IcoMoon service.

The number categories of featured articles was reduced, unnecessary categories were removed, and now we will feature only web design and web development articles.

Shop

The shop pages were completely updated. The first page includes a listing of products, and the product listings are more intuitive and easier to buy. Also, in the shop, you will find a benefits page telling you about the advantages of our products and how they can help you in your work.

The affiliates page has changed as well and you will find a brief presentation of why you should participate in the program and its benefits to you. We even have a couple of banners that you can put on your sites.

We cut 50% of ads

Since we’ve decided to increase the readability of the content, it would be logical to remove several ad units. We understand that this will affect our budget, but at the moment, we want to provide you with good stuff in an easy and readable format.

Do not forget to thank our sponsors, as they help us deliver great content and products to you.

Responsive Design

Responsive design is part of the redesign. Designmodo can now be easily viewed from mobile devices, as it is fully responsive.

Designmodo Responsive Design

Comments / Appreciations

Comments on the site became more alive with the introduction of evaluation of comments, and those comments accumulating negative feedback will be hidden.

Comment Example

Contact Form

We have a new contact form if you want to send us a message. Now, our customers can easily contact us, and readers will be able to recommend interesting links or articles which we will happily share.

Content

Site content is important to us and a vital part of the redesign. We are looking for new writers on a regular basis. If you write articles on the topics of web design and web development, tutorials (Photoshop, Illustrator, CSS3, HTML5, jQuery) or graphic elements, we would like to talk to you. Share this information with your friends.

Who worked on the Design and functionality?

Leave your comments, recommendations or errors found on the site in the comments (maybe we’ve missed something).

If you would like to be kept up to date with our posts, you can follow us on Twitter, Facebook, Google+, or even by subscribing to our RSS Feed.

Newsletter

58 Comments
  1. Gomah Dec 12, 1:59 pm

    Very nice & clean design guys!

    Reply
    +24
  2. Lauren Dec 12, 2:07 pm

    New look is awesome. New logo is very clean and inspired. Good idea to inspired from Fibonacci sequence, original!

    One step ahead guys.

    Reply
    +5
  3. Vezu Dec 12, 2:08 pm

    Very nice and clean, but why is everyone launch a new site this month?

    Reply
    +9
    • Peter Dec 12, 2:12 pm

      Who launched? I know only about Mashable.

      Anyway, congratulation for Designmodo! Very good work. Design and Logo = very good combination and colors.

      Reply
      +1
      • Vezu Dec 12, 2:51 pm

        Youtube changed in the last couple of days, Marshable, Heroku changed a lot of their design, Mediatemple, Tympanus who do the cordops tuts, the list goes on. :)

        Reply
        +9
      • Vezu Dec 12, 2:57 pm

        ohh and skillpages.com

        Reply
        +1
    • Mark Dec 13, 6:16 pm

      MySpace also changed.

      Reply
      0
  4. infatex Dec 12, 2:17 pm

    Something unique and creative design

    Reply
    0
  5. Tom Dec 12, 2:26 pm

    Good responsive, tested :) Love your minimalism.

    Reply
    +4
  6. Niall Dec 12, 2:51 pm

    This is a nice redesign, and the logo is well-realized, but unfortunately the version used on your header is really aliased and pixellated. Perhaps you could make it slightly larger, or remake the image file for it instead, but it’s a shame to have it shown as it is when the artwork is clearly nicely rendered.
    Niall

    Reply
    +7
    • Adrian Dec 12, 3:00 pm

      Yes, we will change logo from header, but you need to know – he is optimized for retina display.

      Reply
      +4
      • Sergio Dec 12, 3:07 pm

        Logo looks very good on retina. However, I do not know how many visitors has retina displays…

        Reply
        +4
      • Valeriu Dec 12, 5:31 pm

        You can use two images, one for normal pc and one for retina, using media queries.

        Reply
        +4
  7. Marlin Jackson Dec 12, 2:58 pm

    Fantastic redesign although the blue colour doesn’t work for me…really I don’t to be reminded that I need to check facebook again after browsing designmodo.com

    Reply
    +7
  8. Brown Dec 12, 3:19 pm

    Fibonacci sequence for icon – brilliant idea.

    Reply
    +7
  9. Kenjiro Dec 12, 3:19 pm

    Hidden due to low comment rating. Click here to see.

    Reply
    -11
    • Hector Dec 12, 3:26 pm

      Wrong, http://bit.ly/W5vly5 is not the same, for sure, open your eyes! Or, you are branding expert?

      good job guys, nice design and good functionality.

      thanks.

      Reply
      +11
      • Higher Dec 12, 3:43 pm

        LOL :D Thank you Hector

        Reply
        +3
      • Thomas Dec 13, 1:57 pm

        Have you gone nuts?
        Just having a thicker outline and some tilts mean its a different one?

        At least you really know what is branding?

        Reply
        0
    • Kaiser Dec 12, 4:38 pm

      @Kenjiro Debian logo (icon) is the union of a spiral and Enzo symbol :)
      These two logos are totally different.

      Reply
      +5
  10. hnrch02 Dec 12, 3:19 pm

    I absolutely love your new design, it is gorgeous! There is one thing you could optimize though: The two separated link tags responsible for loding in the fonts could be combined into one single request by simple using , thus saving bandwidth and achieving an even faster loading time.

    Reply
    +5
    • hnrch02 Dec 12, 3:25 pm

      Should have known that HTML tags are not allowed…
      Anyway, combining the two tags is very easy. Just use one tag with the href = “http://fonts.googleapis.com/css?family=Open+Sans|Varela+Round” and that’s it.

      Reply
      +7
      • Ricardo Nunes Dec 12, 5:58 pm

        This works? Never heard nothing about this…

        Reply
        0
        • Rochester Dec 12, 7:15 pm

          Yes it is, google will automatically generate this for you while selecting multiple fonts…

          Btw new designmodo is awesome! You guys have done a great job

          Reply
          +2
  11. TimMH Dec 12, 3:39 pm

    Nice new design, however for me it is a tad close to SpeckyBoy.com look and feel which has also been going for some time as a design blog akin to yourselves. I would of expected you to stand out from the crowd a little more.

    Nice to see responsive design howver.

    Reply
    +3
  12. Tony Westwell Dec 12, 4:23 pm

    Very nice upgrade, smooth as silk.

    Reply
    +2
  13. Ricardo Nunes Dec 12, 5:56 pm

    The work of higher is always top quality!! I’m following his work for a long time and this guy really have quality on his mind.

    Reply
    +6
  14. mayra Dec 12, 6:23 pm

    I really like your clean design and love the idea that your website is finally responsive!

    Reply
    +4
  15. Andrea Huntley Dec 12, 6:23 pm

    Love the new look, but after reading the comments, I now see the Facebook-color connection… wish I could un-see it now! Still think it was a great idea to not only showcase the new designs, but to explain why the changes were made… Very helpful to both the design community and the layman!

    Reply
    0
  16. Reebayroo Dec 12, 6:30 pm

    Everything is really nice, EXCEPT the Facebook colors.

    Reply
    +4
  17. Gabor Dec 12, 6:39 pm

    The first thing what I like is the improved readability. This is very good. Less ads is also good, but I think it is not a point.

    Two icons what I dislike:
    - menu icon from Android land, what is not communicate anything
    - share icon, what is not communicate about sharing.

    Improvement suggestion: please increase the contrast. Headers are good but the paragraphs are too light gray. (on calibrated CRT)

    Best,
    Gabor

    Reply
    +1
  18. Cory Dec 12, 6:54 pm

    Facebook colors? You are crazy guys or blinds? – http://i3.minus.com/ijyV9YvnCZJEu.png

    Blue has different shades. Shocked, yes? O_O

    Reply
    +1
    • Reebayroo Dec 12, 8:00 pm

      They are pretty close! And so is the logo with Debian. They are not equal for sure, but I can show this colors to any person and they will ask: hey aren’t these Facebook colors?

      Reply
      +2
      • Higher Dec 13, 12:20 pm

        I think it is not an issue in all. If Facebook have blue, Coca-Cola have red these are not mean that DesignModo or anyone else can’t use blue and red.

        Not an issue in all.

        Reply
        +2
  19. Prathap Dec 12, 7:04 pm

    Responsive ok but I still liked the old design. black and bright

    Reply
    +4
  20. dennis Dec 12, 7:22 pm

    I’ve been following your blog for awhile now. Great information…and fantastic design. Readability is great. Super Clean!!

    Reply
    +2
  21. Gabriel Anderson Dec 12, 8:33 pm

    Beautiful Beautiful Beautiful… I love the news design, but it remember me Windows 8 with animations of the menu
    Congratulations!!!

    Reply
    +1
  22. Sergio Dec 12, 10:37 pm

    I read regularly Desigmodo, and I was quite surprised when looking at the redesign. You guys are amazing. I love this blog.

    Reply
    +2
  23. Nick Dec 13, 12:59 am

    LOVE LOVE LOVE THE NEW DESIGN! ITS ABOUT TIME!!! :D :D :D great stuff. You nailed it

    Reply
    0
  24. Skweekah Dec 13, 3:22 am

    It’s a very simple, clean design. I emphasise the word ‘simple’, but it does its intended job, which is to inform. Content is King in this case.

    Reply
    +2
  25. Aalim Chin Dec 13, 9:08 am

    This isn’t the DesignModo I came to know and love. It looks so different lol. Its nice but I think you should have kept the old colors!

    Reply
    +2
  26. timdesain Dec 13, 11:38 am

    nice design. minimalism. simplicity. readable.

    Reply
    +2
  27. You Creatives Dec 13, 11:48 am

    Amazing Work! Clean and effective!
    Keep the good work!
    Regards

    Reply
    +1
  28. Fabien Dec 13, 1:18 pm

    Clean and Simple, good Job ;)

    Reply
    +1
  29. Jay Dec 13, 3:35 pm

    I just LOVE the new design !!!
    Just one thing… The Facebook “Like” Plug-in is cut on the right… :(
    This is nothing… But this is what makes this new design Not perfect…
    SAD!….
    Otherwise, a GREAT inspiration, as usual !!

    Reply
    +1
  30. Jay Dec 14, 2:17 pm

    Sure I could make a screenshot, but how fo I send it to You ?!!!
    Well, just try this page with IE9, Firefox 17 or Chrome and you will see what I mean ;)
    Nevertheless, It is fine with Safari… I guess you use Safari ;)

    Reply
    0
  31. Rishi Dec 16, 9:42 pm

    Truly saying, the new design color combination is really cool. The typography could be good until unless you want to use external webfonts. Overall, great design.

    Reply
    0
  32. migaber Dec 18, 11:27 pm

    GOOOOD, very good website and really Thank you for your tutorials

    Reply
    +1
  33. Abbas Dec 19, 1:46 pm

    Really good design.
    Very clean and nice

    Reply
    +3
  34. Kevin Oliveira Dec 20, 10:46 pm

    Very good, Adrian, minimalism and my attention was what happened when I saw the new designmodo.

    Congratulations, a hug and success! ;)

    Reply
    +1

Leave a Reply

*
* Minimum length: 20 characters