見出し画像

エリオスライジングヒーローズのバーストアニメ制作について

この記事は「Happy Elements カカリアスタジオ デザイナーアドベントカレンダー2020」の25日目の記事です

はじめに

メリークリスマス!

エリオスライジングヒーローズ(以下「エリオスR」と表記)でアニメーションデザイナーをしている、しよこと申します。

12月も終盤に入りカカリアスタジオのある京都では寒さも一段と厳しくなって参りました。
皆さまいかがお過ごしでしょうか?

エリオスRのクリエイティブ制作の記事に続き、本日はエリオスRのバーストアニメ制作の記事になります!
前回の記事をまだ見てないという方は、是非下記リンク先へ!

エリオスRでのアニメーションデザイナーは、『ヒーロー』や敵のモーション、画面演出などを動かす仕事をしています。

画像23

画像24

画像25

今回はアニメーションの仕事の一部、『ヒーロー』たちがバトルで見せるバーストアニメの制作について紹介します。


バーストアニメとは

画像22

エリオスRでは、『ヒーロー』が特殊な技を出す演出があります。
バースト演出では、腕や足を個別で動かすパーツアニメーション部分と、セルアニメーションという連続した絵で表現するバーストアニメ部分があります。

画像2

▲パーツアニメーション

画像1

▲セルアニメーション

『ヒーロー』たちのかっこいい姿がみれるバーストアニメでは、それぞれの『ヒーロー』らしさをユーザーの皆さまに感じてもらえるよう、演出を考えています。
現在、原画、動画、着色仕上げ部分でアニメ制作会社さんに協力いただいているバーストアニメもありますが、半分は社内でゼロから制作しています。
今回紹介するアニメ制作は社内で行っているものになります。

---

アニメ制作の流れ

画像3

今月新しく『ヒーロー』として追加された人狼化の能力を持つディノ・アルバーニのバーストアニメ制作を例に見ていきましょう!

■ 絵コンテ

画像4

そのキャラクターらしさを意識した絵コンテを制作します!

こちらは社内のアニメーションデザイナーが制作します。
今回の場合、ディノの初めてのバーストアニメなので、キャラの能力を見せようと下記2点で人狼らしさを出そうとしています。

●冒頭で狼のシルエットオーラを纏う
●獣らしく四つん這いポーズをとる

イベントの場合、イベントのあらすじや衣装のデザインがある状態なので、その時の衣装や状況だからできるキャラクターたちの演出になるように、案をまとめていきます。
イラストレーターさん、コンテンツプランナーさん、アニメーションデザイナーたちで絵コンテ会議を行い、案をまとめたらVコン制作をします。
案を考えた人が仕上げまで制作することもありますが、最近は複数人のアニメーションデザイナーで1本のアニメに携わることが多いです。

■ Vコン

ディノ_Vコン

聞きなれない方もいると思いますが、Vコンとはビデオコンテの略で、動く絵コンテになります。
ここで大まかな尺を決めます。
Vコンを作ることで、セリフの収録にこちらの動画を使用したり、他セクションとの共通イメージを持つことができます。


■ レイアウトパスモーション

画像10

カラフルな体で動いてますね!
チーム内で通称パスモーションという、少し特殊な工程を挟んでいます。
赤い枠は機種によって見える部分を変更するための予備部分になります。
真ん中の四角内に大事な絵が入るように調整しています。
この工程で細かな動き、絵の枚数を決定しています。
Vコンにはなかった頭を振る動き、尻尾を振る動きでより人狼感を感じれるアニメーションを増やしています。

案の次は絵を描かないの?と思う方もいると思います。
少し話はそれますが、こちらの工程を挟むことに至った理由を説明します。

アニメ制作では動きのキーとなる原画、間の動きを埋める動画
で一連の動きをつくります。

画像11

ジャクリーンに協力していただきました!

A① 手を下げているジャクリーン
A② 手を上げているジャクリーン

こちらが動きのキーとなる原画と呼ばれるものです。
間の動画はこの段階では描かれてなく、ラインが並んでいるツメ指示と呼ばれる図やタイムシートなどで指定されます。
ですがこれだけですと、動きのイメージを複数人で共有するにはなかなか難しいです……!

イメージ制作のため、まずAfterEffectsという映像ツールで動きのイメージが共有できるものを制作します。

画像12

不思議なピンクの生き物になっていますが、こちらの工程は見た目を気にしなくて大丈夫です!
キーとなるラフの形をツール上で指定することで、間の動きは自動的に補完されます。この状態では同じ早さでゆっくりな動きです。

画像13

時間を調整するエフェクトを使い、間の絵のイメージを制作します。
見た目はラフですが動きのイメージが分かりやすくなります!
調整具合によって、色々なパターンの動画イメージも制作できるため、
この段階で動きのスピード感や絵の枚数などを決めます。
後工程での描き直しを減らすためこの工程をエリオスRでは挟んでいます!

では話を戻して続きの工程を見ていきましょう!↓↓


■ 原画ラフ

画像14

パスモーションの絵をもとに、CLIP STUDIO PAINTというツールを使用し、原画の中でもメインとなる絵をイラストレーターさんに描いていただきます!表情の作画や動きポーズのニュアンスはこの段階で確定します。


■ 原画

画像15

イラストレーターさんに服、影を作画してもらいます。
服を着ると一気に仕上がった見た目になります!

画像16

髪揺れや反動の動きなどをアニメーションデザイナーで作画します。

これでキーとなる原画が完成です!


■ 動画と着色仕上げ

画像17

原画と原画の間に動画を描き、着色をアニメーションデザイナーで行います。レイアウトパスモーション時に描く枚数を決め、間の絵を描きやすい動画の指定にしているので、大きい変更や描き直しが発生せずに済みます!

これでアニメのセル素材が完成です!


■ 撮影

画像20

AfterEffectsという映像ツールを使用してアニメーションにエフェクトや加工をします。
細かな部位の色も、こちらのソフトの機能を使って色を変更しています。
合わせてサウンドクリエイターさんに効果音やボイスをつけていただきます!
瞳が光るかっこいいディノが完成です!!!


■ その他

パスモーション作画

一部はCLIP STUDIO PAINTの作画ではなく、AfterEffectsで行っているレイアウトパスモーションでアニメを完成させている箇所もあります。

画像18

【真夏のサバイバルアイランド】のオスカーの冒頭シーン。

画像19

ゆっくりとした箇所の作画では手書きだと枚数が多くなるので、こちらはパスの補完方法で制作しています。
例えばこのカットが10秒以上になっても、じわっと動きを続けることができるので、とても便利です!
このように作画をキレイに、より安定してアニメーションを作れるように日々研究を続けています……!


その他のアニメたち

社内で制作したイベントのバーストアニメを一部並べてみました
Vコンから撮影まで、並べて比較するのもおもしろいですね!

画像6

画像7

画像8

画像9


おわりに

バーストアニメ制作の流れをざっくりとですが、紹介させていただきました。工程はとても多いですが、チーム内で得意分野を協力し合い、細かな仕草、表情、かっこいい動きにこだわって制作しています!
『ヒーロー』たちの新しい一面をユーザーの皆さまにお届けできるよう注力していきますので、今後のバーストアニメも楽しみに見ていただけると嬉しいです!

ここまで読んでくださり、ありがとうございました!
楽しいクリスマスをお過ごしください~!!

画像5

--

Happy Elements カカリアスタジオでは
いっしょに「熱狂的に愛されるコンテンツ」をつくっていただけるメンバーを大募集中です!

もし弊社にご興味持っていただけましたら、是非一度
下記採用サイトをご覧ください!


この記事が参加している募集