UPDATED 14:00 EST / FEBRUARY 08 2011

Must Read for Windows Designers: MetroUI Definitively Explained

image 
I am an unabashed fan of the whole concept of the Metro UI, which is the basis for Windows Phone 7 and the Zune Desktop. So when I saw this post by Scott Barnes at RIAGENIC I flagged it to read later when I could relax and enjoy.

Well enjoy I did and the one thing I come away with is this: if you plan on designing any piece of software, or app, and you want to follow the Metro UI guidelines then this post is a must read.

Just a sample of what you will find in the post

The Principles of Metro vs. Microsoft Future Vision.

In order to start a conversation around Metro in the near future, one has to identify with the level of thinking associated with its creation. Below is the principles of metro – more to the point, these are the design objectives and creative brief if you will on what one should approach metro with.

Clean, Light, Open, Fast
  • Feels Fast and Responsive
  • Focus on Primary Tasks
  • Do a Lot with Very Little
  • Fierce Reduction of Unnecessary Elements
  • Delightful Use of Whitespace
  • Full Bleed Canvas

You could essentially distill these points down to one word – minimalist. Take a minimalist approach to your user interface and the rewards are simple – sense of responsiveness in user interface, reliance on less information (which in turn increases decision response in the end user) and a reduction in creative noise (distracting elements that add no value other than it was cool at the time).

I may not be developing anymore but this is one post I plan on keeping around for sometime and anytime anyone asks what the Metro UI is or why is it important I’ll send them to this post.

image

image

One last tidbit from the post:

Celebrate Typography

  • Type is Beautiful, Not Just Legible
  • Clear, Straightforward Information Design
  • Uncompromising Sensitivity to Weight, Balance and Scale

I love a good font as the next designer. I hoard these like my icons, in fact It’s a disease and if you’re a font lover a must see video is Helvetica. That being said, there is a balance between text and imagery, this balance is one struck often daily in a variety of mediums – mainly advertising.

Imagery will grab your attention first as it taps into a primitive component within your brain, the part that works without your realizing its working. The reason being is your brain often is in auto-pilot, constantly scanning for patterns in your every day environment. It’s programmed to identify with three primitive checks, fear, food and sex. Imagery can tap into these straight away, as if you have an image of an attractive person looking down at a beverage you can’t but help first think “that’ person’s cute (attractive bias) and what are they looking at? oh its food!…” All this happens despite there being text on the said image prior to your brain actually taking time to analyze the said image. To put it bluntly, we do judge a book by its cover with extreme amount of prejudice. We are shallow, we do prefer to view attractive people over ugly unless we are conveying a fear focused point “If you smoke, your teeth will turn into this guys – eewwww” (Notice why anti-cigarette companies don’t use attractive people?)

Thanks for doing this Scott.

[Editor’s Note: Cross-posted at WinExtra. –mrh]


Since you’re here …

… We’d like to tell you about our mission and how you can help us fulfill it. SiliconANGLE Media Inc.’s business model is based on the intrinsic value of the content, not advertising. Unlike many online publications, we don’t have a paywall or run banner advertising, because we want to keep our journalism open, without influence or the need to chase traffic.The journalism, reporting and commentary on SiliconANGLE — along with live, unscripted video from our Silicon Valley studio and globe-trotting video teams at theCUBE — take a lot of hard work, time and money. Keeping the quality high requires the support of sponsors who are aligned with our vision of ad-free journalism content.

If you like the reporting, video interviews and other ad-free content here, please take a moment to check out a sample of the video content supported by our sponsors, tweet your support, and keep coming back to SiliconANGLE.