Signature capture possible in various mobile web b

Question

My company is considering offering a lightweight mobile web site for data entry in the field (we already have a thick-client mobile application). One hard requirement is that we must be able to capture a signature.

Is there any prior art for capturing a signature, specifically inside a web page running inside a mobile web browser, across a wide variety of mobile devices/web browsers? I am only asking for in-browser solutions, not thick-clients.

For obvious reasons, the device would be required to have a touchscreen.

Certainly there are many, many different mobile browsers out there with a wide variety of capabilities. The ideal solution would support as many browsers as possible and degrade gracefully based on browser capabilities.

I am already aware that certain versions of Flash might provide the drawing APIs needed for something like this, assuming the desired device's browser supports Flash.

I'm also aware of a third party ActiveX/OCX control for Pocket IE on Windows Mobile devices. It is necessary for the user to manually download/install the control within the browser before use. Unfortunate, but acceptable.

I'm not personally aware of many mobile browsers that support hosting a Java applet, but there are probably some. Again, based on the support for various Java APIs, perhaps this would be a possible avenue.

Javascript could do this, if the engine and processor are robust enough on the device.

Finally, total pipe-dream here, perhaps one could have the user take a picture of a signature using the mobile device's camera on a plain piece of paper and somehow count that as a valid signature. However, this would produce a bitmap image, as opposed to vectors which I'd likely be collecting in all other instances. Also, it would be pretty difficult, if not impossible/unreasonable, to integrate the taking of the photo via a camera app and upload that using the web browser app while associating that specific image with the rest of the data being captured.

Thanks.

Answer 1

http://mysignature.brinkster.net - Does not work for a Mobile browser http://thomasjbradley.ca/lab/signature-pad - Does not work for the IE. It has canvas and flash technologies. IE has problem with canvas tag.

Answer 2

There is a jQuery plugin to do this now -> http://thomasjbradley.ca/lab/signature-pad

The previous link is inactive as of March 17, 2016, but the relevant repository is on GitHub: https://github.com/thomasjbradley/signature-pad

Answer 3

Without embedding something on a web page, the only way to do this would be with JavaScript.

Unfortunately most mobile browsers don't support JavaScript and the ones that do aren't particularly fast.

I don't think that it's possible to create a generic solution based on most of the devices which are currently around.

Answer 4

I think the picture idea is really clever, but I'd take it one step further. Some mobile devices (phones in particular) don't even do file uploads in a browser. I'd generate an operation specific email address, a hash of some sort of transaction id and the user id for instance, and allow it to be sent as an email attachment. This should catch a very wide variety of clients, as well as not adding terrible complexity.

Answer 5

thomas j bradley's jQuery signature-pad plugin is awesome and very easy to implement.

Answer 6

Canvas, with Flash (Through FlashCanvas) worked well for us with jSignature. http://willowsystems.github.com/jSignature/

MIT + Works (was specifically written to run) everywhere there is Canvas or Flash. + tested on iPad, iPhone, Android tablets, phones.