BlogDesignUser ExperienceVisualization

Prototyping for Windows 8: User Experience Design Principles

By March 27, 2013July 13th, 2013No Comments

I recently wrapped a project for which I was asked to model a dashboard of sorts in the Windows 8 look and feel. The work was engaging and fun, and it gave me an excuse to spend some time delving into Windows 8 standards, exploring inspiring apps and uncovering some resources to aid in the prototyping process.

First, let’s cover some Windows 8 basics:

Microsoft Design Principles

1. Show pride in craftsmanship – This principle is a call to detail-oriented, A-type designers like myself. Pay attention to the grid, make the design pixel perfect, take hierarchy rules seriously. (Of course, rapid visualization is about speed, so balance pace and perfectionism accordingly.)

2. Be fast and fluid – This principle is about motion and interaction. Windows 8 is all about the experience, so make it fun and engaging, for goodness’ sake!

3. Be authentically digital – This principle is about embracing all that is digital — the brilliant colors, rich typography, near endless boundaries. Play a little. Push the limits. Make your app innovative and unforgettable.

4. Do more with less – I have a slight bone to pick with Microsoft on this particular principle. It encourages designers to leave only essential elements on the screen, and allow users to discover the rest. While I am a champion of simplicity, and of stripping things back, I think we need to be careful about hiding functionality from users. I consider myself a relatively tech savvy person, and it took me 3 days to figure out how to close an application in Windows 8. When in doubt, visualize a concept and test with users. This will tell you if the functionality you’re hiding in attempts to ‘do more with less’ is truly discoverable, or if it needs to live closer to the application’s surface.

5. Win as one – This principle is about working with what exists to complete your user scenarios. No need to reinvent the wheel with every new application — leverage standard touch conventions, sharing mechanisms built into the Windows 8 platform, etc. This provides users a sense of familiarity, and will make their experience with your application more intuitive and successful.

I’d like to share some apps I’ve discovered, but before I do, I must mention this brief commentary only scratches the surface when it comes to Windows 8. I highly recommend downloading Microsoft’s Windows 8 User Experience Guidelines to learn more about these guiding principles, as well native Windows 8 features, navigation patterns, grid guidelines and more. Knowledge is power, folks!

Grade A Apps:

Screenshot (32)

I like how clean and colorful USA Today’s hub page is (see above). An added bonus is how I can navigate between content once I select ‘Snapshots,’ for instance:

Screenshot (33)

The client I worked with introduced me to this handy navigation menu in Netflix’s Windows 8 application. The menu can be expanded and collapsed, and is present on all hub and section pages of the application:



Screenshot (40)

Last app I’ll share with you: this Bing Finance app makes a huge entrance, and I love it. As soon as the user launches the application, s/he is greeted with a compelling cover photo, which ties to key quote activity:


I know Windows 8 can be a polarizing subject in some UX circles, and to that end, I leave you with this:

Although Windows 8 has taken some heat since its release, I think it’s here to stay and to evolve, and I think we UX professionals need to rise to the occasion to educate ourselves on its principles and challenges to best serve our clients. There’s lots of good stuff going on within the Windows 8 platform– fresh layout designs, simple navigation patterns, compelling interactions. I thoroughly enjoyed exploring the Windows 8 platform these past several weeks, and I look forward to doing so more in the future.

Enough tech preaching for one day– go download the Windows 8 UX Guidelines!

And stay tuned for my next post: Prototyping for Windows 8: Tips and Tricks


Leave a Reply