FaceTracker Sketch

2014.03.10 06:45 PM

daijima.jp | Profile

OpenCVを活用して人の顔を認識するFaceTrackerですが、今ではopenFrameworksやFlash/Adobe AIR、Javascript、pythonなど色んな言語・環境で使えるように移植されてきていますね。
今回はFlashで使用可能なライブラリ、Beyond Reality FACEを使って私個人のプロフィールページのプロフィール画像をインタラクティブにしてみました。Webカメラをお持ちの方はぜひ遊んでみてください。

FaceTracker
http://jsaragih.org/

・openFrameworksでFace Tracking
kylemcdonald / ofxFaceTracker

・Flash / Adobe AIRでFace Tracking
Tastenkunst / Beyond Reality FACE

・JavascriptでFace Tracking
auduno / clmtrackr

・pythonでFace Tracking
amitibo / pyfacetrackeraq

BVH File Sketch

2014.01.06 09:33 PM

daijima.jp Lab | BVH File Sketch

昨年のクリスマスに行ったPerfumeのドームコンサートと大晦日の紅白がすごく良かった。
この期に及んでPerfumeファンになったので、以前作ったドブえもんのPerfumeダンスを晒してみよう。
その名もDobume。
※骨格がありえない曲がり方をしたり、腕が体にめり込んだりするのはご愛敬。
※Dobumeはノッチのパートを踊っています。

少し古いネタですが「Perfume global site project #001」からモーションキャプチャーデータを拝借しました。
http://www.perfume-global.com

openFrameworks × Arduino × 光センサー

2013.03.21 04:30 PM

[oFSketch1] ドブえもんの明と暗 / Dobuemon’s light & darkness

openFrameworksとArduinoと光センサーを使って部屋の明暗を検知して何か表現してみるテスト。
地味かつしょーもないデモ映像ですが良かったらご覧ください。
上機嫌でコマネチを繰り出すドブえもんですが部屋が暗くなると絶望します。

[oFSketch1] ドブえもんの明と暗 / Dobuemon’s light & darkness from daijimachine on Vimeo.

最近になってopenFrameworksを始めてみて、初歩的なことを一通り試していく中でできたスケッチです。
このスケッチで試したのはボーンアニメーション付きモデリングデータを読み込んでパースして表示してくれるofxAssimpModelLoaderというaddonがどんなものなのかということと、Arduinoとセンサーを絡めたらどんなことができるのかということ。

ボーンアニメーション付きモデリングデータの読み込みは特に問題なく読み込めて表示できました。
ライトや陰面消去、テクスチャの質感等の細かい3Dの設定はOpenGLを操作できるメソッドがopenFrameworksには用意されているのでそれらを使って設定しています。

Arduino × センサーの方はとりあえずは配線周りのセッティングが簡単な光センサーを使ってみました。
センサーは様々なモノが膨大にあり、セッティングが複雑なものも多そうなので、おいおい試していこうと思います。
Arduino(てか電子工作)わりと面白いのでちょこちょこいじっていこうと思います。

WebGLでBone Animation

2013.03.13 07:43 PM

daijima.jp Lab | WebGL Bone Animation Sketch

ここのところWebGLを試していたんですが、その時作ったスケッチを晒してみようと思います。

※Safariで閲覧する場合はWebGLを有効にしてください。SafariのWebGLの有効化方法
※WebGLがサポートされていないブラウザでは閲覧できません。(IEやスマホブラウザ等)
※画面ドラッグでカメラ移動
※マウスホイールでカメラズーム
※Qボタンでアニメパターン1再生
※Wボタンでアニメパターン2再生
※Eボタンでアニメパターン3再生
※3Dライブラリはthree.jsを使用しました。
※気持ち悪いスケッチで申し訳ありません。

以下、ざっくりですが技術的なこと。
キャラクターのモデリング、ボーン設定、ボーンアニメーション作成はBlenderを使用。
BlenderでUV画像をエクスポートしてそれを元にPhotoshopでテクスチャ作成。
ボーンアニメーション付きモデリングデータをCollada形式でエクスポート。
※Blenderにthree.js用のアドオンをインストールするとモデリングデータをjson形式でエクスポートすることもできるんですが、いざthree.jsで読み込んだところ、表示が崩れてしまってうまくいかなかったので今回はCollada形式でエクスポートしてthree.jsで読み込みました。

three.jsを使えばいわゆるFlash用の3Dライブラリ(Away3D/Alternativa3Dなど)ライクに、わりと簡単に3D表現はできるようです。ボーンアニメーションもそれなりにすんなり実装できました。

現時点で大半のスマホブラウザでWebGLをサポートしていないというのが、いまひとつWebGLが流行らない原因なのだとは思いますが、近い将来多くのスマホブラウザでWebGLがサポートされるようになれば、大いに活用できるAPIになり得ると思います。

いずれにせよ、FlashのStage3D、WebGL、Unity、openFrameworks、etc..、様々な技術的なアプローチがあるとは思いますが、案件の特性に応じてアプローチ方法を選択して自在に開発できる準備をしておくのが肝要なんだと思います。

LightWave ショートカット・キーや操作メモなど

2012.12.12 05:56 PM

LightWaveで個人的によく使うショートカット・キー。
※今後も加筆、修正していく予定です。

 

この投稿の続きを読む »

Blender プラグイン追加方法

2012.12.10 03:43 PM

