This is the third in a series of blog posts where I discuss how we built Cloud Hunter – the scavenger hunt mobile app for Dreamforce 2012. The first post covered the basic application use case and architecture and in the second post, I described how we converted a Visualforce-based web version of Cloud Hunter into hybrid Android and iOS applications using the Salesforce Mobile SDK. In this post, I’m going to cover some of the application functionality that we implemented in the hybrid version of Cloud Hunter.
Taking a picture
Capturing a signature
Signature mission types require the player to capture the signature of a particular person/luminary on their mobile device. Signature capture is basically just the capture of a user’s touch gestures on a screen. You don’t need PhoneGap or a hybrid application to capture signatures. It can be done entirely in HTML5 using the magical Canvas element. You can of course implement you own custom signature capture widget, but in the spirit of reuse (aka ‘copy and paste’), Cloud Hunter uses a free JQuery plugin called jSignature to implement it’s signature capture. As you can read from the jSignature documentation, that library uses an HTML5 Canvas element to capture a user’s signature as vector outlines of the strokes and returns a high-quality SVG image of the same.
In the final post of this series, I’ve cover how Cloud Hunter implemented check-ins (i.e. Geolocation) and Bar/QR code scanning.