Vote Today For Your Favorite Coding4Fun Redesign


As I mentioned in my previous post, we are redesigning Coding4Fun and we want *you* to help choose the new design.

Redesign Summary
The current content on Coding4Fun is disorganized and primarily structured by author or event. This makes it frustrating to find the content on the site. For Coding4Fun v2, we are redesigning the site content into four major categories driven off the Coding4Fun blog:


  • Windows – Utilities, Sidebar gadgets, etc
  • Web – Web apps, mashups,etc
  • Gaming – 2D games, graphics mods, etc
  • Hardware – Robotics, web cams, etc

Content is *not* mutually exclusive so that an article like Dance, Dance Revolution which would be in both the hardware and game categories. In addition we’ll have a “News” and an “Events” category, the former being a blog with aspirations to be half as good as the Makezine blog (kudos to Phil).


Feedback
Feedback on our design is open to anyone, feel free to respond directly in the comments here. Make your feedback constructive, and be as specific as possible about what aspects of the design you do/don’t like. You can of course mix and match feedback, like part of design 1 and part of design 2. The better your feedback, the more likely we are to act on it.


Popularity contest
Yes, this is a shameless popularity contest (most popular design wins) although there are no rules, be nice and don’t vote more than once. Deadline Since we have a lot of cool content just waiting for the redesign to finish, the deadline for voting will be one week, by Wednesday September 27th for this round of feedback. Future deadlines for the sub-pages (like the gaming, and Web catgories) may be even shorter so stay tuned!


The Designs
The designs below are *conceptual* designs for the Coding4Fun home page (level1). In total, there are six different designs listed in alphabetical order. Click on the design thumbnails below to open the full-size image.

Design #1 – Clean Orange


 


Design #2 – Comic


 


Design #3 – Glass


 


Design #4 – illo


 


Design #5 – Metal


 


Design #6 – Vista


Vote Now!

