Hacker Newsnew | past | comments | ask | show | jobs | submitlogin
Face detection jQuery Plugin (jaysalvat.com)
113 points by gourneau on Nov 23, 2011 | hide | past | favorite | 40 comments


Looks like more evidence for Atwood's Law: Any application that can be written in JavaScript, will eventually be written in JavaScript.

I have a couple of questions:

1. How does Liu Liu's algorithm (which I think he calls "deformable parts model") compare with Viola-Jones [1]? Any idea what the error stats (false positives & negatives) are like? In my experience [2] Viola-Jones has very low error rates. Regarding performance, I think it'll be a while before anything can come close to Viola-Jones, but this algo seems good enough.

2. Ok, this might be a stupid question, but I'll ask anyway.

Does this plugin mean that face detection can now be completely done on the client side? I use face detection in my web app [2] for passport photo formatting. I'm wondering if instead of uploading the photo (~2-4MB) to the server and processing it there with OpenCV, I can download the plugin to the browser(~0.5MB?) and get everything done right there.

[1] http://opencv.willowgarage.com/documentation/python/cascade_...

[2] http://freepassportphoto.dyndns.org/

The error rates info is from the webserver's error-log. Its very rare that I see a "No face found" error (false negatives) or get complaints that the formatted photo is all messed up (false positives).


The deformable part based model is pretty much /the/ state-of-the-art object detection model. There is absolutely no way it should be attributed to "Liu Liu". It's creators are Felzenszwalb et al.[1].

The performance of DPMs far surpasses any other basic model such as a Viola Jones syle Haar cascade. Also you should find with DPMs that you are able to detect faces with far higher degrees of deformation - i.e. 3/4 profile faces, rotated faces etc. DPMs are far far more robust than haar cascades but with greater computational expense. Check out the papers at [1].

[1] http://www.cs.brown.edu/~pff/latent/


I was using "Liu Liu's algorithm" in a colloquial way. Should have been more specific and used, "the algorithm which Liu Liu implemented".

As far as robustness is concerned I guess a lot depends on the quality of the training. The haar-caascade used in openCV is very well trained and generates few false +/-'ves. I wanted to know how this particular implementation of DPM performed.


Liu Liu's code is a javascript port from openCV I think. As far as I know it is an implementation of Voila-Jones.


Try this in the page:

$('#detect').click(); setTimeout(function() { $('.face').prepend('<img class="santaHat" src="http://officialpsds.com/images/thumbs/Santa-Hat-psd20202.png width="90px" />'); $('.santaHat').css('position', 'relative'); $('.santaHat').css('top', '-60px');$('.face').css('border-width','0px'); }, 200);


[deleted]


replace:

  src="http://officialpsds.com/images/thumbs/Santa-Hat-psd20202.png width="90px"
with

  src="http://officialpsds.com/images/thumbs/Santa-Hat-psd20202.png" width="90px"
and it's perfect


Thanks for the correction!

Corrected version:

$('#detect').click(); setTimeout(function() { $('.face').prepend('<img class="santaHat" src="http://officialpsds.com/images/thumbs/Santa-Hat-psd20202.png width="90px" />'); $('.santaHat').css('position', 'relative'); $('.santaHat').css('top', '-60px');$('.face').css('border-width','0px'); }, 200);


Still missing a quote here... There is a missing quote before width= I tried posting the full code, but HN seems to remove it.


how much of your donations are going to Liu Liu, the original author of the hard part of this piece?


I suspect the developer has only received enough money for 2 beers. Aside from that almost all of us here build you livelihood on-top of open source tools. How much money did your startup give back to the Apache foundation, to the Django or Rails projects?


Totally agree, if I'm not wrong Jay just packed the Liu Liu code into a jQuery plugin, right?


Seems that way to me, really trivial to be asking for donations and not giving the majority of them to Liu Liu. So sad to see a fellow developer taking someone else's hard work and trying to piggy back off it to make money.


That's quite an accusation. We don't even know if he is or isn't handing over money to Liu Liu.


it is, but the text on the site indicates that. if it was giving money to anyone else I would expect it to say so. call me cynical :)


Let's give him the benefit of the doubt and hold onto our opinions until we know more information.


This looks like a fork of Liu Liu's javascript library.

http://www.readwriteweb.com/hack/2010/11/face-detection-html...


The author credits Liu Liu for the algorithm


It's not just the algorithm, the whole detection code is just cutpasted from liu liu's repository.

https://github.com/liuliu/ccv/blob/stable/js/ccv.js


The sheen is coming off this quite rapidly.


The sheen is the product in this case. Jay took this wonderful obscure code and wrapped it up nice and pretty to share with others. The examples and docs he provides were enough to allow me to use this plugin. That is the value the provides.


So what did this new library do other than wrap this algorithm with a redundant jQuery plugin?


It adds boxes to the DOM. Seriously, that's about it.


I'd like to know how much of the donations he "credits" to Liu Liu. Hate shameless requests for donations on top of very little work without fairly sharing the money!


Well, he credited the author, built a plugin around it, developed and designed a website so more people could use it.

Plus, he only recommends a $3.00 donation, and what indication do you have that he isn't sharing the money?


That is hugely impressive. I just tried it with crowd shots and it worked well. The only issue seemed to be with faces that weren't horizontally aligned.

Would love to read more about the process of moving the algorithm over to jQuery.


jQuery is used for: 1. Finding the picture in the DOM. 2. Drawing the rectangles on the faces.

The algorithm in itself is written in a lovely language called JavaScript.

While I appreciate the attention the author brings to liu liu's code, the jquery plugin packaging doesn't add much value.


Cheers Karl, I assumed it was doing more. Having said that this does make the algorithm slightly more accessible.


I wonder how well this would work for automatically cropping user profile pictures. Anyone else try something like this?


[deleted]


Well maybe something like 1) upload pic, 2) show full-size pic with crop preview in browser, 3) user confirms dimensions and saves to server.


In my excitement I had a brain fart. That's a great idea.


So how can I let a user upload/add an image to a page without sending it to the server?


You can process an image client side using HTML5 FileReader [1]

[1] https://developer.mozilla.org/en/DOM/FileReader


What license are you rocking?


Hm I wonder if you can use this to build a simple tagging system?


I don't see why not, it creates an element around each face which you could attribute a unique ID to.


Would this also let me match a face?


if by match you mean whether that face is someone specific, then no. this is purely to find faces in an image, not identify who they are.

i.e. it's face detection not face recognition


Is there a javascript library to do face recognition?


I'm not aware of one, no. But the basis of this one was a port from openCV. You could do the same for openCV's face recognition algorithm, but I think it would be quite a bit of work.


Nothing jQuery impresses me anymore. You know what would be impressive? If someone figured out what js and jQuery can't do!




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: