With the introduction of the Leap Motion Controller, we’re unlocking a more natural and intuitive way for people to interact with computers. This is the first time ever that users have the power to control an experience with nuanced hand and finger movements in three dimensional space.
Yet, while consumers may have had a basic introduction to motion control in some contexts (e.g. Microsoft Kinect™ and the Nintendo Wii™) this is an entirely new experience for them as it relates to their everyday machines. Interacting in this new way can take some getting used to – and ensuring that you give users a proper understanding of exactly how to interact with your software will mean the difference between a magical experience and one that might leave users frustrated or confused.
The following are a few different ways to approach the task of guiding users and teaching them specific interactions within your apps. Whichever you choose, make sure your orientations and tutorials are easily accessible from any point in the app.
One of the first introductions to your app might be the screen shots and demo videos that a user sees. It is highly recommended that you publish a video which shows off, not only the app functionality, but how a user performs the interactions needed for your app. The following apps have video demos that help users understand the game play and Leap Motion interaction.
Interaction Keys are discrete screens (shown either before starting an experience or accessible via a ‘help’ or ‘info’ menu) that outline all of the basic interactions and controls used in an app. It can be great to see everything in one place – but diagrams used need to do a good job of demonstrating both context and action. Even better, simple animations can go a long way in helping users immediately grasp the difference between discrete controls.
While you may have the resources to design your own gesture hints and icons from scratch, it may help to expedite the process by starting with some existing design assets. Some of these may focus on touch but are a good foundation for designing your specific gestures.
A Walk-Through Tutorial is a series of screens, directions or interactive tasks that lead new users through each different part of your app. Often times, breaking more complicated interactions down into discrete parts can be a great way to introducing new users to the mechanics of your software. And, as always, letting users learn by doing is a great way to help them master controls in a safe environment and ultimately bolster their confidence as they dive into your app.
This walk-through tutorial by Deco Sketch shows how the user’s finger position over the Leap Motion Controller changes the interaction from “Menu” to “Draw” modes.
Giving hints or cues to a user while they are interacting with your software can be an elegant way to subtly direct behavior. Simple contextual graphics paired with instructions (e.g. a pointing hand + “Tap to Select”) can go a long way in guiding users in the right direction. It is important, however, to make sure that these cues are as unobtrusive as possible and only support the experience vs. distracting from it.
The Heads Up Display (HUD), shown in the lower right corner of Jungle Jumper, gives the user additional feedback as to their hand position and state. While not necessary for every app, this sort of visual feedback can be very helpful in describing to the user the extent of the Leap Motion interaction zone and what is being detected by the device.
Live controls in the tutorials provides an experiential approach to teaching interactions by requiring users to perform certain simple tasks in menu selections or discreet tutorial mode. This is truly ‘learning by doing’ and can be a creative way to reinforce gestures that are core to your app. Depending upon the complexity of your application, providing these interactive tutorials or a practice mode might be worthwhile.
Whichever tutorial option you provide in your application, put yourself in the user’s shoes and give them what they need to succeed within your app. As you can see from some of the above examples, additionally including some indication as to the best position of the user’s hands in relation to the Leap Motion Controller (this may differ depending on the application) can be extremely helpful.
Lastly, be sure that you enable the user to intuitively access these tutorials and help screens from anywhere within your application. We highly recommend that a tutorial is shown upon the very first entry into the app. Within the app, the tutorials could be accessed via an explicit and persistent “Help” or “?” icon or via the main menu, if applicable.
No matter how simple your app may be, a little help can go a long way. Set your users up to get the most out of your app and they will become your biggest fans.