As the name “Metro” suggests, the design language is inspired by the visual language of airport and metro system signage. Consequently, the UI of any mobile app on the Windows Phone is envisioned to be clean, modern and user-centric, to make use of good legible typography and bold colors. Each UI directive to the user should be clear and interaction should be straightforward. I would simply sum up this idea as: interaction with the mobile device should turn from being complex to a simple user reflex. No need to mention, the WP7 design concept includes one mantra we all know by heart: “Content is king“. The UI of your Windows Phone app should delight the user through content instead of decoration, so basically your content should be the UI.
At MIX10 I got a chance to check out the WP7 Metro design book first-hand thanks to David Kelley. Here is also a very nice walk-through of the Windows Phone 7 Series book, put together by Long Zheng (from istartedsomething):
Vodpod videos no longer available.
If you want to find out about the many cool details of the WP7 design language, the best source is definitely the MIX10 “Windows Phone UI and Design Language” session by Chad Roberts, Michal Smuga and Albert Shum.
After watching the session recording, if you should be in search for further info:
- Download the UI Design and Interaction Guide here
- Check out the Windows Phone Developer blog
- Work through the Silverlight Windows Phone tutorials
Recently I have also discovered the following video featuring Albert Shum, Director of Mobile Experience Design for WP7, who gives a perfect overview of the design inspiration for WP7:
In the 2.part of this series, I am going to share my personal impressions on Metro and focus on its typeface-centric design features.