Using Metro style in my web applications

Question

I love the Metro UI (Modern UI/Windows 8 style UI, whatever) and would like to have the "tile" design on my site as well. Something like this or this. Am I allowed to do this or do I have to contact MS first about this?

There is already one question but in this one the posted and accepted answer covered more the pivot control than the tileish UI.

Answer 1

Quick Answer: Yes, you may use that freely. It is a design guidelines. You have to follow them to make your application to pass UI standard for being accepted in MS marketplace.

There are several official guidelines that you may reference:

• Designing Metro style apps
• Laying out your UI (Windows Store apps)
• Channel 9 Windows 8 UX Video - 8 traits of great Metro style apps

Answer 2

Tiling isn't anything new. You can see in many places these days. From the Android Play store, to how Google+ and Facebook now show uploaded images in the feed. So I wouldn't say tiling is the main feature of the new Metro UI. I feel that it is the look and placement of those tiles and how they interact and how the UI flows that Microsoft has the patent on.

If you look at the USPTO filing, the abstract is as follows:

Aspects of a user interface that provides visual feedback in response to user input. For example, boundary effects are presented to provide visual cues to a user to indicate that a boundary in a movable user interface element (e.g., the end of a scrollable list) has been reached. As another example, parallax effects are presented in which multiple parallel or substantially parallel layers in a multi-layer user interface move at different rates, in response to user input. As another example, simulated inertia motion of UI elements is used to provide a more natural feel for touch input. Various combinations of features are described. For example, simulated inertia motion can be used in combination with parallax effects, boundary effects, or other types of visual feedback.

I know, it's quite a wall of text and written in a lot of abstract jargon to make it as broad a possible, but really it comes down to the tiled interface working well on a touch screen to provide clear user feedback.

So yes, I'd say you can use a tiled layout for your site so long as you don't copy all the UI elements and visual cues from the new Metro interface.

Answer 3

Metro design language is visual and UI design that

• Focuses heavily on typography
• Values content over chrome
• Works great in motion

I believe none of those can be patented and what MS has patented are specific ways those principles are implemented into it's products. Tiles, panoramas and huge margins is not what is Metro. Flat colors, focus on content and lots of movement is what makes Metro.