Team AirDraw


What if you could draw without paper or touchscreen? What if air was your medium? How about working with others? We explored the possibilities of working collaboratively, without physical touch.

What it does

AirDraw allows for wireless drawing on a collaborative whiteboard, by moving your fingers through the air to mimic the movements of a pen. Users can simultaneously draw and observe, with the "air pen", or opting for the traditional mouse movements.

AirDraw provides "air-pressure" sensitivity, where moving closer forces the pen to draw on the collaborative inkboard, and moving back simply shows the cursor. There are also gestures available for convenience, such as swiping to rub the board. You're finally able to save the canvas as a PNG image.

How I built it was used to transmit data between all the collaborating clients. Native HTML5 canvas drawing techniques were used to draw onto the boards. Finally, the Leap Motion device was used to detect air gestures and air pen movements.

Challenges I ran into

  • Integrating Leap Motion into Node and the Javascript API
  • Calibrating the Leap Motion to produce reasonable movements.
  • Producing replays, and socket mayhem.
  • Drawing to canvas (or lack of!)

Accomplishments that I'm proud of

  • Drawing to canvas
  • Basically completing all the challenges we faced above.
  • Producing a collaborative prototype that works across multiple devices.

What I learned

  • How to use HTML5 canvas
  • How to integrate Leap Motion with Javascript
  • Working with variety of technologies as newcomers and oldcomers alike.

What's next for Airdraw

  • Further calibration for accuracy.
  • User rooms for different meetings.
Share this project: