A deep dive into the Surface Duo’s virtual keyboard

Microsoft is good at physical keyboards. But with the introduction of the Surface Duo, they need to nail virtual keyboards, as well.

First and foremost, Microsoft’s new pocket-sized, foldable Surface Duo needs to be a productivity device. That means one of the most important things the Surface team needs to get right is the virtual keyboard.

Microsoft takes keyboards seriously. During the October Surface event in New York, Panos Panay — Microsoft’s Chief Product Officer and the creator of the Surface line of devices — said this of the Surface Laptop 3:

“There’s parts of the laptop you can never compromise… The keyboard.” —Panos Panay

And he clearly meant it. Microsoft is very good at physical keyboards and believes in them so strongly that the new Surface Neo — the Duo’s larger sibling — will have a magnetically attachable keyboard accessory.

The Surface Neo’s magnetically attachable keyboard. (Credit: Microsoft.)

But virtual keyboards are an entirely different proposition — especially in the context of dual-screen, foldable devices. The virtual keyboard on the Surface Duo must not only adjust to all the device’s different orientations and configurations, but in the process, it must always maximize productivity.

Tablet Mode

The simplest keyboard configuration for the Surface Duo is when the device is in tablet mode — when the Duo is folded all the way open with one screen facing the user. Not much controversy here. The keyboard can behave exactly as it would on a traditional smartphone, so it should look something like this:

But tablet mode doesn’t leverage the full potential of a foldable, dual-screen device. The productivity promise of the Surface Duo is having access to two screens at the same time. This is where virtual keyboards get much trickier.

Book Mode

Using a traditional keyboard configuration when the device is in dual-screen, book mode should look something like this:

The implementation is straightforward and the user experience is familiar, but since you can only use one thumb to type in book mode, the Surface Duo may not be delivering on its promise of maximum productivity. At the very least, users should be able to choose which screen the keyboard appears on so they can use swipe-typing with their dominant thumb.

But there are clearly better ways to type on dual-screen devices, such as…

Compose Mode

Compose mode means allowing the keyboard to fill one entire screen and should look something like this:

There are two ways compose mode can be initiated:

1. Manually. The user rotates the device from landscape to portrait orientation while the keyboard is visible.
2. Automatically. When the OS would normally show the keyboard (usually when a text field receives focus), the device automatically goes into compose mode.

The first option makes perfect sense, but the second concerns me. Compose mode is a jarring transition, requiring the user to not only change the device’s physical orientation, but to adjust their own mental orientation, as well.

In my mind, compose mode should always be user-initiated. That brings us to…

Splitting the Difference

I have a theory that the best way to maximize input productivity while the device is in book mode is to split the keyboard across both screens, like this:

Or, if you want to get fancy, maybe like this:

There will be a learning curve associated with acclimating to a split keyboard, but it will likely be worth it for many users. Splitting the keyboard across both screens means that Surface Duo users:

• Can use two thumbs to type.
• Don’t have to change the device’s physical orientation.
• Don’t have to mentally reorient themselves.
• Can still reference content on both screens as they type (at least the top 2/3rds).

I obviously haven’t gotten my hands on a Surface Duo device yet, but being a Design Prototyper, I couldn’t help but start trying to solve some of the device’s biggest challenges. Fortunately, when it comes to innovative new form-factors like the Surface Duo, some of the most daunting design challenges — when rigorously prototyped and properly validated — can lead to some of the biggest product and market opportunities.

Resources

If you’d like to play with the Surface Duo keyboard prototype I built, it’s available online. I used Adobe Xd for the design, and I implemented the animations in JavaScript and with CSS. All the code — and the Xd design file — are available on GitHub. And finally, when building this exploration, I remembered that I prototyped the virtual keyboard from Tron: Legacy back in 2012 which still makes for an entertaining video.

Case closed.