I spent couple of hours this week in trying to understand what is Metro UI. While Microsoft is definitely betting big time on Metro UI, with it being incorporated in Windows Phone 7, Zune and most recently in Windows 8, there doesn't seem to be much information availabe on what it is, how a developer can benefit from it, and what set of tools, technologies and best practices are available for a developer to use it in real-life applications.
Here's my attempt to provide some clarity on the topic:
- Metro UI is a set of UI best practices:
What this means is that Microsoft is expecting all future development on Windows platform to follow these best practices when it comes to implementing UI.
- Inspiration:
It's widely accepted that Metro UI is partly inspired by signs commonly found at public transport systems, for instance on the King County Metro Transit, a public transit system that serves the Seattle area.
- History:
While there are signs of similar UI paradigm being tried and tested by Microsoft on several products in the past such as WIndows Media Center, XBox, Microsoft Live, etc, it was Windows Phone 7 that is credited for brining MetroUI in front and center of the Microsoft UI strategy.
- How to learn it:
The overall concept behind Metro UI is technology agnostic, that is, you can decide to implement MetroUI for your applciation in any of the UI language that you are familiar with (ASP.Net, AJAX, Silverlight, etc) . Reality is that the majority of Metro UI development has come from Windows Phone 7 (now Mango) which is done in Silverlight. Although there is very less clarity at this point in time on "Silverlight Vs HTML 5" issue,I think most of the new development will happen in HTML5 targeting Windows 8 as well as other form factors such as tablet and mobile.
One of the best way to learn Metro UI woudl be to build a WIndows Phone Application (using Silverlight) or Windows 8 application (using HTML 5). Following are few links that can help with the ramp up:
Windows 8 Dev Preview: http://msdn.microsoft.com/en-us/windows/home/br229518
Metro Design Principles and Tutorials: http://www.microsoft.com/design/toolbox/tutorials/windows-phone-7/metro/
HTML 5 Tutorial: http://www.mywindowsclub.com/resources/5011-HTML-Tutorials.aspx
Windows 8 New Features: http://www.mywindowsclub.com/resources/4653-Windows-new-features.aspx
Future of Silverlight: http://www.mywindowsclub.com/resources/4733-Windows-embracing-HTML-what-future.aspx
Cheers,
Piyush
Here's my attempt to provide some clarity on the topic:
- Metro UI is a set of UI best practices:
What this means is that Microsoft is expecting all future development on Windows platform to follow these best practices when it comes to implementing UI.
- Inspiration:
It's widely accepted that Metro UI is partly inspired by signs commonly found at public transport systems, for instance on the King County Metro Transit, a public transit system that serves the Seattle area.
- History:
While there are signs of similar UI paradigm being tried and tested by Microsoft on several products in the past such as WIndows Media Center, XBox, Microsoft Live, etc, it was Windows Phone 7 that is credited for brining MetroUI in front and center of the Microsoft UI strategy.
- How to learn it:
The overall concept behind Metro UI is technology agnostic, that is, you can decide to implement MetroUI for your applciation in any of the UI language that you are familiar with (ASP.Net, AJAX, Silverlight, etc) . Reality is that the majority of Metro UI development has come from Windows Phone 7 (now Mango) which is done in Silverlight. Although there is very less clarity at this point in time on "Silverlight Vs HTML 5" issue,I think most of the new development will happen in HTML5 targeting Windows 8 as well as other form factors such as tablet and mobile.
One of the best way to learn Metro UI woudl be to build a WIndows Phone Application (using Silverlight) or Windows 8 application (using HTML 5). Following are few links that can help with the ramp up:
Windows 8 Dev Preview: http://msdn.microsoft.com/en-us/windows/home/br229518
Metro Design Principles and Tutorials: http://www.microsoft.com/design/toolbox/tutorials/windows-phone-7/metro/
HTML 5 Tutorial: http://www.mywindowsclub.com/resources/5011-HTML-Tutorials.aspx
Windows 8 New Features: http://www.mywindowsclub.com/resources/4653-Windows-new-features.aspx
Future of Silverlight: http://www.mywindowsclub.com/resources/4733-Windows-embracing-HTML-what-future.aspx
Cheers,
Piyush
