With the arrival of Windows Metro in Windows 8, developers must begin working around new design principals. But what will third-party Metro-style apps look like? XGMedia, coming off of the latest Microsoft conference to educate developers on the Metro-style design principals, took to redesigning Skype as a functional case study.
As Microsoft explicitly states in its developer’s guide, “Content is the heart of Metro-style apps, and putting content before chrome is fundamental to the design of Metro style apps. Everything else is accessory—or chrome—that helps present and enable interaction with the content.”
While some may argue that Windows Metro style isn’t the most desirable interface, Microsoft must be credited for forcing developers to design in a way that strips away the complexities that exist in navigating an application to view its content. Metro-style apps are in fact meant to be designed to be used with our fingers. You can even say that Metro seeks out the minimalist in developers.
When redesigning Skype using Windows 8 principals, Avi Itzkovitch had to determine what within the Skype application would be the meat of the content. Knowing that Skype is used to connect with friends, family, coworkers and generally other people, the “content” would be a user’s contacts.
“I felt that the content and substance of Skype is the Contact List. The people that you communicate with is the most important feature, and that’s why I created a home screen that allows you an easy overview of all your contacts and recent conversations,” Itzkovitch told Digital Trends.
Skype Home Page
In his design for Skype’s home page, only the most important elements have been incorporated into the design. Blurs, gradients, and tabs have been thrown out, simplifying the interface to its very basic elements. It’s visually easy on the eyes, but more importantly, users are able to directly manipulate the content.
Skype Contact Page
Rather than establishing the hierarchy of information by using lines and boxes as we’re familiar with today, the importance of different elements is discerned intuitively by the typography and the structure of information. The Skype home page’s list of contacts can be drilled down to display further information about the user’s contacts, which Windows coins the “Detail Pages.” The hierarchy of information displayed on the contact and call page is established through the use of bold, larger fonts.
Skype Call Page
The final design integrates what Microsoft calls the “Snap View.” The application will minimize to a maximum width of 320 pixels and snap to the side of a screen, but this view will display all the features necessary to preserve the functionality of the application.
As shown in this rendition of Skype’s “Snap View,” the major functions to stop, mute, turn off the video and add participants still exist, but at the same time, users are able browse other applications, including Bing.
This is one example of a functional application that adheres to the Metro standards, and an example of a design principal that Windows 8 will use.
From a designer’s perspective, Itzkovitch has discovered a newfound appreciation for Metro style. “Microsoft got a bad rap through the years for its products user interface, but I feel that they have gone the extra mile to make Windows 8 a desirable product with minimal frictions with the users,” Itzkovitch told us. “Microsoft took the time to carefully consider all options when it comes to interface design and really created an optimal intuitive experience for every user. They meticulously thought about every detail, from the transitions animation to visual design and typography, and the feedback the user gets when he performs an action.”