8 Principles for Designing Gesture-Based Applications

Co-authored by: Alona Lerman, Shachar Oz, and Yaron Yanai

There’s plenty to talk about when it comes to best practices for designing gesture-based applications.  On the blog, we’ve covered a range of topics related to building your application: how augmented reality can be used as a feedback system, the role of ergonomics when designing a practical UI, and how to leverage our Gesture Authoring Tool to create custom gestures in your apps. . .just to name a few.

Future posts will continue to offer ideas and feedback on how to design intuitive applications.  But in this post we offer a few practical tips to consider when designing and testing the usability of your gesture or motion sensing application.

Where to begin? Start with the experts

When we talk about usability, we are referring to the “ease of use and learnability” for your application, game or interface.

There are many excellent resources available to help you with your usability testing.  We recommend a few here but there are obviously many, many more out there in Google just waiting for you!

8 Principles for Designing Gesture-Based Applications & Interfaces
(and a few common mistakes to avoid)

We’ve gathered up a few key points to keep in mind as you get started building your applications. These are principles that we’ve learned along the way, or perhaps reflect mistakes we’ve either made ourselves or have seen others make when building gesture-based apps.  While this list isn’t intended to be a comprehensive, it does touch on foundational points to keep in mind.

  1. Precision is a good thing. . . up to a point.
    When designing the UI for a gesture-based app, it’s better to fall on the side of larger buttons making it easier for users to correctly make a selection.  When you require a great deal of precision it can quickly lead to user fatigue. Our last blog post touches on exactly this point – imagine using your finger instead of a mouse to select a specific “cell” in Excel.  Frustrating, no?

    Design for fingers & hands, not a “mouse”

  2. Don’t model your application on existing user interfaces.  Instead, build on the strengths of gesture and motion tracking technology.
    Traditional user interfaces are based on a WIMP model – windows, icons, menus, pointer. As mentioned above and in our last post, your finger is not a mouse!  So, rather than trying to turn it into one, instead leverage the 3 dimensionality of the hand. For example, imagine an online store where you can pick up an object (how about a shoe!) and turn it around by rotating your hand.
  3. Avoid actions that require your users to lift their hand above the height of their shoulder.
  4. Try to avoid awkward poses. It should be fun to interact with your app!

    You don’t need to have a degree in physical therapy to design gesture-based applications, but it does help to give some thought to ergonomics and how human bodies move naturally.  It can get pretty tiring pretty quickly, and can even be challenging for some users to have to lift their arms high.

    Co. Design featured the work of “Curious Rituals”
    to call out the unnatural postures we make to conform to technology. Gesture recognition is a way to free us from these awkward poses.

  5. Do break up activities into small, short actions.
    Try to keep actions relatively brief with rest periods in between rather than having users move all over the screen.  John Pavlus recently wrote an article for the MIT Tech Review on whether gestural computing breaks Fitts’s Law.  You may want to review a brief primer on Fitts’s Law when considering menu placement – users want to be able to navigate from selection to selection as quickly as possible.
  6. Not all users are right-handed.
    You’ll have to make a judgment call as to whether to design your application to be equally useable for both right and left-handed users. The good thing is that if you work with Omek’s Grasp then you are ensured accurate detection of left vs. right hands. This Grasp feature can prove useful if you are creating an application intended for multiple users sitting next to each other.
  7. Gestures have cultural connotations.
    Gestures can have different meanings in different cultures so be conscious of context when designing your app. For example, the “thumbs up” and “peace” signs both have positive connotations in North America but quite the opposite in Greece and areas of the Middle East, respectively. It may be a good idea to do a quick check on gestures before going live in other countries.
  8. Design your interface to keep users within the “Effective Interaction Zone”.
    Try to avoid placing elements (menu selections) too close to the edge of the FOV of the camera. If you do, users may not realize that their hand has moved outside of view of the camera, causing a frustrating experience for them when their selection doesn’t work.
  9. Test your design with hands and people of all sizes.
    Test, test and test some more before going live. That’s a motto that we try to stand by. And the broader the types of people that you have to test (i.e., tall vs short, large vs. small hands, different sized arms) the better! That way you’ll be sure your app and interface will work just as well for a basketball player as it will for a small-handed lady (like the author of this blog post).

Interested in creating your own close-range gesture-enabled experience? Sign up to be notified of our upcoming Grasp beta release.

3 thoughts on “8 Principles for Designing Gesture-Based Applications

  1. About awkward gesture design:
    painful (& not fun) palm postures could also happen without lifting your elbow from the table. for example, force your user to pose their hand or stretch it in an angle that it starts to hurt. interestingly, we found that different people have different levels of “pain” endurance, and therefore you should design your gesture to be not painful in any way.

    a future article would emphasis more about this might-seem-obvious-but-not-actually point.

  2. Pingback: Omek | 8 Principles for Designing Gesture-Based Applications | audiosapiens's blog

Click on a tab to select how you'd like to leave your comment

Leave a Reply

Your email address will not be published. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>