Guest post by Alexander Galkin of the Windows 10 team.

Audible Universal App for Windows 10

We are proud to announce the release of our Audible Universal app for Windows 10. We started working on the Windows 10 app just after the Microsoft Build conference in early May, and within three months, with two designers and two engineers, we designed and built a universal, adaptive application that works just as well on a large desktop monitor as on a four-inch phone.

What is a universal app?

One Windows Platform

To answer this question we need to look at the history of the Windows operating system and understand how Windows 10 is different from its predecessors. Windows was designed several decades ago as a desktop operating system. When Windows mobile and later windows Phone appeared in early to mid-2000’s, Microsoft effectively forked Windows into another branch – Windows Mobile. When Xbox appeared later it forked Windows into yet another branch of Windows for Xbox. Now there were three different Windows operating systems. It was not sustainable to maintain and made life for developers very hard: to target these three platforms you needed to build three different apps, and submit to three different stores.

We learned as we designed the app. There were no apps to reference - even Microsoft Windows 10 apps did not exist yet

With Windows 10, Microsoft converged all three Windows Operating Systems into a single target with one SDK, one kernel, and one platform that powers these three platforms and any new devices such as IoT, Hololens, etc.

How we built a universal app in three months

When we started this project we immediately faced several challenges, many of which we had never dealt with before. We learned as we designed the app. There were no apps to reference - even Microsoft Windows 10 apps did not exist yet – and Microsoft’s UX documentation was still developing.

Since we were building a universal app, we needed to consider the app can run on a variety of both existing and future Windows 10 devices: laptops, PCs, tablets, 2-in-1, phones, XBox, etc. These devices have different screen sizes, different capabilities, and different inputs: some have a mouse, some have a touch screen, some have a pen, game controller, etc. We began by focusing on key breakpoints across the most popular devices to address the primary use cases. However, because Windows 10 allows the app to run in any-sized window as well as full screen, the number of screen size possibilities is virtually unlimited. Designing the app with an adaptive UI and adaptive input was a key requirement to make the Audible Windows 10 app truly universal.

The Audible app uses visual state triggers to activate a visual state based on various parameters: width, height, and device type. For instance the left navigation, which is a core navigation pattern of a Windows 10 app that allows user to navigate between screens, has four states: inline, compact inline, overlay and compact overlay. Depending on the app width, the left nav’s state changes; if the app’s width is greater than 640 effective pixels, the left nav moves to inline mode, if the app’s width is between 580 and 640 effective pixels, it is in compact inline mode, if the app’s width is less than 580 pixels, it moves to overlay mode.

Audible app at 580 effective pixels wide The app at 580 effective pixels wide

Audible app at greater than 640 effective pixels wide The app at greater than 640 effective pixels wide

Audible app at less than 580 effective pixels wide The app at less than 580 effective pixels wide

Every screen we designed has different visual state and visual triggers ensuring the screen looks the best in any size. In addition to size based visual triggers, we built custom device type triggers that activate visual state based on device type (Desktop vs Mobile vs Xbox) and the presence of a certain input, like touch screen or key board. For instance, we only show our button free mode on touch screen devices, and we added arrows to our carousels on devices that have a mouse.

Continuum

One of most exciting Windows 10 features is Continuum. Continuum is the ability to transition from one mode to another depending on device. For instance, unplugging Surface from keyboard automatically switches the device to tablet mode, and plugging the keyboard in turns on desktop mode. This continuous experience across devices allows a user to connect a small device, like a phone or small tablet, to a TV and have the app running on the phone appear as if it’s running directly on the TV. Just like a user docks their laptop with a large display, they can now ostensibly dock their phone into a keyboard and large display station, and effectively treat the phone as a computer. Since the Audible app is designed as a Universal Windows App, we support continuum out-of-the-box. We verified, and it’s truly as awesome as it sounds.

What’s Next?

We are very excited about Windows 10 platform, the next devices it will power, and the possibilities and options it provides both for Audible’ business and Audible’s customers. We are looking forward to a day when the Audible universal app will be running on future Windows 10 phones, Xbox and the Hololens.