トマシープが学ぶ

Unity/VR/AR/デザイン好きのミーハー 記事内容は自分用のメモです

虎を屏風から出すAR

今なら出せる。

Animated GIFs - Find & Share on GIPHYwww.giphy.com

検索したところまだ誰もやっていなさそうだったのでやってみます。

モデル

f:id:bibinbaleo:20171026212730p:plain

虎のモデルは以下のものをお借りしました。

3dwarehouse.sketchup.com

屏風はProbuilderで作りました。

bibinbaleo.hatenablog.com

イラストは信頼のいらすとやさん。こんなに素晴らしい虎と竹があるなんて・・・

いらすとやはもともと紙っぽいテクスチャなので屏風と相性がいいですね!

www.irasutoya.com

www.irasutoya.com

虎を動かすには・・・

さて問題は、虎をどう動かすかですね・・・こちらのモデルにはボーンは入っていないようなので、ボーンを入れるとこは絶対しないといけません。

あとはgeneric型の動物アニメーションとかないのかな〜って思ってアセットストア探したらありました。

 あるんだ・・・35ドルだけど。モデルも付属しているようだし・・・

 

まあお金を出してまで作りたいものではないし、練習のために自分でやってみます。

www.project-unknown.jp

hm2studio.blog46.fc2.com

ameblo.jp

ameblo.jp

qiita.com

www.youtube.com

blender、maya、C4D、どれでもできるようです。

ボーンを入れる

cinema4D(失敗)

Charavter>joint toolでボーンを入れれます。

f:id:bibinbaleo:20171024172854p:plain

Ctrlキーを押しながらぽちぽちしていったら入れるのは簡単でした!

f:id:bibinbaleo:20171024172858p:plain

f:id:bibinbaleo:20171024172851p:plain

f:id:bibinbaleo:20171024172901p:plain

次にボーンに肉が付いてきてくれるようにbindというのをしないといけません。

ボーンと肉を選んだ状態で、Character>Command>bindを押したらできるはずなのですが・・・選べない!!!

bindが選べない!!

ちゃんとボーンもメッシュも選択してるのに!試しにシンプルなキューブとかでやってみても選べません><

あああああもうやだあああこれで何分費やしてるんだ^^

ということでblenderに移ります

blender(失敗)

ブレンダーは編集モードで、shift+Aを押して単一ボーンを押すと最初のボーンが入ります。

f:id:bibinbaleo:20171024175922p:plain

そこからはEを押してマウスを動かすとびよーんってボーンが出ます。

f:id:bibinbaleo:20171024175947p:plain

なんやかんやあってあーマチュアとかウェイトをなんやかんやしてたら変になって嫌になったのでやめます。

f:id:bibinbaleo:20171024175909p:plain

ウェーイ!最後はMayaだ!

maya

リギングタブの中のジョイントを作成を押したらできます。

f:id:bibinbaleo:20171024182421p:plain

モデルは横面、ワイヤーフレーム表示にしてぽちぽち押していきます。人繋ぐのボーンを入れ終わったらEnterを押して確定

f:id:bibinbaleo:20171024182417p:plain

肉と骨をくっつけるには全部選択してから、スキンのバインド

f:id:bibinbaleo:20171024182424p:plain

無事動かせました!!!ああーmayaが最高だったのか

f:id:bibinbaleo:20171024200115p:plain

アニメーション

mayaでモーション付けはやったことがあるのです。

bibinbaleo.hatenablog.com

ただ動物の動きって難しい・・・

Animated GIFs - Find & Share on GIPHYwww.giphy.com

ちゃんとすることは一旦諦めてunityに入れます。

Unityで動かす

移動はitweenでしました。

最初は屏風の後ろに控えていて、クリックしたら、

f:id:bibinbaleo:20171026212936p:plain

前に出てくる。前に出てくるときは屏風の絵を変えてます。

f:id:bibinbaleo:20171026212940p:plain

        if (Input.GetMouseButton(0)) {
            if (a == 0) {
                a += 1;
                GetComponent<Renderer>().material.mainTexture  = toranashi; ///虎なしテクスチャ
                iTween.MoveTo (tora, iTween.Hash ("x", tora.transform.position.x+2, "time", 6.0f));
                /////前に出てくる
            } else {
                a -= 1;
                //iTween.RotateTo (tora, iTween.Hash ("x", -180, "islocal", true, "time", 3.0f));
                GetComponent<Renderer>().material.mainTexture  = toraari;    
                iTween.MoveTo (tora, iTween.Hash ("x", tora.transform.position.x-2, "time", 6.0f));
                /////後ろに下がる
            }
    }

Animated GIFs - Find & Share on GIPHYwww.giphy.com

一応動くのですが、安定しない・・・

itweenが悪いのか私の往復スクリプトの書き方が悪いのか。 

何回も続けて前に行ったり、最初から後ろに下がったりする・・・

seesaawiki.jp

あと虎のモーションがなんか小さくなってる気がする?

マーカー

わざわざ屏風を作りましたが、このネタをやるならやっぱり印刷したマーカーから出てくる方がいいですよね・・・

qiita.com

ということで、マーカーと同じ面に、マスクシェーダーをつけた平面を置くと、こんな感じでマーカーから飛び出してきたみたいな表現ができます。

f:id:bibinbaleo:20171026213553p:plain

おおー!

f:id:bibinbaleo:20171026220738p:plain

 

ちなみに下のは、トラなしの方のテクスチャをunity上でマーカーの上に表示している。

紙に見えなくもない・・・?

f:id:bibinbaleo:20171026220733p:plain

 

最後に

技術とやる気がなさすぎて、すっごい荒けずりになってしまいました。

ちゃんとやったら受けそうなのに・・・

モーション作りって難しいですね。