Archive

Tag Archives: User Interface

neon

It’s April and we are slowly encroaching on Redstone 3 which means more information on Project Neon, the UI update for Windows 10, is leaking. To recap Neon will be an update to the existing Windows shell coming after the Anniversary Update (which seems to be coming fall 2017).

After the initial leaked info (and my nerding out) I have wondered how major an update this is. Windows 8 was major in that brought in touch/tablet elements. Windows Phone brought the Metro design language.

So what is Neon bringing?

I should also say I had started reading a lot of the commentators remarking on how Neon was a minor refresh adding minor features. So my enthusiasm waned. But then I got excited again.

For one Neon is bringing in a level of polish to Windows. It is something that honestly got lost on the platform when it started backtracking from Windows 8 and Windows Phone. It also appears like Microsoft is focusing on providing more tools and templates to create good designs out of the box. Also it new rumors make me think the overarching goal is to go the last mile in terms of delivering a consistent product.

A number of recent rumors will see features coming that bring real value to users and not just cosmetic changes. Things like in app tab support; for things like File explorer are welcomed productivity features.

Also it looks like Microsoft is working on having a consistent feel and behavior for the design. The rumored blur glass effects are being carried over to the Start Screen.

Now with my excitement I still have questions.

Like what changes are coming to improve touch. Will we see previews for other applications with Neon. The MSN apps need a new coat of paint. Also how does this translate to other form factors like phones (We hope) and tablets?

We may soon get the answers (because I finished this thing the month before Build).

 

 

 

One of the better aspects of technology writing is searching for concept interfaces and fake user interfaces. The following images are from Microsoft and may or may not show up in future Windows’ releases.

continuum_desktop

The above image is (guessing) a design study for the Start menu and desktop. Given the way the Start Menu looks this may be a study looking for Windows 10 Mobile.

neon_suspect2

Design study (again guessing) for Windows 10 Mobile. Notice the Tile sizes; looks like a refinement.

neon_suspect4

More Windows Mobile designs. Looks like Aero fans will be entertained. Interesting looking mail and messaging icons.

neon_suspect3

More Start Screen designs.

neon_suspect1

 

Last image is a look at the Start Menu on a PC. In a few concepts Microsoft has experimented with the Taskbar; adding features that make it work more like the MacOS launcher and making work when PC is in tablet mode.

And that’s it for now folks.

So over the weekend news leaked of Project Neon, a new design initiative for Windows 10. According to those early reports, Neon was started about a year ago as an internal project.

There are a lot of questions about Neon. For one how far reaching will it be? Is Neon for only the Shell; dig deep enough and you’ll find the stuff that’s been there since Windows 3.0? Or will it be deeper? Will it be part of one big update or slowly integrated in? Most of these answers won’t be known until Microsoft makes whatever their doing publically known. However we can sort of trace where Neon is coming from and why it’s coming together now.

neon_suspect

History Lesson

It is hard not to start a design conversation about Microsoft and not start with Metro; the design language built for Windows Phone. That design had a profound impact on Microsoft. In many ways Metro brought design thinking to Redmond as part of the product. And while Metro was influential it was/is divisive; especially the version that ended up in Windows 8. It’s development stalled with the stalling of Windows Phone and later Windows RT. This led to the Modern Design Language or MDL.

MDL faced a huge task; bridging the UI of Windows Phone with the UI of Windows 8. It had to work across screen sizes and inputs while maintaining the Metro ideal. The result was mixed. Much like Windows 10, MDL was geared more toward easing the fears caused by Windows 8 mobile first posture. A balance was hit in the update to MDL but much of what made Metro a strongly identifiable interface were taken out or muted.

Now that was a really condensed version and it only tells part of the story. The other half is about the formalizing of Microsoft design.

Between Metro and MDL design responsibilities were shifting at Microsoft. What we now call Metro started inside what was the Entertainment and Devices Group (home of Xbox). At that time Chief Experience Officer J Allard was working on consumer initiatives like Windows Mobile, Zune, and Xbox.

The actual work of designing Metro was done at Pioneer Studios, Allard’s skunkworks group. The Metro associated with Windows 8 was done by the Windows team headed Julie Larsen-Green under Steven Sinofsky. So different teams, different approaches, and little contact. After Allard and Sinofsky both left their respective domains were joined together into Windows and Devices. In an interesting twist the design team for Windows comes from the core developed by Allard. Design was also elevated with company reorganization.

Building the City

Back in 2015 the idea of the city as an analogy for Windows’ UI was used. The first time I heard it was from Principal Designer Kat Holmes. It was used then to describe how while each service, like Office, has its own unique identity it was still part of Windows.

The analogy was used again by Windows’ design chief Albert Shum to describe the changing approach to Windows UI in 10 (along with a stated recommitment to underlying principles of Metro like typography).

