Windows 10 Redesign Concept

Thursday, June 18, 2015


When Windows 10 came out, I was really not a fan of the ui. It was a hybrid between aero and metro, not either or both. I hated it. So I went to the drawing board and mocked up my ideal Windows ui, complete with solid colors, live tiles, and more.
"The idea of this project was to create a unified interface and experience across all three platforms."
The vision of Windows since Windows 8 has been to unify the three platforms of desktop, tablet, and mobile. Without commenting on the success in terms of functionality, in terms of ui there is a lot that can be done. Presently the three platforms do not look like one platform, they look like three platforms loosely tied together by live tiles and other little tweaks.

There are a few loose ends that can be tied up between the platforms. The first of these is the action center/system tray. It might seem that the concept of an action center and system tray is extremely different between desktop and mobile platforms, but it isn't so. Just compare Android's busy status bar to Windows 10's desktop system tray and action center and you will find many similarities. I have taken these similarities and brought them out in the mockup.

This I did by putting the action center in the start menu on the desktop interface. This is because on mobile, the desktop or homescreen is the start menu, so to make everything feel consistent the same information is visible in the same place. This can also be seen in the tablet interface. The embedded system tray functions like the system tray in that it has shortcuts to quick settings as well as background apps but like a charms menu in that going to a quick menu brings in a charms-like menu to replace the start menu. The same can be seen in the tablet interface.

The second problem is that the wallpaper is not explicitly visible in tablet and phone interfaces because of the start menu, a major contributor to the breakup of the ui across platforms. Because the "home screen" of Windows Mobile is the start menu, the way to unify the platforms would be to make the start menu on the desktop look similar to the start menu on mobile. My design takes elements from both Windows Phone and Desktop to create a design that doesn't look out of place in either environment.

I used a mood board to gather some thoughts:


(Credit: Jay Machalani's "Fixing Windows 8":  http://jaymachalani.com/blog/2013/12/12/fixing-windows-8 and Marcel Tomczak's Origami OS Concept)

In a mobile start menu, the wallpaper needs to be visible in some way. This means that the wallpaper must also be visible in the desktop start menu, but it also needs to fit into a mouse-and-keyboard interface. To find a solution, we look outside of the Metro UI back to aero in Windows 7 and even to Apple's new interfaces in Mac OS X Yosemite and iOS 7.

That's right, the solution is transparency in the start menu. Everything else is subjective and I have designed it based on my own preference for a perfect interface. There are people who hate it and people who love it. So please don't hate. Here we go...


One solution is to make the back of the start menu transparent. Some people really like that along with solid tiles. Personally I don't like it in Windows Mobile and even less in desktop Windows. There are some cases where I think this could work, such as in a full-screen start menu where there is plenty of padding to show the wallpaper. In a pop-out menu, though, it just looks messy and overly busy.

In my design, I made the start menu itself solid and the tiles transparent. This brings the attention to the tiles and makes the whole menu more colorful and interesting. The main advantage, though, is that it works well in the mobile interface and binds the platforms together.


The UI definitely reflects Metro UI with all of its bold, solid colors, sharp corners, and just the idea of tiles at all, but there;s also definitely a trace of outside influence in the transparency. On DeviantArt, one user commented:
"I like it. It's familiar and yet different at the same time."
And I guess I like it, too. I'm satisfied with the design, and I've completed my goal with the project. What do you think of it? Be sure to leave your thoughts down in the comments below, and go check this project out on DeviantArt and Behance!

DeviantArt: http://wwsalmon.deviantart.com/art/Windows-10-Redesign-540568214

Behance: (coming soon)



Disclaimer and other notes:

Windows, the Windows Flag Logo, etc. is property of Microsoft Inc. I am in no way affiliated or endorsed by Microsoft. This is a non-functional concept comprised of png mockups made in Paint.NET. All work is copyrighted under Creative Commons Attribution 3.0, meaning that you may copy, modify, redistribute/share, and show/transmit my work as long as you give me credit.

Thanks!

1 comment :