プラグインを追加するには所定のフォルダにインストールしてから有効化する必要があります。

1.インストール
-Windowsの場合
以下のフォルダーにコピー。
C:/UsersvUSERNAME/AppData/Roaming/Blender Foundation/Blender/バージョン/scripts/addons

-OSXの場合
blender.appを「control」を押しながら「クリック」して「パッケージの内容を表示」を選択して以下のフォルダーにコピー。
/Applications/Blender/blender.app/Contents/MacOS/バージョン/scripts/addons

 

2.有効化
メニューから User Preferences を開いて Addons タブを開く。
Import-Export カテゴリを選択して有効化したいプラグインにチェックを入れる。

Stage3DコンテンツをAIR3.2で書き出す時に出るエラーの対処法

2012.11.20 07:16 PM

Stage3DコンテンツをAIR3.2で書き出す時にいくつかエラーが出たのでその対処法をメモっておく。

Errorその1

Error #2044: Unhandled ErrorEvent:. text=Error #3702: Context3D not available.

↓解決策
描画モードに direct を指定する

direct
Errorその2

Error #3709: The depthAndStencil flag in the application descriptor must match the enableDepthAndStencil Boolean passed to configureBackBuffer on the Context3D object

↓解決策
深度バッファやステンシルバッファを使用するかどうかをdepthAndStencilタグで設定する。デフォルト値は false。2Dコンテンツでは、本当に必要な場合を除きfalseのままにしておくのがお勧めらしい。


	..
	true

以下のAdobe上条さんの記事が詳しいです。
AIR 3.2 でデバイス向け Stage3D コンテンツを作成するときの注意点

JavaScriptの読み込みと実行に関してのメモ(ページレンダリングの高速化)

2012.11.20 01:31 AM

ページの処理中に<script>タグが存在した場合、そのコードを読み込み実行している間はページのレンダリング処理が停止してしまう。このJavaScriptの読み込み&実行によるパフォーマンスへの影響を最小限に抑える方法。

・スクリプトはbody内の一番下に置く。</body>タグの直前。
・スクリプトをグループ化する。大量のjsファイルは1ファイルにまとめるなど可能な限りファイル数を減らしてhttpアクセスを最小限にする。(ビルド用ツールを利用するなど)
・ノンブロッキング(非同期)なスクリプトの読み込み

ノンブロッキング(非同期)なスクリプトの読み込み例を以下に記す。
1.defer属性を利用(IEとFirefox3.5以上でのみ対応)
2.<script>要素を動的に生成し、コードのダウンロードと実行を行う。
3.XMLHttpRequestによるスクリプトの挿入。(クロスドメインでの利用は不可)

以下それぞれの記述例。

//1.defer属性を利用(IEとFirefox3.5以上でのみ対応)


//2.<script>要素を動的に生成し、コードのダウンロードと実行を行う。

var script = document.createElement("script");
script.type = "text/javascript";

if(script.readyState){
    //IE
    script.onreadystatechange = function(){
        if(script.readyState == "loaded" || script.readyState == "complete"){
            script.onreadystatechange = null;
            //実行
        }
    }
}else{
    //その他ブラウザ
    script.onload = function(){
        //実行
    }
}
script.src = "hoge.js";

document.getElementsByTagName("head")[0].appendChild(script);
//3.XMLHttpRequestによるスクリプトの挿入。(クロスドメインでの利用は不可)

var xhr = new XMLHttpRequest();
xhr.open("get", "hoge.js", true);
xhr.onreadystatechange = function(){
    if(xhr.readyState == 4){
        if(xhr.status >= 200 && xhr.status < 300 || xhr.status == 304){
            var script = document.createElement("script");
            script.type = "text/javascript";
            script.text = xhr.responseText;
            document.body.appendChild(script);
        }
    }
}
xhr.send(null);

また、ノンブロッキングなスクリプトの読み込みにはLazyLoadとLABjsが便利そう。

出典:(Nicholas C. Zakas 著『HIgh Performance JavaScript』Copyright 2010 Yahoo!, Inc.)

放置プレイキメこんでおりました。。。

2012.11.18 12:05 PM

blogを完全に放置。前回の更新からちょうど丸1年。そろそろ再開します~。(多分。。。)

イイ人 | iihito

2011.11.18 08:19 PM

イイ人 | iihito

「イイ人」こと夏井瞬という男がいるのですが、彼のサイトがリニューアルされたようなので紹介します。
何だかようわからんけど反響はすごいみたいなので良かったら見てやってください。
ちなみに私も出ていたりします。

インバースキネマティクス

2011.09.20 02:57 PM

インバースキネマティクスの習作。

ドブえもんによるエクトプラズム曲芸。
こんな風に自分のエクトプラズムを自在に操って曲芸してみたい。
ボールをドラッグできますのでドブえもんのエクトプラズムと思う存分戯れてみてください!

Dobuemon’s Ectoplasm – wonderfl build flash online

Away3D3.6

2011.09.15 04:24 PM

Away3D4.0の開発が絶賛進んでるけど、FlashPlayer10対応のAway3D3.6を一足遅れていじってみた。

日本有数の心霊スポット、その名はドブえもんトンネル。
ずーーーっと見てると気分を悪くする場合がありますのでくれぐれもご注意ください。
当方では責任を負いかねます。

Dobuemon Tunnel – wonderfl build flash online