As the deadline for the Dream-Build-Play 2010 challenge went by I visited the competition’s gallery once again just to find the usual lack of attention to aesthetical details on certain Microsoft sites (can’t blame MS directly here as it is a 3rd party produced thing):


The problems are:

  1. Naive, HTML only scaling of the full-size, widescreen screen shot to a square
  2. Too much whitespace to associate the textual details with the screen shot (compare with the amount of whitespace in d)
  3. Vertically cramped and no difference between labels and the interesting content

A quick and slightly better version:


  1. Only the width is fixed, keeping the aspect ratio of the full-size screen shot
  2. Less whitespace to connect the screen shot with the details
  3. Removed the redundant Game (it’s an games only challenge after all) from the title label, changed the content font weight to bold to emphasize the content and increased the line-spacing to 1.2. I guess I would reduce the type to Standard, Microsoft Old Spice and Both and the label to Challenge though.

Next, the pager:


Well, I guess I do not need to say anything about that…

And as bonus: The URL.


So, the pager uses this Value parameter, making it impossible to reach pages 6 to 9 by editing the URL directly. You just have to love ASP.NET; at least it ain’t a postback driven pager 🙂