トマシープが学ぶ

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

ララランドのOPをUnityで再現したい【Part2】

ララランドのOPをUnityで再現していきます!

ラ・ラ・ランド(字幕版)

前回の続きです。

bibinbaleo.hatenablog.com

今回は画面効果付けと、ラストのシーンを作ります。

PostProcessing

画面効果を付けます。

f:id:bibinbaleo:20181114112654p:plain

f:id:bibinbaleo:20181114112650p:plain

難しいですね。。。

f:id:bibinbaleo:20181114112647p:plain

人間

人間はこのUnity公式のローポリモデルが欲しかったのですが、単体で入っているアセットがわからなかったのでチュートリアルからモデルだけ借りました。

(追記:アセットストアから消えました。)

いいね

f:id:bibinbaleo:20181114115255p:plain

またたまたま見つけた男の人も入れました。

f:id:bibinbaleo:20181114115302p:plain

どちらもすぐに動きました!

f:id:bibinbaleo:20181114115248p:plain

真ん中の女の人は前回も使ったUnityちゃんで。

f:id:bibinbaleo:20181114120058p:plain

カメラ

ここから

f:id:bibinbaleo:20181114120101p:plain

ここまで上がります。

f:id:bibinbaleo:20181114120055p:plain

これは前回と同じです。

簡単にTimelineで動かせました。

f:id:bibinbaleo:20181114192348p:plain

ダンスシーン

最後のダンスシーンを作っていきます。

車の上でみんな揃って同じダンスをしています。

f:id:bibinbaleo:20181114181634p:plain

適当に無料のダンスモーションを付けようと思っていたのですが、フリーのダンスモーションはありませんでした。

f:id:bibinbaleo:20181114110639p:plain

(一つ出てたやつもダンスモーションは入っていませんでした

だが私は思い出した。

CandyRockStarがある!!!!!

ユニティちゃんライブステージ! -Candy Rock Star- - ダウンロード - UNITY-CHAN! OFFICIAL WEBSITE

まじでユニティちゃんセットって優秀ですね。

モデルにダンスが入っているものがあったのですが、ダンスの取り出し方がわからない

昔できた気がしたけど、このモデルは無理っぽいですね。

f:id:bibinbaleo:20181114120718p:plain

 ダンスもダンスっていうか酔っ払いみたいだった。

f:id:bibinbaleo:20181114120609p:plain

無事CandyRockStarを入れれました。

Animationsフォルダーだけ入れたらいいと思います。

f:id:bibinbaleo:20181114172319p:plain

3種類ダンスがあるようです。

f:id:bibinbaleo:20181114173324p:plain

001は最初のほうあまり動かないので002を使いました。

Timelineでアニメーションをコントロールする

Animation Trackにモデルを入れて、右のメニューからAdd From Animation Clip

f:id:bibinbaleo:20181114172327p:plain

Animationを選ぶと、POSEとかの場合最初何も入ってないみたいに見えますが、拡大するとありました。

f:id:bibinbaleo:20181114172325p:plain

右端を伸ばすと広がりました。

f:id:bibinbaleo:20181114172332p:plain

モデルのAnimatorのControllerに何か入れておくと、モデルは最初の位置でアニメーションしてくれます。

f:id:bibinbaleo:20181114173858p:plain

【Unity】知らないと苦労するかもしれない、Timelineと座標の話 - テラシュールブログ

これでモーションをどこから始めるかもTimelineで調整できました。

それっぽいところから始めることができそうです。

f:id:bibinbaleo:20181114172335p:plain

ただこれを全員に適用するのはめんどくさいですね。

AnimationController単位で変更できたらいいのに

手を挙げるシーン

ダンスの前に黄色い女の人が両手を上げるモーションを作ります。

f:id:bibinbaleo:20181114182143p:plain

POSE24が両手を挙げているポーズで、wait00が下げているポーズなのでこれを遷移させます。

f:id:bibinbaleo:20181114174713p:plain

滑らかにつなぐにはモーションのDurationの数値を変えればいいそうです。

f:id:bibinbaleo:20181114182225p:plain

ただモーションの長さの半分しか斜め?にできなかったです。

f:id:bibinbaleo:20181114192352p:plain

ちょっと困りました。

もうあきらめ

完成

結局手を挙げるタイミングとか角度は全然あってないけど、とりあえずできました。

youtu.be

みんなで踊っているところはそっくりですね。 

2019/2/12追記

私の記事を見て同じように再現してくれたそうです!すごい!!

siroitori.hatenablog.com