Metro UI is Microsoft's new proposition for designing graphical user interfaces. It is a typography-based design language where content is the primary element of the application. Metro is not about decorating. It is about communicating. After all, communication is the primary aim of any properly designed application. Metro suggests focusing on the content rather than in any verbose complex visuals.
Actually, content is the UI.
Let me repeat that: Content is the UI. This means that all the design effort should be spent on making the content shine. Users care about what your application has to offer them and enhancing your application content results in better user experience, so remember this rule of thumb for your next app.
A lot of people argue whether Metro UI is pretty or ugly. Well, guess what: Metro is neither pretty nor ugly! It is an artifact we need to extend and not a matter of taste. The applications we design range from stunning to awful, so Metro's simplicity should not be confused with the rough creation of user interfaces. Having the ability to drag and drop UI elements on a canvas doesn't mean you should design without a plan.
It is really hard to create a simple but usable user interface. Do not be lazy.
I recently published an application developed for the famous fashion designer Vassilis Zoulias. Designing fashion apps is quite tricky. They usually require high quality graphics and a glamourous, elegant approach which should not look cliché or cheap. I needed to adapt the elegancy of a fashion designer to the elegancy of Metro. Download the app to view the final result. Here are some screenshots:
The design is simple, follows the Metro principles and utilizes the fashion designer's work for its visuals. The application background is not a static image. It is a video demonstrating one of Zoulias' catwalks!
The application does not use the common system styles. The main page's list is inspired by the Marketplace hub: square icons, very bold headings, light subheadings, all uppercase.
There are a few features that make the application stunning:
You just show a few ways of making your Metro applications prettier. Here are a few more suggestions for your next gorgeous app:
Did you find this article helpful? I encourage you to comment and provide suggestions or your own best practices!
Many thanks to Galini Scarlatou for designing the stunning visuals. :-)
The best i have read so far ab!out UI. Thanks a lot