facekit.net developer blog

Facekit.netの新機能として、顔の向きをより細かいパラメータとして推定できるようになりました。 以下のようなJSONフォーマットで情報を取得することができます:

javascriptの例を以下に示します。以前のバージョンとも完全に互換性が保たれています。:

不具合等ありましたら、このブログのコメント欄でおしらせ下さい。

Some people may aware of privacy, because you have to turn on your camera and facekit.net will capture your face and do some processing. Here we try to explain the possible privacy threats occurred by using facekit.net.

How facekit.net works

Facekit.net consists of a web interface used to customize your face recognizer and some flash programs to run your live recognizer.
The live face recognizer runs on your browser completely locally, and it does not send any information to our server (only the exception is, if you press the feedback button, it will send information containing your IP address, url, and some text variables to our server). The recognizer directly sends a recognition result by calling a javascript function defined at the user’s web page, so those information are also handled locally on your browser (but on this part there is a possible threat *see next section*).

Possible privacy threat

On using flash executable (when you browse a web page which embeds facekit.net)

As explained in the previous section, the flash executable runs completely locally on your browser, and the face information of the user will not sent to our server. But by writing a specific javascript code, it is possible for the web developer to collect face information of the user. Note that we do not provide any interface to let web developer to access actual face image, but the recognition result will be sent to the javascript function and it can be logged.

On using web interface (when you customize your own face recognizer)

On customizing your own face recognizer, you have to upload images you have prepared to our server. We do our best to protect your images, but there is still a possible threat on network attacks. We ask you to keep this risk in mind when you upload your picture to our server. When you turn your project to public, please be sure that your project does not contain any private information.

<p>ここでは、Webページに顔認識機能を埋め込む方法について解説します。 facekit.netによって作成された顔認識プログラムはFlashの実行環境で動作するswf形式のファイルとして配布され、Webブラウザ上で動作させることができます。 以下の簡単な手順であなたのWebページに顔認識機能を付加することができます。  １．Javascriptファイルを読み込む HTMLのヘッダ部分に以下のコードを書き込むことでJavascriptファイル&quot;swfobject.js&quot;を読み込みます。</p>
<pre lang=”html4strict”><script src=”http://facekit.net/javascripts/swfobject.js” type=”text/javascript”></script></pre>
<p>２．顔認識プログラムを表示する場所を決める 顔認識プログラムを表示したい場所に、以下のコードを書き込みます。</p>
<pre lang=”html4strict”><div id=”flashcontent”><br />This page requires flash9.<br /><br />Please install or upgrade flash player if you see this message.<br /><br /><a href=”http://www.adobe.com/go/getflashplayer”><img src=”http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif” alt=”" /></a></div></pre>
<p>３．顔認識プログラムを表示するJavascriptコードを書き込む 以下のJavascriptコードを書き込むことで、２．で決めた場所にプログラムが表示されるようになります。</p>
<pre lang=”javascript”>
var so = new SWFObject(&quot;http://facekit.net/flash/facekit_1&quot;, &quot;facekit_1&quot;, &quot;320&quot;, &quot;263&quot;, &quot;9&quot;, &quot;#869ca7&quot;);
so.addVariable(&quot;url&quot;, location.href);
so.write(&quot;flashcontent&quot;);</pre>
<p>（４）．顔認識プログラムの出力する結果を利用する 顔認識プログラムの出力する結果を利用するには、３．で作成したJavascriptコードを以下のように変更します。</p>
<pre lang=”javascript”>
var so = new SWFObject(&quot;http://facekit.net/flash/facekit_1&quot;, &quot;facekit_1&quot;, &quot;320&quot;, &quot;263&quot;, &quot;9&quot;, &quot;#869ca7&quot;);
so.addVariable(&quot;url&quot;, location.href);
so.addVariable(&quot;callback&quot;, &quot;getResult&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);</pre>
<p>このように変更することで、顔認識プログラムは認識を行うごとに関数getResultを呼び出すようになります。getResultの引数には以下のようなフォーマットのJSON形式の認識結果が与えられます。</p>
<pre lang=”javascript”>
{
state: &quot;detected&quot;, // 顔検出結果 &quot;detected&quot;, &quot;none&quot; の2種類
label: &quot;front&quot;, // 認識結果
x:40, y:50, // 検出された顔の座標
width:20, height:20, // 検出された顔の大きさ
time:100.0 // 検出された時刻（flvを入力とした場合のみ）
}</pre>
<p>ここで以下のような関数を定義することで、認識結果に応じて動的に内容を変化するWebページを作成することができます。</p>
<pre lang=”javascript”>
function getResult(value) {
    var data = eval(&quot;(&quot;+value+&quot;)&quot;);
    if (data.label == &quot;left&quot;) {
        do_something…
    } else if (data.label == &quot;right&quot;) {
        do_something_else…
    }
}</pre>
<p>上記機能の具体的な利用例は、<a href=”http://demos.facekit.net/googlemaps/”>このページ</a>などを参考にしてください。</p>

「王様の箱庭」ブログで最初の紹介記事を書いていただきました。masayashiさん、ありがとうございます！ http://d.hatena.ne.jp/masayashi/20070321

facekit.net開発者ブログへようこそ