Yet Another Webcam Barcode Scanner
Let me be clear right up front - I didn’t come up with this idea. In fact, I’ve seen no fewer than three other web-cam barcode scanner implementations. This first one I saw was shortly after the release of Flash Player 8 with the introduction of the bitmap API’s. You can still use this version and access it as a component on Barcodepedia. Renaun Ericsson has also created a web-cam barcode scanner using ActionScript 3 complete with a Flex 2 user interface. I also ran across an implementation on the webqem blog.
None of these projects however provides source code, so I set out to build one myself.
I started off by searching the web for any existing code that I might leverage. I found a couple C# write-ups on parsing barcodes, but they both assumed a clean image. Next I headed to SourceForge, where I found a project written in Java. There was precious little documentation in the project however, so I rounded my knowledge out with an article on WikiHow. Once I had everything working, I started tweaking the code to maximize accuracy.
If you’re interested in how this is accomplished, the general process looks something like this:
- Attach Camera to VideoDisplay
- Start a Timer to sample (scan) at regular rates
- Capture the scan area to a BitmapData object
- Take samples from across the image
- Convert composite sample to grayscale
- Clear out noise through an unsharp mask
- Process sample to collect average grey threshold
- Walk across sample with threshold to determine “lines”
- Determine through averaging the width of a “line”
- Combine line groups to extract individual units
- Map units to numbers
- Run a check-sum on the barcode to determine accuracy
- Convert accurate UPC to ISBN
- Request Amazon product details using ISBN
- Request Flickr images based on author’s name as tags
The result is relatively accurate, but there’s a long way to go. First I’d like to look at detecting the barcode itself for cropping. Secondly I’d like to make the scanner smarter about what it sees - which might be early blocks of dark color that aren’t lines, and even to deskew the sampled image. Finally I want to add extensibility which would separate the image processing from the barcode matching (making it easy to add custom barcode types).
I’m a big fan of using web cameras for data capture - especially as it relates to barcode symbology. Web cameras are becoming commonplace and CCD sensor quality is constantly improving. Virtually everything has a barcode on it, and of course there are numerous tools for generating barcodes (including Adobe LiveCycle).
To me, this functionality, since it is possible with Flash, should be openly available to developers. Ideally this might be rolled into a RIAForge project, so it can be contributed to and improved by the community. For now however, here’s an example application and the source code.
Disclaimer
As mentioned above, this demonstration while relatively accurate, is far from perfect. There are many optimizations that could be made to enhance accuracy and/or speed. Your web camera may not have the required resolution to provide adequate image quality since I have not made these additional optimizations.
For best results, set the focus on your web camera to as close a focusing point as possible. Also try to ensure that the left edge of the barcode itself is the only color shift after the start of the image (on the left). Scan lines should be as perpendicular to the barcode lines as possible. The surface of the barcode and the surface of the camera should be as parallel as possible.
I have image sharpening completely maxed out here, which means that in some cases, a slight blur on the barcode is better than perfectly clear. A good scanning technique will involve moving your web camera closer to and away from the barcode gradually. While the scanner will pull any valid UPC or EAN barcode, I’ve tightened the event to fire only when book barcodes are read (including a check digit). In the example application, I’m also only testing against the Amazon US store.
(These are all books I’m taking to the library soon - if you see something you’d like, please let me know.)
February 17th, 2007 at 11:49 am
This is really cool. Don’t suppose I could talk you into adding a field for the ISBN to the display and a button that dumps it all to CSV/XML/Plain Text or something?
March 30th, 2007 at 11:31 am
Kevin,
Can I use this code for a project I was considering? I was hunting around for bar code information for this book collection utility/social network concept that I had for an Apollo app and stumbled on this. It will be changed completely, but the web cam reader is great and I would like to implement it.
The project will be open source under the MIT license.
November 13th, 2007 at 8:26 am
This is so useful!
Is there a way to embed the scanner on a page to fill in a field in a web form? (Sorry I’m not a Flash developer. I’d like to use this in a Grease Monkey script.)
November 15th, 2007 at 5:19 pm
Hey Kevin,
This is really cool - do you have plans on developing this any further? I’d be interested in discussing using this as a component in a project I’m developing. Could you drop me a line via email to discuss?
thanks,
Alex
November 20th, 2007 at 11:06 am
Hey Alex,
No, no plans to develop this any further. You’re welcome to the code and re-use of the example wholesale however you see fit. The only thing I’d ask is that you perhaps drop me a line with some screenshots of your project down the road so I can see how you used it. Just to see the project come full circle.
Thanks,
Kevin
November 20th, 2007 at 11:07 am
Jamie,
That would involve a little ExternalInterface code being added to the existing source (so, more Flash work). It’s certainly feasible, but just not without adding to the code.
Regards,
Kevin
November 27th, 2007 at 7:50 pm
Kevin -
How far out of touch am I to imagine a Flex / AIR application on a Windows Mobile device using a camera for barcode recognition? Are such miracles viable on a PDA? Seems like the latest Player + OS combo would be Flash 7 + Mobile 5?
Regards,
–
Jon
February 16th, 2008 at 1:15 am
Interesting stuff, I’ve done some work in the POS market and I notice that a typical low-end PC barcode scanner is somewhere round the $250 mark (NB: Australian dollar, and very approx) while a webcam is down under $100 even for reasonable resolution. The main issue is speed, the dedicated POS scanners are pretty quick and in a POS situation you need something fast.
The “Logitec QuickCam 4000 Pro” was sold as a 1.3Mpix camera. From what I can tell — it’s actually 640×480 in 8-bit greyscale with subsampled croma (only 320×240 chroma). The Redhat pwc (Philips Webcam) driver works nicely. The proprietary special compression drivers merely do software interpolation and pretend to give a higher resolution so you get nothing extra. If you take it to be a basic 640×480 camera then from that perspective it’s pretty good.
What I’m getting at here, is that the NATIVE output is YVU so you don’t actually need any work extracting the greyscale (just ignore the chroma). Also, the native format is in left-to-right raster lines so if you can trust the barcode to be approximately oriented horizontally then working direct off the rasters should be faster than working with rectangles. Coding in “C” should also speed it up a bit. I’m guessing a lot of webcams use a similar or maybe identical system to this one.
None of this is all that exciting until you realise how expensive the portable devices (e.g. PDA) with barcode scan capability are. Now many portable devices (e.g. mobile phones) have a camera around the 1Mpix mark probably suitable for barcode reading with a very similar algorithm. Now you have a portable device, with barcode reader AND the ability to send data back to a database via 3G or GPRS or similar. Probably the marginal cost of this device is zero because most people already have the hardware ready to go… perfect for stock control, deliveries, etc.
May 2nd, 2008 at 3:34 am
Brilliant! It seems so simple when I read it here but it would take years at my current technical and understanding level, to achieve something like this.
June 6th, 2008 at 3:19 pm
Actually, barcodepedia.com provides source code for its scanner.