PhoneGap Day: PhoneGap & Hardware

I’d like to express a huge Thank You to everyone who attended PhoneGap Day in Portland last week, and to Colene and the team that put everything together! The day was loaded with fantastic presentations, and great community interaction… tons of information, tons of great questions, and tons of great people (oh, and beer – it wouldn’t be PhoneGap Day without beer).

My session was about the integration of PhoneGap with hardware. Basically, it was an overview and exploration how you can use native plugins to extend the capabilities of PhoneGap applications and interact with device peripherals. This enables new interaction paradigms, and helps evaluate and evolve what is attainable with web-related technologies.

In this session, I covered two use cases… The first use case is the use of a pressure-sensitive stylus for interacting with a PhoneGap application on iOS. The second use case is integration of a Moga gamepad with a PhoneGap application on Android. In both cases, the application experience is augmented by the peripheral device, which changes how it is possible for the user to interact and engage with the application content and context.

Pressure Sensitive Sketching in PhoneGap

In this example, the pressure-sensitive Pogo Connect Stylus uses a low energy Bluetooth 4 connection to relay touch/pressure information back to the PhoneGap application. This makes for a unique drawing and sketching experience powered with the HTML5 Canvas element. I’ve written about this example previously… Check out the video below to see it in action, and read the blog post for technical details and source code.

Moga Gamepad

The second example that I explored is a PhoneGap native plugin that is used to handle input from a Moga game controller inside of a PhoneGap application on Android.

This implementation is intended to be a proof of concept demonstrating how you could integrate the gamepad within your application. It currently only supports input from the joysticks (axisX and axisY) and the A and B buttons, and it does not handle all possible input from the controller.

This implementation is adapted directly from the com.bda.controller.example.demo.listen example from the Moga developers SDK samples available for download at:: http://www.mogaanywhere.com/developers/

Check out the video below to see it in action:

The game is based on the Universe prototype that was used as a sub-game inside of the MaxMe app for the recent Adobe MAX conference. I make no guarantees about the code for this game, it was in a huge rush!

Quick Links

If you want to see more images from PhoneGap Day, check out my Flickr photo set from the event.