Dear iOS Designers,
You are incredible, you are the best-in-class of designers I have ever seen. My jaw hits the floor every time I look at one of your photo-realistic icons, your attention to detail and your ambition to push the limits of your abilities. I page through Dribbble and see all these beautiful apps you design, some of which are simply concept designs while others end up becoming fully functional, downloadable apps from the App Store and then I realize I’ll never get to use most of these gorgeous apps.
Just look at some of these beautiful designs:
I would Love to use many of your apps, but I can’t because I am committed to the Windows ecosystem – I have been since before iOS even existed. You are committed to iOS and Apple, others are committed to Android and Google – and that’s awesome – use what works for you – but don’t forget what works for other people (remember there are lots and lots and lots of people on Windows).
Let me ask you this: Why do you design? You Design because you LOVE it!
Ignore the fact that you design for iOS simply because that is your ecosystem of choice and Microsoft is “Evil”, instead start thinking about designing for Windows 8 and Windows Phone as well – design for Windows because you love to design, because you love to experiment and because you love to try new and exciting things – do it because it’s FUN.
I know, I know, Microsoft has for decades put designers on the back-burner and never provided us with a platform to truly show-off our design skills, it’s a no brainer that they lost you to iOS and Apple. I was stupid, close-minded and ignorant to the rise of iOS on iPhone and iPad – I flat-out missed it. Don’t make the same mistakes I did.
Forget all of your past history with Microsoft, open your mind and expand your reach into a new and growing incredibly fast ecosystem – I am asking you, begging you, longing for you to come join me and start exploring the idea of designing for Windows 8 and Windows Phone. Even if your ideas never become actual, functioning apps in the Windows Store – at least you gave it some serious thought as to how your apps could actually look – you might be surprised how much you like it!
Windows for designers is changing and changing in a way that you should not continue to ignore.
Modern applications are a designers dream come true and here are just a few reasons why:
- Beautiful, Elegant Typography
- White Space is Encouraged
- Clean, Clutter free Experiences
- Chromeless Applications
- Simple, Playful Animations
- Fast and Fluid Experience
- Grids – got to love Grids
- Consistent experience across, desktop, laptop, tablet and phone
It’s time for all of us across all our ecosystems to put down our pitchforks and explore each other’s ecosystems and design because we love to design, design because we like to experiment, design to create new conversations.
Start designing for Windows 8, Windows Phone, Android, iOS and yes even Blackberry – I’d love to start seeing your Windows 8 and Windows Phone work show up on Dribbble and all the countless other sites for designers.
Add links to your work in the comments below and lets what you can create!
Micah – a fellow designer
The “Modern” design language – formally known as “Metro” is Microsoft’s “new” set of design guidelines which has been integrated across many of their software products. Microsoft is just now starting to really push this modern design language as a standard within the company, we can actually see hints of it in some of their older applications like Windows Media Center and the Zune music player – both of these products started the trend for Microsoft to start focusing on elegant design, typography and animation.
Where did this Modern design language come from?
It’s actually influenced on three external foundations:
- The Modern Design Movement (The Bauhaus)
- International Typographic Style (Swiss Style)
- Motion Design
The Modern Design Movement (The Bauhaus)
The Bauhaus movement was geared towards the removing of any extra decorations and ornaments and leaving the focus solely on the purpose and ultimate functionality. This approach to design is distinctly different from what Apple created with iOS which has for the most part relied on a more Skeuomorphism approach. An approach that tries to replicate real world imagery and functionality through realistic ornamental elements.
Here is a good example of from iBooks that shows a Skeuomorphic approach to design with it’s wood grain background, shelves, heavy use of shadows and of course actually showing what looks to be books on the shelf.
Take that compared to Kobo Reader on Windows Phone, you can se a striking difference between the two images – the popular new term for this style is “Flat”, we are starting to see many other companies adopt this Flat style. Google’s Android is probably the biggest company outside of Microsoft to adopt this new style – I have to commend them for making their UI much more consistent and clean through flat design.
I’m not going to get into the debate on which is “right” Skeuomorphism or Flat Design, I think they both have their advantages and disadvantages and the user simply needs to pick a style they like and join a platform that is attractive to them. I’m a big fan of the flat design style I tend to design towards the functionality rather than an ornamental style.
International Typographic Style (Swiss Style)
The Swiss style emphasizes cleanliness, readability and objectivity with a strong focus on layout and grid systems and the use of bold flat color. You have seen this style of typography almost anywhere that you go, it is used in signage at airports, bus stations the Olympics and many other information dense environments.
The elegant use of typography in Microsoft’s design language is one of the main reasons I love designing on their platform. It used to be that great typography was only for print design, Microsoft was able to bring it into the digital realm in an aesthetically pleasing and functional way.
As you can see below, Windows 8 and Windows Phone applications are based very strongly on the grid, you can read a lot more about how Microsoft uses the grid here: Laying out an App Page
Grid Unit Structure
Application Grid Template
In addition to the grid structure, Microsoft has also used big bold colors in their new Modern environment.
Windows 8 Start Screen
Color gives the sense of emotion, attraction and makes it feel more organic as well – especially when the color is used on the hardware itself.
The final and certainly not the last, Motion Design is the third external influence of the Modern Design Language. Similar to Typography, we see motion design everywhere – from the Television and Movies we watch, to digital billboards and scoreboards and of course animations in the applications we use on our phones and computers.
The best Motion design in my opinion is motion that is used in a subtle and simple way, whether it’s a link background color fading in and out as you mouse of it or as various UI elements slide or flip into place as you use your phone.
When you take these 3 external influences and pair them up with Microsoft’s five design principles (Pride in Craftsmanship, Fast and Fluid, Authentically Digital, Do More With Less and Win as One) you get a very strong foundation and understanding of how to design for Windows 8 and Windows Phone. We’ll dive deeper into the 5 design principles in our next exploration article coming up soon.
Check out our initial Exploration Introduction Article: Exploring Modern App Design and User Experience
Soon we’ll be starting a new blog series of exploration articles digging into the exciting world of Microsoft’s Modern Design Language and User Experiences guidelines that has been defined for Windows 8 applications and then encourage you to break those guidelines to provide your users with a unique and beautiful experience.
Throughout this series we will talking about the numerous controls available within Windows 8 applications, we’ll talk about how, where and why these controls are used, and explore the experiences around those controls. We’ll also show some real-world examples of how application designers are using these controls today within their applications.
Every article will be focused on a very specific part of Windows 8, this will allow our users to gain a solid understanding of how each feature within Windows 8 works from a “tutorial” or “average user” type of experience while still providing some of the more technical and creative information that designers and developers may find beneficial.
The end goal is for anyone who is interested in designing Modern applications to gain an in-depth, start to finish set of tutorials to help you provide your users with a useful, creative and interactive experience as they use your Windows 8 applications.
Here are some of the topics we’ll be covering in the coming months:
- Overview of the Modern Design Language
- Microsoft’s Five Design Principles
- Start Screen
- Charms Bar
- Live Tiles
- Hub Pages, Detail Pages
- App Bar
- Semantic Zoom
- Listview, Gridview, Variable Sized Grid
- And so much more…
We are open to your suggestions as well, if there is something specific you’d like us to dig into, feel free to let us know and we’ll do our best to fit it in.
Be sure to check back often to keep up with this exciting new series, we hope you will learn something new and are able to take your application design and experiences to the next level!