MightyCraft

123D catchで写真から3Dモデルを作成しUnityで表示

札幌オフィスのOです。

AutoDesk 123D Catch を使用して3Dモデルを作成をしてUnityでモーションの表示までをやってみました。

123D Catch とは、写真から3Dのモデルのデータを作成できるアプリ・サービスです。
無料(2016年4月現在)で使用することができます。

 

Step1.人物の撮影から3Dモデルデータの作成まで

まずは3Dモデルとなる対象物の写真を360度撮影をします。

今回は同じ札幌オフィスのOG君にモデルになってもらい、U部長にも撮影を手伝ってもらいました。
撮影場所はオフィスのエントランスです。

sapporo1

アリモノで済ましたため、台車に乗り移動しながら360度撮影します。

スタジオではなくこんな場所でと思われるかもしれませんが、写真を合成する際に背景が単純でないほうがつなぎ目を合わせやすいそうなので、とりあえず良しとします。

モデルはリギングで後から関節をいれるので、撮影中手をあげていてもらいます。

撮影が終わったら、無料ダウンロードしてインストールした、123D Catch を起動します。

使用するにはAutodeskのID登録も必要ですので、登録しログインします。

あとは簡単、撮影した画像をアップしていき、モデルが作成されるのを待つだけです。

123d

と、言いましたが、実際には出来上がってくる3Dモデルのどこかが欠損するなどで、何度も撮り直しやアップを繰り返しました。

ss1 ss2

納得したわけではないのですが、ここで足踏みしていてもどうしようもないので、ある程度使えそうなものができた段階で次の編集作業に移りました。

ss3

次は3Dモデルの編集です。

 

Step2.モデルデータの編集

作成したモデルデータは背景も含まれたデータです。
これを編集し人物だけのモデルにし、動かせるように関節データを埋め込んだりしなくてはなりません。
モデルデータを動かせるようなデータを作成することをリギングと言いますが、今回はUnity側にある程度動作をまかせるので最低限のデータだけを作成します。

モデルデータの編集にはオープンソースのBlenderを使用しました。

https://blender.jp/

まずはモデルデータから、背景部分など無駄な部分を削ることが必要です。

以下が人物モデルを選択した状態です。

blender1

編集モードでどこかの頂点を選択した状態で、Controlを押しながら+キーを押すと、選択範囲がじわじわ広がっていきます。

blender2

選択範囲を反転させて、背景が選択されるようにし、選択範囲を削除します。

blender3

背景が削除され、OG君だけのモデルになりました。

次に、ボーン(骨)の作成とメッシュへの関連付けを行います。

blender4

できました!

実際にはBlenderの操作方法もよくわからず、同僚デザイナーのYさんにアドバイス頂いたり、参考書籍を貸して頂きなんとかできました(汗;)

 

Step3.Unityで動かしてみる!

モデルデータができたので、早速Unityに組み込んで動かしてみます。

BlenderからはFBX形式でエクスポートしたものを、Unityでインポートします。

モーションは今回は Unityちゃんのモーション を使用します。

unity1

動きました!

股下になにかついていたりと何かとお粗末な3Dモデルですが、Unityちゃんモーションで動きました!

プログラマーだけでもこの程度の物であれば、モデルデータを自分で用意することが出来るというのは新たな発見でした。

なにより楽しかったです!

もちろん実用にするためには色々と課題はありますが、粘土で作ったモンスターをモデルにするなど、素材としての可能性が広がりますね。

 

アプリで動作もさせましたが、UnityでWEBGLとしてビルドしたものをアップしておきましたのでPCのブラウザで確認できます。

ポーズ:
https://dns7.m-craft.com/sapporo/n-ohta/123D/test/posing/index.html

アクション:
https://dns7.m-craft.com/sapporo/n-ohta/123D/test/action/index.html

 

Autodesk 123D Catchは、Windowsデスクトップ版とスマートフォンアプリ版(iOS,Android)があります。

スマホ版の方は撮影地点のナビが表示されていて撮影位置がわかりやすそうなので、今度は滑車付きの三脚にスマホを固定して撮影したほうが精度が高いモデルデータが作成できるかもしれないので試してみたいです。最近のスマホは少し前のデジカメより解像度も高いですしね。

123dsma

123D Catch Android版の画面です。赤線で四角に囲ったのが撮影ガイドです。

 

今回は下記のサイトを参考にさせてもらいました。
http://yandod.github.io/blog/2015/03/15/123d-on-windows/