Surfacing Development with the Surface Dial

Sign in to queue

Description

Last month we highlighted code samples for developing for the Surface Dial, Radical Samples for the Surface Dial.

Today we've got a great post from Connor Weins which shows a number of in's and out's, tips and tricks in developing for the Surface Dial...

A New Input Paradigm in Windows – The Surface Dial

"...

The Surface Dial introduces a new paradigm for input in Windows. The Surface Dial is a new category of input device, which we refer to as a radial controller, and is a revolutionary new tool for the creative process. With tools and shortcuts at your fingertips, the Surface Dial allows you to remain focused on what matters most. You can manipulate images, adjust volume, change color hues and much more, all with simple gestures. With the Surface Dial in one hand and Surface Pen in the other, the creative process is made more productive and more enjoyable. Additionally, you can place your Surface Dial directly on the screen of the Surface Studio and have favorite tools – like a color picker or ruler – at hand and easily accessible on your digital drafting table.

When paired over Bluetooth with a Windows 10 Anniversary Update PC, the Surface Dial delivers a breadth of new experiences to users and opens a world of possibilities. The goal of this blog is to walk you through how you can build your own experiences on the Surface Dial in your application.

Introducing the Radial Controller

For Windows, the Surface Dial represents a totally new type of input device in the system, which we refer to as a radial controller. To go along with this brand-new type of input, Windows has delivered an integrated experience that makes it easier and faster for users to customize and do the things they love – all with a turn of the Dial.

The Surface Dial has a simple set of gestures: It can be rotated, it can be pressed like a button and it can be placed on the screen of the Surface Studio. These gestures are instantly familiar to users and easy to learn. When you press and hold the Surface Dial, a menu experience shows up that presents a selection of tools that can be controlled. These tools offer a variety of functions designed to improve the user’s workflow and keep them immersed in their creativity – from scrolling and zooming, changing volume and controlling media playback, undo and redo, custom keyboard shortcuts and more. It also integrates further with a broad and growing set of in-box and 3rd party apps, unlocking new tools when used with the Windows Ink Workspace, Office, Maps, Groove Music, Sketchable, Bluebeam Revu, Moho 12, Drawboard PDF and more. With the Surface Dial, unlocking new functions for users across every Windows app, they’ll be excited to explore how the Dial can help them in their favorite apps. With the extensibility available through the Windows universal platform, it’s easy for your app to bring that delightful Surface Dial experience they’re searching for!

The first and simplest way to add value with Surface Dial is to use Windows inbox components that come with the Surface Dial integration built-in. For developers who leverage the Windows Ink platform to give their users the power to write, draw, and create with their pen, the InkCanvas and InkToolbar XAML controls populate the Surface Dial’s menu with new tools, allowing users to quickly modify the attributes of their ink, change the thickness of their ink as they write and control the on-screen ruler. This gives you the same great Surface Dial integration available in the Sketchpad and Screen Sketch apps in the Windows Ink Workspace.

...

For media players, integrating with the SystemMediaTransportControls will give the same ability to pause, play and skip tracks with the Dial as Groove Music and Spotify.

For developers who want to go beyond the default integration built into the system and create something truly unique, Windows makes it easy for you to add your own tools to this menu through the RadialController platform. The RadialController universal APIs allow you to build your own custom tools for the Surface Dial’s menu and handle Dial input from both Universal Windows Platform apps and classic Win32 apps. You have the option to respond to the button and rotation input available on all Windows devices, or go one step further and build immersive UI experiences for when the Surface Dial is used on-screen on the Surface Studio.

Let’s start by looking at what it takes to build a custom tool experience for the Surface Dial!

Building a Custom Tool for the Surface Dial.

...

Handling On-Screen Input for Surface Studio

As we called out above, there are 2 modes which a radial controller device can be used in: off-screen and on-screen. When the Surface Dial is placed on the screen of the Surface Studio, the RadialController API gets the location and the bounds of the contact so that you can build richer and more immersive experiences for the user.

...

Start Creating with Surface Dial

Using what you’ve learned so far about the RadialController APIs, you can now integrate the Surface Dial into your application, handle input and configure the system menu to meet your needs. You can build a huge range of delightful features for your users, ranging from simple modification of values and properties, to driving complex onscreen UI for Surface Dial users on the Surface Studio.

For more information on UX design and best practices with Dial, please consult our Surface Dial development overview, and you can find the full source code used in this project on GitHub.

Surface Dial and the RadialController platform is a new area of investment for Microsoft, and one of the keys to improving the platform and making it more flexible and powerful is getting feedback from our great community of developers! If you have any questions or comments while developing for the Surface Dial, please feel free to send them via email to RadialController@microsoft.com.

[Click through to see the code samples, read the rest of the post and more]

Get your Surface Dial on!



The Discussion

Add Your 2 Cents