Comments (175)

  1. Kent Sharkey says:

    Design #1: Yawn. Nice design, but it doesn’t really carry the C4F feel

    #2: Personally, I like it. Few possible problems – lawsuit from Marvel enterprises for the Web gag, and the section graphics are too big.

    #3: Looks too much like a bad PHPBB site

    #4: Like it

    #5: Meh. Reflections are the new drop shadows, and brushed metal is so yesterday.

    #6: Meh, part 2. I’d vote against it solely on the name, but graphically it looks like a green version of the Mac desktop graphic.

    If I were to order them in preference, I’d say: 2, 4, 1, 6, 5, 3

  2. Dirty Harry says:

    For me, either, the comic or the metal style fit best for coding4fun. The others are nice, too. But they look too seriously, not like fun.

  3. Metal says:

    Looks GREAT!!

  4. Yusuf Incekara says:

    Clean orange

  5. Stefan Haubold says:

    Metal!

  6. webmixer says:

    Design #1 – Clean Orange, clean, sober, readable…

  7. Christopher Gunn says:

    Design #3 is the Best

    I like this one the best mainly because some of the articles being under the Categories. As well as it being aseptically pleasing and the lack of clutter.

    Design 5 (second  best), I love the pictures but the bottom right-hand corner is far too empty.

    Design 1 is far too in your face as well as cluttered – too much space wasted on the picture. Design 2 is just plain horrible – enough said. Design 4 reminds me of greenies – not something one wants to see on a site like this one.  Design 6 is very cluttered – too much information far too close together – mainly  the categories area and their descriptions.

  8. My Votes in order of popularity (1 being higest)

    No 1 – Glass

    No 2 – Comic (damn cool)

    No 3 – Vista

    No 4 – Metal

    No 5 – Lilo

    No 6 – Clean Orange (too much like Microsoft marketing)

  9. Ma says:

    I vote for "Design #3 – Glass"

  10. Fabricio says:

    My vote goes to "Metal" skin.

  11. Micah says:

    Design #6 – Vista

  12. I think "Design #3 – Glass" is really good because not only lookwise content presentation wise also it is good.

  13. Josh says:

    Upon review of the given designs, I have concluded that I like design #1 the most.  I haven’t seen too many orange sites, but I really like this one.  I like the < > in the header image.  

    I also like the Comic, after all, we are coding for fun 😉

    I’m not too fond of the Glass or Metal designs; although they do look very nice, there’s enough websites out there with these themes already.

  14. Stephen says:

    My votes for the clean orange design

  15. Eric S says:

    Design #5 – Metal

  16. I like the "Clean Orange", but I would make the banner graphic smaller and try out different colors other than the burnt orange…

  17. Daniel Palmer says:

    I use the Coding4Fun site almost daily. I am 14 years old, and the only reason i want to learn to program is so that I can write cool programs to show off to my friends and games. However, I am still learning while having fun. Please use the METAL theme because it looks so cool. No1, I think is too business like. No2 is far too immature for most of the people I would imagine visit the site, and I believe it will turn away people who haven’t seen the site before (i wouldn’t take a second look at it like that). No3 and No4 are slightly boring and much like other internet site themes. No5 is brilliant, especially if some flash could be integrated into it. No6 is alright, but I think for people who don’t appreciate the Vista look and feel, it would be boring. Please use No5 – METAL because it is the clear winner.

  18. Nick Duffy says:

    use metal number 5. it is the best

  19. Andrew says:

    All the designs were cool, but my vote is for the Glass design. Orange is a close second choice but I’m a sucker for high information density, which the glass version appears to deliver. Comic was my least favorite, it’s a visually striking design, but it just felt to me like it was being a little patronizing. I don’t suppose many wordworking magazines are laid out as comics!

    Andrew.

  20. dp says:

    my mind says vista, but my heart says glass

  21. Simon B. says:

    It’s obvious that Clean Orange is the best and sticks out from the rest.

  22. BT says:

    CleanOrange. It stands out the most.

  23. conrad gardner says:

    Design #5 – Metal

  24. Jim says:

    glass…. hands down

  25. Luck says:

    The glass design really stands out for its clean design.

  26. Josef Rousek says:

    Design #1 – Clean Orange

  27. #3 Glass really stands out for me, its got my vote.

  28. Doga Oztuzun says:

    Glass is really cool.

  29. David says:

    1.  Vista

    2.  Glass

    3.  Clean Orange

  30. aafvstam says:

    I prefer #3 as this is the only one giving you the overview of headlines per category.

    #5 metal is in my opinion the better looking one, but containes only a small amount of information. You are forced to click each category before knowing whazzup.

    So… redesign #5 to put in the category (web, windows, gaming and hardware) headlines.

  31. Ravi says:

    I vote for clean orange.

  32. Branden Bass says:

    I think I like Glass the most, but second would be CleanOrange.

  33. Klimm says:

    1 please 😉

  34. Edmund Ocado Jr. says:

    I prefer #5, because its not very irritating to the eyes and best of all it can make coding a fun and  better expierence.

    God Bless…….

  35. Someone says:

    Clean orange for navigation & structure. (Maybe not orange)

  36. Jim Perry says:

    Gotta go with Glass.

  37. Tom says:

    Orange – you could make it more fun by making the photo nicely comical (just slightly more amusing would be good.)

    Second choice is Vista, although everything looks like that now it seems.

    Although that said – the orange looks pretty odd nested in amongst the MSDN blue. Damn complimentary colours.

  38. HarryMiller says:

    They’re all boring and corporate except Comic. That’s the only one that makes me believe I can do what I really want with code, as opposed to doing what’s allowed or what the corporate sponsors would approve. Why? Probably because I can create comics for fun, and I WOULD create comics for fun, but I would never design a standard-issue Website4FUN. Although even better might be a video game theme. :-)

    Actually I like the look of the Metal theme too, but there isn’t enough content visible.

  39. Mohammed Shareef says:

    Clean Orange, Thats the best one according to me

  40. Keefer says:

    I would prefer the Metal design for look and feel, but for the actual functionality and clarity of information as well as ease of use, I would go for Glass.  I’ve been in the software side of the industry for years now and the simplest design ALWAYS wins over the complex and cartoon like designs.  I know other websites at the moment has a similar look and feel of the Metal design, but is that not the point of updating websites looks, so that they are current?

    Summary – Take the basic layout plan for Glass and apply all the images, colours and fonts of the Metal design.

  41. x112358 says:

    Clean orange, baby. Simple, functional…

  42. Ryan Brady says:

    Scrap them all and start over.

    #1 – Takes up too much space with meaningless graphics.  What’s up with the two teens writing code in the insane asylum?  Give me Ballmer throwing a chair or something!

    #2 – Comics?  Are you kidding me?  WTF does that have to do with creating cool and exciting projects using technology?

    #3 – If I absolutely had to vote for one, this would probably be it.  It still stinks and is too "markety" feeling.

    #4 – This looks like it’s some frilly web designer homepage.  No.

    #5 – Kinda looks like some menu off of Mortal Kombat 2008 Ultimate Edition.

    #6 – It’s depressing and hard to follow the text around the page.  This must be what it looks like to drown in the pond where swampthing came from.

  43. Richard Broyles says:

    I like the glass one.  It looks very clean and organized.

  44. danielfe says:

    Hey Ryan,

    As I pointed out, I’d like to be constructive in the comments. If you feel all the designs should be "scrapped", can you point to a design on the Web that you *do* like that fits Coding4Fun?

  45. Here is something interesting. Dan Fernandez is asking users to rate and vote for different web site…

  46. Hesham says:

    Design #3 – Glass

    Well orranized

    shows links from each category in the front page.

  47. nobodyman says:

    3 – very clean.

  48. Scott says:

    I vote for glass. I goes with the new Vista glass (obviously) but that seems appropriate.

  49. Clean Orange says:

    Clean Orange

  50. Tabibito says:

    In order of preference.

    #1 – Clean Orange

    #2 – Glass

  51. Mike Risner says:

    Design #2 – Comic. I feel this design expresses a real Coding4Fun theme.

    Personally, I admire the classy designs of Clean Orange, Glass, and Vista. However, I’m not sure if they match the intended theme of Coding4Fun.

  52. Brett Stime says:

    Me likes 1 and 2… Agree with the comments about reflections being the new drop-shadow in the over-used sense of the phrase.

    2 Fits the fun theme quite nicely but might be relatable to too narrow an audience.

    1 Looks relaxing, warm and inviting. Not necessarily ‘fun’ but not intimidating either.

  53. Cata says:

    I vote the vista look .

  54. David says:

    Either Design 5 (Metal) or Design 6 (Vista).. Both look great

  55. Jake Hassings says:

    #3 Glass

  56. RubenP says:

    My preference: Orange, Vista, illo, Metal, Glass, Comic.

    Orange: Clean, elegant, not too fancy, but looks modern and has a designer feel. Top picture may be a bit too big for repeated visits. Maybe a little less red for the text you should read.

    Vista: Lots of info in one spot, without getting cluttered. Colors are not exactly to my liking, and the Aero glass-effect is distracting.

    illo: Like the color scheme, but it’s not much visible content, that single column. The dark background on the text is hard to read with the lighter and visually active sides.

    Metal: I like the icy boxes, but the rest looks a little cheap.

    Glass: Colors are good, but the top boxes feel the same somehow, and make the design somewhat rigid and unattractive.

    Comic: Eek! No comment.

    But hey, I’m no designer.

  57. Mike says:

    I like the #6 the most but that would normally be seen on a windows vista website. I would say the Metal one is the coolest with the bestest graphics. The Glass is the best I would have to say.

  58. liam kinkaid says:

    Design 1 is the way to go. It’s the best of them all. Looks very professional and at the same way the orange color may inspire people to participate in the project.

    Best regards,

    LK

  59. AngelWolph says:

    Overall, I like Glass the best for the content, design and organization.    A close second would be Metal.  The organization is similar to Glass, and I like the look of the clear blocks with the icons imbedded.  However, I think the overall design doesn’t offer enough content.

  60. Mmm, why not go for something simple? Like flickr.com ? if any though  i would say the orange, all the others look like a kid has made them? Enless that was the whole point? Why not let the users make designs, send them in, and then let the other users judge them!?

  61. Tim Wilde says:

    I vote for Glass.

    The main reason is that its colours are, IMHO, the most sympathetic to the MSDN design which it’s going to be nested within.

    As others have already said, the four sections at the top with links to articles is a great idea: I can arrive, then jump straight into the stuff I’m interested in.

    Can I suggest that RSS feeds for each section are made available, too? perhaps put RSS icons on the right-hand side of the "More >" bars? That way I can subscribe to the bits I’m interested in.

    Definitely needs something in that bottom-right corner, though. Maybe a list of planned articles, or author bios?

  62. danielfe says:

    Hey Adam,

    We did consider doing the user-designed model, but there are restrictions and legal issues like the IP of the HTML and graphics (Microsoft would need to own them) and the actual integration with our backend. It would be fun to see user-centered designs though :)

  63. Nguyen Tran says:

    I like #4 Illo

  64. Yuvi says:

    Well, I guess I’m the second youngest poster here, and I the Coding4Fun RSS feed is in my "Check Now" Folder. And, it’s even the home page at my School..

    And, yea I vote for 1…..

  65. My votes in order:

    – design #3

    – design #6

    – design #5

    – design #4

    – design #2

    – design #1

    Best regards :)

  66. AndyByrne says:

    All (but one – guess which) look great. I must vote for5

  67. AndyByrne says:

    All look good – apart from one. Must go for #5 !

  68. Magdy Wageeh says:

    Metal is great

  69. MichaelW says:

    In order of preference:

    *Glass – clean and looks like it would be easiest to navigate

    *Clean Orange – easy to read, clean, I like it.

    *Metal – looks like it embodies the fun part of the site

    *Vista – follows the new direction MS is taking

    Do not do

    *Illo – it’s hard to read and slightly obnoxious

    *Comic – Too Marvel for me

  70. H.Atalmapi says:

    Vista look nice and clear for me

  71. Alex says:

    #1 Glass is simply the best

  72. Thomas Traudisch says:

    I vote for metal.

  73. [ICR] says:

    My favourite is CleanOrange. I can understand what some people say about it being too "buisness like" and not as "fun", but I guess I’m just a sucker for "clean" designs. The header is too big though.

    I really dont like the Comic style, it makes no sence to me concept wise. Sure it’s fun, but it’s such a niche concept that doesn’t fit with coding at all.

    Glass is nice from an information density perspective. It’s clear what information is where and how it fits together. I don’t really like the subtle buisiness of it though.

    Illo just made me think "WTF?!" To me it doesn’t encapsulate Coding4Fun at all, but that’s a personal opinion and I’m afraid I can’t pin down why.

    Personaly the metal look doesn’t do it for me, but it looks nice enough if people like it. It would be good when combined with the menus from glass.

    Vista would be very nice if it wasn’t so visualy noisy. The panes are too transparent, making it difficult to read.

    In order, I would say:

    CleanOrange,

    Glass,

    Metal,

    Vista

    Comic,

    Illo

  74. Radina Hakim says:

    #1 Too boring, but good designs

    #2 Creative, but still too boring

    #3 Very sleek looking. This is my favorite.

    #4 Nice, I like this one too

    #5 I like the transparent look

    #6 Makes me want to go to sleep…too boring

  75. David says:

    I would say 2, 3 or 5. Two would win with a change to the links. They are two big and not really liking the whole japped buttons. Maybe a round link area with circle in middle with links around it. Look like some kind of Communications device in some sci-fi or cartoon.

  76. Eli says:

    I would say numbers 5 and 6 are the best out of all of them.  Number 5 is the best out of those two.

    CHOOSE NUMBER 5!!!

  77. Miguel Leone says:

    Metal all the way

  78. aaron andrews says:

    glass or vista

  79. Bart says:

    Really tough,

    1. Glass or Clean Orange: they both have a very clean, distinct setup that is very pleasing.

    2. Metal, would be higher but the four main icons unfortunatly do not fit with the atmosphere of the rest of the page

  80. Mert Sakarya says:

    #1 -> Metal

    #2 -> Comic

  81. Ankit Nagpal says:

    Metal(#5) looks gr8

  82. Taryn says:

    Love the vista design.

  83. CV says:

    Glass Rocks!!!  The design works best with the subject.

  84. Sven De Bont says:

    # 5

  85. steve says:

    Clean Orange design but with the option to personalize the color and other bits.  I don’t like the orange color but i prefer the layout.

  86. Ripi1000 says:

    Really cool Layouts!

    But I like Vista & Glass most.

    I really like the fresh colors of vista with the smooth glass grdients.

    The vista Layout would be lot more functional if the black layer moves a bit to the right and put some main Category Icons into the top Glassbar.

    Greetz

    Ripi1000

  87. Peter LeJeune says:

    Glass looks the sharpest.  It’s clean easy to grasp and most sophisticated page layout.  I think this will be easy to navigate for experienced and new visitors alike.

  88. Boyd Mills says:

    Number 5.

  89. PO says:

    Clean Orange

  90. Mark Bridges says:

    Vista

  91. Rob says:

    Glass or metal, in that order. I have to say that graphically all the designs are good, and are far better than anything I could ever produce, but I’m not sure that, for me, any of them really embody the idea of coding for fun. Glass and metal come closest, being clean, easy to navigate and easy on the eye. The others would be just too difficult to live / work with.

  92. Rob Gilbert says:

    I like Clean Orange. Not too cluttered like the others. I don’t think the site needs an amateurish feel. If the top graphic was 80% of it’s current size it would be a little better.

  93. Prince says:

    My vote is for Glass – Design #3

    I like the fact that as soon as you enter the page you can immediatly see the latest articles for each of the groups ie "Windows", "Gaming" ect.

    The color scheme of Glass is also very nice

  94. Ash says:

    #3 glass is the most practical. Readable, Organized and non-intrusive.

  95. Ben Roberts says:

    Top 3 choices [in order]:

    1. Glass

    2. Metal

    3. Vista

  96. Roni Huhta says:

    The designs look really nice graphically, but how they work when there is alot of text and pictures on the page?

    You could just post the spliced graphics from the page and we could judge the site by them, most of the pages in C4F have alot of text and it should be easy to read.

    But if I really have to choose one I would choose the Glass since it seems to be nicely organized and clear enough.

  97. Kamalesh says:

    I think Comic will be the best suited. It looks lively, light weight (at least we can hope so) and has bright colours to turn up your mind.

    Comic is appealing

  98. Julius Sistona says:

    The vista look. Nice.

  99. Carl says:

    Design # 5

  100. me says:

    GLASS

    looks the best

  101. Girish says:

    Clean Orange

  102. Robert M says:

    I vote Comic

  103. Aaron says:

    Metal in first place with Comic Comeing in close second (it just feels realy cool).

  104. BeanTownBoy says:

    I vote for Metal – it reminds me of Ice –>  can you have music playing in the background like "Ice Ice Baby.."?

  105. BostonBean says:

    I vote Metal!!!!

  106. folkieman says:

    oh… It has to be Glass… It is Vistaie and it has a good organization of the info… I mean.. some designs, like comic… are not that intuitive (I am all about ease) and many people that are going to come to the site are not going to be programmers or understand how to navigate something by default.

  107. Amine says:

    Glass looks awesome, I love it!

  108. Iced_Eagle says:

    Definetely either #5 or #6.

  109. Irasiad says:

    Clean Orange !

  110. Jayson says:

    Judging by aesthetics and apparent ease of navigation, I vote Glass – without a doubt.  CleanOrange takes second place. The others, appear like they would be quite difficult to navigate.

  111. ravi kumar says:

    i think glass is very much fine to others n i like tht design too its very impressive to watch

  112. Shannon says:

    Design #6 – Vista

  113. Fahad says:

    re: Vote Today For Your Favorite Coding4Fun Redesign :

    No.1: Metal

    No.2: Vista

    No.3: Clean Orange

  114. Drew says:

    I vote glass.

  115. abhisek says:

    Windows Vista

  116. he Clean orange is a nice design, but it doesn’t look like a developers site!

    the comic one – in my opinios – is the worst design!

    I likes that glass design, It’s no. 1.

    that illo one looks like a 90+ web site!

    the metal interface it amazing , but keeping only the title of each partion with out pointing to the top/ new articles makes it

    impractical.

    Vista design is pretty cool, but once we install Windows Vista , I think that this design will be just , normal!

    So again , I vote for Glass.

    Thanks alot

  117. JKR says:

    Glass looks pretty and clear!!

  118. Vedran says:

    myTop 3 choices:

    1. Design #1 – Clean Orange

    2. Design #6 – Vista

    3. Design #3 – Glass

  119. glassrock says:

    love the glass!. it rocks

  120. TheBlueSky says:

    I vote for Glass!

  121. Khalil says:

    Orange for me :)

  122. woolly says:

    glass is first choice
    illo is second choice

  123. Tesfabpel says:

    The best are Vista and Glass.

  124. n wnw says:

    i vote glass

  125. Simon A. Brown says:

    1. Vista
    2. Glass
    3. Orange

  126. MichaelB says:

    I vote for Design #3 – Glass.

  127. Paul Ruby says:

    I vote for #3 – Glass.

    It seems to allow for easier navigation and content display.

  128. Luke says:

    I vote #1 – Clean Orange
    It is the best of all.

  129. Subhashini Gopalakrishnan says:

    The Best Designs are,

    1. Vista
    2. Glass

  130. Olawale Niniola says:

    I prefer the Orange design.Thanks

  131. Anand A.V. says:

    i like both Design #4 – illo,Design #5 – Metal.

  132. Michael Geraghty says:

    I am split between glass and metal, witha slight bias for glass

  133. Ajay S Britto says:

    I give metal #1. It should be having more 3D dynamics ( Assuming it doesn’nt consume much bandwidth than during load for the first time on a system). But of course we can go for a more extreme step by giving the user an option to switch his theme during runtime. sort of a personalization. Try this one.

  134. Salvatore palange says:

    Onlu design number one.. it looks like very professional

    great

  135. darkxiiindp says:

    #3 is best

  136. tkdchen says:

    I like all. However, the Vista may be better.

  137. ken west 3 says:

    metal rocks the party that rocks the party

  138. Mayoor Patil says:

    Metal (Design 5): Good

    Vista (Design 6): Better

    Glass (Design 3): BEST

  139. decyclone says:

    #1 Vista

    #2 Glass

    #3 Metal

    #4 Rest of them

  140. decyclone says:

    Vista looks the best man….

    Really, think about it.

  141. Jitendra says:

    #1 Glass

    #2 Metal

    #3 Vista

    #4 Rest of them

  142. Jitendra says:

    Glass is the Best one to choose.

  143. Niema says:

    Glass is really cool

  144. Gostei muito do Design #2

    []s

  145. Thanks again to the 160+ of you who voted on the Coding4Fun redesign ! As you know, the Glass design

  146. Tom Kirby-Green says:

    Design #6, Vista for sure. It’s clean and the large verical off center region makes for easy reading.

  147. Paulo Gomes says:

    Design #3 – Glass, for sure! :)

  148. It’s alive! Thanks again to everyone who helped vote on the redesign , we are now officially live! The

  149. Rob Caron says:

    From Daniel Fernandez’s blog , a revamped Coding4Fun site is now online. It’s alive! Thanks again to

  150. CoqBlog says:

    Vous aviez peut être voter pour lui , découvrez le nouveau design du site Coding4Fun : Coding4Fun . C’est

  151. As the move to higher resolutions displays and smoother vector icons we can see the final Vista icons…

  152. what are the different learning styles of children