The idea of the City; a place with clearly defined lines yet also containing differentiated neighborhoods is a good place to start a discussion about the Windows Interface. Given the products built by Microsoft and the wildly different ways it’s used is a lot like living in a city. Windows is complicated and after both Windows 8 and 10 complicated in ways unique.

Neon seems to be about easing these complexities.

neon_suspect5

Neon Signs

So why Project Neon?

Go back to the beginning of Windows 10. It was built upon the work of Windows 8 and RT and was mainly about answering desktop user concerns. The MDL was designed to make it easier on desktop users to use features built for Windows 8. The MDL was built to make the transitions between mobile and desktop easier along with making it easier for app developers to port apps to Windows. Part of the criticism that MDL received was based around how much it was about being this bridge without it’s own identity. And I think the designers in Redmond took the lessons of MDL and Metro into Neon.

At this stage I should explain that the primary goal of a design language is in creating a common framework from which designers and developers can start. It is a guide and not the rules. I think one of the big lessons of Metro was making sure people understood that the design language and guide are the basic things to do not the only thing. With Neon Microsoft is pushing Windows and its users further into the modern age.

(Okay this is the part where I make up stuff and I had no witty transition so I put this here instead)

Neon comes at a point where Windows is being pulled in many different directions. On one hand there is the traditional PC with its mouse and keyboard. Then there is mobile which depending on your phone may also look a little like your PC. The Xbox is now a Windows device as is the HoloLens which computes neither like a pc or a phone. Add to this devices like 2 in 1s and you factor in tablets (and pens); Windows is complicated.

So Neon’s job will be about making tablets, pcs, and phones feel at home and usable. Neon will also improve on the various inputs Windows uses such as pen and touch. With Windows 10 inking saw major improvements and I expect those to be part of Neon. Neon will also be a spring board for mixed reality. Devices like HoloLens and the HTC Vive need interfaces and Neon will be part of their integration.

Lastly, Neon’s design will be about setting Windows up for the next generation of devices. Windows 10 came about because Microsoft wanted to move forward. I think Neon is about defining what moving forward means.

It’s going to be interesting seeing how this pans out.

 

Before reading the article posted today on Windows Central I have to admit I was nonplused by what was coming down the pike for Windows. The fact is Windows as an OS needs a make over but can’t get one because legacy keeps it afloat while drowning it.

And I know a lot of people need and require software built on top of x86 but it does prevent things moving forward.

Then Neon happened and my inner UI nerd fainted.

 

neon

image: New Creation

 

Metro 2.0

According to Zac Bowden at Windows Central and Cassim Kefti at Numerama Neon is the codename for the next interface update to Windows 10. Kefti says internally Neon is being described as “Metro 2.0” in reference to the UI introduced with Windows Phone. Windows Central describes it as a streamlining of various efforts to bring level of coherency throughout the system. Neon also looks to add new animations and transitions to Windows 10. Neon also appears to be an effort to integrate new UI elements for augmented and virtual reality headsets. The timeline for the changes according to both articles seems to be Redstone 3, the update planned for 2017.

Neon

So what do I think? Honestly I am hyped by the news nd the possibilities. The news follows reporting from ZDNet about x86 emulation running on ARM for Windows Mobile. The emulation news was preceded by new mobile features coming with Windows’ next update. All this adds up to interesting times ahead for Windows mobile users and enthusiasts.

Now that was the hope. Here is the wants and needs.

First, there needs to be a visual update to both the Start Screen of Windows mobile and the start menu/tablet mode on Windows 10. I include them together because those are the public facing parts of the OS and the ones users use when mobile or without a keyboard. Windows 10 is fine for tablets but can always use improvements.

Second more features for Live Tiles and the lock screen. Neon is the perfect opportunity for features like Interactive Tiles or anything that moves the Tile metaphor forward. Also the Lock screen has been there sitting waiting to be unleashed; maybe the work of Microsoft’s Arrow Launcher could help.

Last, seamless integration of mixed reality into the platform. Windows has merged touch with the mouse and keyboard and no it was not easy. Hopefully they learned from those growing pains.

Honestly it’s early days and I will be revisiting this topic in future.

ImageSo I am slowly returning to the misguided idea of doing a set of articles on User interface design. My problem is that I’m having the hardest time trying to find the right words without coming across as dumbass or a brown-noser (which in the end I may well be). So I thought I’d begin with a link and a video that best describe how I think about the Metro Design Language.

Just so you know it deals with the Grid, Book design, and the Stop sign you just run.

First a video I found form PBS: Typography (Off the Book)

Next two posts from Craig Mod

Hack the Cover (Honesty this should be the first thing people read before even thinking about designing Live Tiles or icons in general)

The Digital-Physical

And that’s it, till next time