[Unity] もじもじワールド④ 動画生成システム開発記後編
概要
引き続きこんにちは、VolcaのItoです。
この記事では前回の予告通り、「もじもじワールド」の基幹となる
動画生成システムの開発メイキングとなります。
前回の記事はこちら🔽
ギミック、演出、その他必要そうなツール諸々含め、
本格的にシステムの構築をしていきます。
1. ベースとなる機能の開発
さて、前々回紹介した試作その3をベースに、これを量産できるシステムを作ることになります。
まず作らねばならないものは、
ギミックのシステム
スタート・ゴール演出
画像素材差し替えツール
順を追って見ていきましょう。
ギミックのシステム
ギミックの種類は、まずシンプルに、スロープ, ジャンプ台, 回転足場の3種類を用意しました。
これらをprefab化したものを、適宜シーン内に自由に配置してもらうことになります。
◯ スロープ
足場となるシンプルな板です。
形状に合わせやすいよう、大中小の３種の長さで用意しました。
◯ ジャンプ台
ボールを跳ね飛ばすためのギミックです。
ボールはRigidBodyで物理的に転がっているので、
接触時にAddForceで瞬間的に力を加えて射出するというものです。
弾く際は、ぶつかった方向にそのまま跳ね返すのではなく、
ジャンプ台の角度を参照して、反射方向ベクトルへ飛ばすような処理にしています。
◯ 回転足場
ヒンジで固定した回転する足場です。
バネを設定してあるので、ドアのような動きをします。
ボールの勢いを弱めたり、ボールの行く先を緩く誘導しつつ、
ドアの物理挙動そのものが画面の賑やかしになることが狙いです。
2. スタート・ゴール演出
単なるボールではなく、キャラクター的なものを転がす事になったので、
スタート演出等についても、画面外から転がってくるだけのようなものではなく、
もっとコミカルで動きのあるシークエンスを作ることにしました。
とはいえ、今回のコンセプト上、画像素材作成の労力は極力抑えたいので、
アニメーションのために何枚も画像を用意したくはないです。
というわけで、ボールとなるキャラの画像は、「通常」「喜び」「ボール形態」の三種類だけ用意し、
あとはスプライトの回転や変形で上手く動きを出すように作りました。
同様にゴール演出もしっかり作っておきます。
これらのアニメーションはUnityのTimeline上で構築し、
スタート時は開幕自動で、ゴール時は最終地点のコライダーに接触した瞬間に発火するように設定しました。
上手くボールが動けば、勝手にスタートからゴールまでの一連の流れが、眺めているだけで出来上がる寸法です。
3. 画像素材差し替えツール
別バージョンの画像で作る際、いちいちシーン内のギミックの画像を手動で差し替えながら作業するのは非効率的なので、
シーン内のギミックの画像を一括で差し替えるツールを作成しました。
フォルダ内に命名規則に従った画像素材を配置しておけば、使用する素材入りフォルダを指定するだけで、シーン内のギミックや背景などの画像素材が、そのままそっくり差し替わるというシンプルなツールです。
4. さらなる追加演出
ここまでで概ねシステムは完成していますが、
動きとしても物足りない、コースの形状の意図が伝わりづらいということで、
各所にチェックポイントのようなものを配置し、それらを線でつなぐという演出を追加しました。
配置した各所のチェックポイントをボールが通過すると、ポイントがアクティブになり、次のチェックポイントまでのラインを生成します。
これらの線は Line Renderer で描画してあり、それぞれポイントを通るよう、経路を曲線補完しながら、なぞるように生成しています。
最終的に、ゴール後にカメラが引いた後、改めてチェックポイントの線を引き直すシークエンスを挟むことで、ここまで通ってきたコースの形状は、テーマとなる文字の形であった、と明示的に示すようにしました。
また、俯瞰的に全体を見えるよう、右上にミニマップを追加しました。
全体を範囲に収めて描画するカメラを配置し、RenderTextureを通して描画しています。
すべてを映すとゴチャゴチャになって見辛かったため、チェックポイントのみに絞っています。
5. 第一弾「あ」の完成？
これらギミックや演出を、一連の流れとして動かせるか試してみましょう。
問題なさそうですね。
というわけで、一通り必要な要素が揃ったので、実際に配置して動画を作ってみることになります。
概形となるひらがなに沿うような形で、上記のギミックやチェックポイントを配置し、コースを構築していきます。
あとは再生して、リアルタイムの動きを Unity Recorder で録画することで、動画が生成されます。
というわけで、無事「あ」の動画が完成することとなります
次回予告
さて、基礎と最初の動画が完成したということは、
次なる作業は動画第二弾の制作です。
次回お楽しみに