「SATCH ARでアニメーション表示をやってみる(その1)」でやっていた2Dデータの準備を動画のデータでやってみましょう。

クロマキー処理した素材を使って、合成動画を作るような感じです。

用意するものは、背景が黒(白)で撮影された動画。
(本来は、青や緑をバックにした動画がいいのですが...)

そして、リサイズ用のimageMagick、背景を消去するためのGIMPです。

これらは、いずれもフリーの画像編集ソフトです。

世間では切り抜き用に、Picture Cutout Guide というアプリも使われているようです...使ったことがないので分かりませんけど。


作り方

動画の連続フレームを抽出

まずは動画を用意します。

例えばこんな感じ。 これはサンプル用の動画です。



フレームの抽出には、GOM Playerを使ってみます。これもフリーの動画再生用アプリです。

動画を読み込んで、初期位置で停止して、GOM Playerのスクリーン上で右クリックしてメニュを出します。

「映像メニュ」 -> 「静止画キャプチャー設定」を選びます。

設定画面では、まず「保存先変更」で画像の保存先を選びます。

「連続キャプチャーフレーム」では、保存数の上限を設定します。

「連続キャプチャー間隔」では、適当ですが大体0.3秒間隔にすればいいかと....。



キャプチャーの開始は動画再生後に行います。






フレーム画像をリサイズする

2の累乗サイズに変更するため、imageMagickを使います。

画像はbmp形式で保存されているので、png形式に変換しておきます。

DOS窓を開いて、保存フォルダーに移動。以下のコマンドを実行。

mogrify -format png *.bmp

例えば256x256のサイズに変更します。

mogrify -geometry 256x256 *.png

サイズがもともと256以下の場合は変更されないので、仕方ないですが1個づつ開いて256にリサイズ(黒バックの場合は白の部分は埋めてください)。




フレーム画像の黒バックを消去する

このままの画像では背景は黒ですが、いわゆる幅を持った黒(R=0,G=0,B=0ではない)状態です。

黒っぽい部分を消去するのに、GIMPを使います。

GIMPを起動後、画像を下の領域にドラッグ・ドロップして読み込みます。





黒っぽい部分を消去するため、ツールボックスの「ファジー選択」か「色域を選択」を使います。

カーソルを黒の部分に持っていき、左クリック。



黒っぽい領域が選択状態になります。



この状態で今度は右クリックしてメニュを出します。

「編集」-> 「消去」を選びます。



黒っぽい領域が消去されます。



メニュ -> ファイル -> エクスポートを選んで、白背景の画像として保存ます。




背景が透過した画像を作成

DOS窓を開いて、白背景の画像の保存フォルダーに移動。以下のコマンドを実行。

mogrify -transparent white *.png



以上です。

でもニコ動のBB素材を使うっていう手もありますが、あの著作権や使用権ってどうなってたんでしたっけ?



以後、SATCH Studio Liteでの作業については、
SATCH ARでアニメーション表示をやってみる(その1) を参照。



SATCH Studioで動かしてみました。

256x256くらいなら、さすがに絵のつぶれは目立ちません。



追加
今回は黒バックで画像処理したのでエッジのアンチエイリアスは黒ベースです。

なので、エッジの黒が気になる場合は、トラッキング画像を黒っぽくすれば、バレにくくなります。

こんな感じ。



追加2
あるいは、画像の加工に手間を惜しみません!...という方に。

GIMPでの作業に以下を追加します。

「消去」でやったようにメニュを出して、今度は「選択範囲の境界線を描画」を選びます。



で、線スタイルを設定して描画でアンチエイリアスなしで、幅を2.0くらいにして描画します。





これをエクポートして、ペイントとかで開きます。

エッジや周囲の黒線は”塗りつぶし”で白にます。



背景透過以降の作業は同じです。

こんな感じになります。




その他、2Dデータの作り方

SATCH ARでアニメーション表示をやってみる(その1)

MMDを使ってSATCHのアニメーション表示用2Dデータを作成

SATCHでアニメーション表示用シナリオの雛形を作ってみました

TOP


サンプル

アプリにしました。
Android 2.3.3 or later

こういうおじさんが叫びます(^^)。



トラッキング画像はこれ(クリックすると原寸画像が表示されます)。




インストール



アプリをQRコードからインストールする方法はコチラを参照



TOP



サンプル2

SATCH VIEWERで動作するようにしました。

このバージョンでは、アンチエイリアスなしで表示してみました。少しはすっきり見えます。

トラッキング画像も変えてみました。



パーティクルシステムを使えば、もう少し臨場感も沸くと思うんですが...。

SATCH VIEWERのQRリーダーを起動したら以下のコードを読みます。




VIEWER画面になったら以下のトラッキング画像にカメラを向けます。
トラッキング用の画像






TOP