$1 Unistroke Recognizer in JavaScript
Jacob O. Wobbrock,1 Andrew D. Wilson,2 and Yang Li1
1University of Washington   and   2Microsoft Research

This page implements the "$1 Unistroke Recognizer." Upon loading this page, only one template is defined for each unistroke below, but you can add more or define your own with the buttons beneath the canvas. Unistrokes should be regarded as fully rotation, scale, and position invariant. See our UIST 2007 paper (PDF) or a detailed pseudocode listing. Also see the new $N Multistroke Recognizer built upon $1.


Use Golden Section Search. The original $1 algorithm uses Golden Section Search to find the best angular alignment between the inputted unistroke and template unistrokes. It is a fast iterative search algorithm.
Use Protractor. Yang Li published an improvement to $1 called Protractor, which avoids the iterative Golden Section Search and instead uses a closed-form formula based on cosine distances, making Protractor considerably faster.

Make strokes on this canvas. If a misrecognition occurs, add the misrecognized unistroke as an example of the intended type.

The <canvas> element is not supported by this browser.
Add last unistroke as example of existing type:
Add last unistroke as example of custom type:
Delete all user-defined examples:  

$1 Links and Downloads

References

Wobbrock, J.O., Wilson, A.D. and Li, Y. (2007). Gestures without libraries, toolkits or training: A $1 recognizer for user interface prototypes. Proceedings of the ACM Symposium on User Interface Software and Technology (UIST '07). Newport, Rhode Island (October 7-10, 2007). New York: ACM Press, pp. 159-168.

Li, Y. (2010). Protractor: A fast and accurate gesture recognizer. Proceedings of the ACM Conference on Human Factors in Computing Systems (CHI '10). Atlanta, Georgia (April 10-15, 2010). New York: ACM Press, pp. 2169-2172.

$1 Implementations by Others