Gesture recognition for Javascript and Flash

gesturerecog_20081106.jpg

The "$1 Recognizer" is a simple gesture recognition algorithm created by Andy Wilson from Microsoft Research and Jacob Wobbrock and Yang Li from the University of Washington.

By simple, I mean that it's under 100 lines of code that you can quickly add to your application to give it gesture recognition capabilities.

To enable novice programmers to incorporate gestures into their UI prototypes, we present a "$1 recognizer" that is easy, cheap, and usable almost anywhere in about 100 lines of code. In a study comparing our $1 recognizer, Dynamic Time Warping, and the Rubine classifier on user-supplied gestures, we found that $1 obtains over 97% accuracy with only 1 loaded template and 99% accuracy with 3+ loaded templates. These results were nearly identical to DTW and superior to Rubine.

It works by using a simple 4-step process, which basically amounts to:

  1. Resampling the recorded path into a fixed number of points that are evenly spaced along the path
  2. Rotating the path so that the first point is directly to the right of the path's center of mass
  3. Scaling the path (non-uniformly) to a fixed height and width
  4. For each reference path, calculating the average distance for the corresponding points in the input path. The path with the lowest average point distance is the match.

What's great is that the output of steps 1-3 is a reference path that can be added to the array of known gestures. This makes it extremely easy to give your application gesture support and create your own set of custom gestures, as you see fit.

Give the demo a try. I was pretty surprised at how accurate the results were, even with single-temple custom gestures that I quickly scribbled out.

$1 Gesture Recognizer - Examples and Source (Javascript, Actionscript, and C#)

Gestures without Libraries, Toolkits or Training:
A $1 Recognizer for User Interface Prototypes (PDF)


Recent Entries

Leave a comment


Subscribe to MAKE!Subscribe to MAKE Magazine!

Subscribe today, save 42% and get web access to MAKE free. MAKE Digital Edition is available only to subscribers.

$34.95 / 1 year
(4 Quarterly Issues)

Subscribe now


Void your warranty, violate a user agreement, fry a circuit, blow a fuse, poke an eye out. Make: The risk-takers, the doers, the makers of things... Welcome to Make: Online!


CRAFT Maker Shed Maker Faire MAKE television
Holiday Gift Guides from MAKE
Gifts for Dads
Science and Chemistry
Gifts Under $20
More guides: Santa Claus Machines, Geek Toys for Grown Up Girls & Boys


Check out all of the episodes of Make: television

Alex Rider Dream Gadget Contest
Make: Science Room

Connect with MAKE

Be a MAKE fan on Facebook MAKE on Facebook
Visit our Facebook page and become a fan of MAKE!
MAKE on Twitter MAKE on Twitter
Follow our MAKE tweets!
MAKE Flickr Pool MAKE on Flickr
Join our MAKE Flickr Pool!
    make_tips on Twitter




    Maker SHED

    Advertise here with FM.

    Why advertise on MAKE?
    Read what folks are saying about us!

    Click here to advertise on MAKE!



    Subscribe to MAKE Magazine!

    Make: Online authors!

    Gareth BranwynGareth Branwyn
    Senior Editor


    Phillip TorronePhillip Torrone
    Senior Editor
    | AIM | Twitter


    Becky SternBecky Stern
    Associate Editor
    | AIM | Twitter


    Marc de VinckMarc de Vinck
    Contributing Writer
    | AIM | Twitter


    John ParkJohn Park
    Contributing Writer
    | Twitter


    Sean RaganSean Ragan
    Contributing Writer
    | Twitter


    Matt MetsMatt Mets
    Contributing Writer
    | AIM | Twitter


    Dale DoughertyDale Dougherty
    Editor & Publisher
    | Twitter


    Shawn ConnallyShawn Connally
    Managing Editor
    | Twitter


    Goli MohammadiGoli Mohammadi
    Associate Managing Editor

    Kip KayKip Kay
    Weekend Projects
    | AIM | Twitter


    Collin CunninghamCollin Cunningham
    Contributing Writer
    | AIM | Twitter

    Adam FlahertyAdam Flaherty
    Contributing Writer
    | AIM | Twitter



    More contributors: Mark Frauenfelder (Editor-in-Chief, MAKE magazine), Kipp Bradford (Technical Consultant/Writer), Chris Connors (Education), Diana Eng (Guest Author), Peter Horvath (Intern), Brian Jepson (O'Reilly Media), Robert Bruce Thompson (Science Room)

    Suggest a Site!

    Current Podcast

    itunesdl.gif Weekend Project: Beetlebot Simple robot from your parts bin that avoids obstacles. Thanks go to Jerome Demers for the original article in MAKE, Volume 12. To download the Beetlebot video, click here or subscribe in iTunes. Check out the complete Beetlebot article... More...

    Get the Make: Online sent via email
    Enter your email to receive Make: Online each day:



    MAKE Fascination video series brought to you by Dow

    Make: Education
    MAKE: en EspaƱol MAKE: Japan
    Important please read


    Subscribe to MAKE Magazine!

    Recent Posts from the Craft: Blog