キーフレームと2Dカメラでシーンをアニメーション化する方法!

29,991

CrimsyCreates

CrimsyCreates
自動翻訳 | 原文を見る

はじめに

皆さん、お気に入りの深夜の住人クリムジー教授による、別の不気味なチュートリアルへようこそ!

 

今日のチュートリアルでは、Clip Studio Paintでキーフレームアニメーションと2Dカメラを使って、Twitch用の不気味な白黒アニメーションスクリーンを作成します。それでは早速、儀式を始めましょう!

キャンバスを作成する

まず最初に、プロジェクトのキャンバスを作成する必要があります。

 

「ファイル」→「新規...」と進み、プロジェクトウィンドウが開いたら、キャンバスサイズがストリーミングで使用する画像比率と同じであることを確認してください。ほとんどの人は1080pでストリームしていますが、私はより良い画質を得るために4Kキャンバス(3840 x 2160p)を使用します。

 

DPIも300であることを確認してから「OK」を押すのを忘れないでください。

シーンの計画と描画!

空白のキャンバスが作成されたら、今度は不気味で魅力的なアートで埋め尽くす時です!

 

まず、このチュートリアルではフレームごとのアニメーションではなく、キーフレームアニメーションのみを使用してこのシーンをアニメーション化することを覚えておいてください。そのため、アートに好きなだけ詳細を追加できます。

 

キーフレームアニメーション、別名トゥイーンアニメーションとは、タイムライン上のキーフレーム間の補間を使用して、静止画像から動きを作成することです。キーフレームアニメーションは、糸で操る人形を動かすのと似ていると言えるでしょう。人形のすべての異なる部分は、互いに独立して動き、視覚的には同じままの静止オブジェクトです。

アイデアを探すときは、移動、回転、拡大縮小などの単純な動きを使って何が見栄えが良いかを考えてみてください。シーン内で十分に多くのオブジェクトを動かしてダイナミックに見せるようにしてください。ただし、やりすぎるとキャンバスが混沌とした状態になる可能性があります。

 

お分かりのとおり、このプロジェクトでは、不気味な装飾と、その真ん中に浮遊する私のペルソナの幽霊のような頭、そして巨大な黒い髪の毛が上下に揺れる、ムーディーな照明を特徴とする暗い白黒シーンを作成したかったのです。

ヒント01:迷ったら、動きが良く見えることを確認してください。これは、Ctrl + Tを使用し、ピースのピボットポイント(+)をその原点に移動させ、それを中心に回転させて、どのように見えるかをシミュレートできます。

ヒント02:動くパーツはできるだけ完全に塗りつぶしてください。なぜなら、パーツを動かすとアートに穴が空いてしまうことがあるからです。これを避けるには、パーツをこのように単独のアセットとしてイメージすると簡単です。基本的に、一部が他のものに隠れていても、ピース全体をレンダリングするようにしてください。

ヒント03:少し目立たせたいオブジェクトの周囲に境界線を追加します。個々のレイヤーに境界線を追加することもできますが、必要であればフォルダ全体に境界線を追加することもできます。このシナリオでは、浮遊する頭のフォルダに白い境界線を追加して際立たせ、テーブルとバラの周りに黒い境界線を追加して少し太くしました。

ああ、アイデアを探す際に考慮すべき最後の点は、タイムラインが24フレームに制限されていることです。これは、あなたがClip Studio Paint Proユーザーの場合です。EXバージョンを購入した場合は、フレームの制限はありません。

レイヤーをファイルオブジェクトに変換する

すべてのレイヤーをレンダリングし、シーンがかなりクールに見え始めたら、プロジェクトを保存し、「ファイル」→「別名で保存...」を使用して異なる名前を付けてバックアップコピーを作成してください。このステップは任意ですが、私は一般的に未変更のプロジェクトバージョンを保持するのが好きなので、自由に実行またはスキップしてください。

 

これが完了したら、残りの作業は、異なるパーツのすべてのレイヤーとフォルダをファイルオブジェクトに変換して、シーンのアニメーションを開始することです。

これを行うには、フォルダまたはレイヤーを右クリックし、「ファイルオブジェクト」に移動し、「レイヤーをファイルオブジェクトに変換」をクリックするだけです。

レイヤーやフォルダをファイルオブジェクトに変換することには多くの利点があります

 

1. プロジェクトの clutter(乱雑さ)を解消し、単一のピボットポイントを使用して単一のオブジェクトをアニメーション化できます。

 

2. ファイルオブジェクトは以前のすべてのレイヤー内容を保持しながら、元のファイルを好きなだけ変更できます。しかし、これの最も良い点は、そうしても既に存在するアニメーションキーフレームが変更されないため、アニメーションを開始した後でもアートに変更を加えることができるということです。

3. 最も重要なことですが、通常のレイヤーでキーフレームを有効にすると、そのレイヤーがロックされ、回転や拡大縮小などの一般的な変形アクションを実行できなくなります。しかし、最初にファイルオブジェクトに変換すると、オブジェクトメニューに移動して利用可能なすべての変形機能を使用できます。

もちろん、アニメーション化したいすべてのパーツを別々のファイルオブジェクトとして保持するようにしてください。例えば、私はそれぞれの髪の房を別々のファイルオブジェクトにしました。そうしないと、すべてを個別にアニメーション化できませんでした。

シーンのアニメーションを開始する!

さあ、いよいよ楽しいパート、シーンに命を吹き込む時です!

 

まず最初に、アニメーションメニュー --> タイムライン --> 新規タイムライン と進み、アニメーション用の新しいタイムラインを作成する必要があります。

タイムラインウィンドウが開いたら、再生が24フレームに設定されていることを確認してください。ただし、Clip Studio PaintのEXバージョンをお持ちの場合は、自由にアニメーションを長くすることができます。

次に、フレームレートを8に変更すると、3秒間のアニメーションで遊ぶことができます。

次に、上部メニュー --> ウィンドウ --> と進み、「タイムライン」をクリックします。

ご覧のとおり、ここにタイムライン全体が表示されています。これらの拡大鏡アイコンを使用して自由に拡大縮小し、アニメーションがタイムラインの終わりに達したときに繰り返されるようにループアイコンをアクティブにしてください。

さあ、アニメーションを始めましょう!

 

キーフレームを作成する際に最初に考慮すべきことは、それらのフレーム間に有効になっている補間の種類です。選択できる補間の種類は、ホールド、リニア、スムーズの3つです。フレームを右クリックして希望の方法に切り替えることで、キーフレームの補間方法をすばやく変更できます。

 

ヒント:必要に応じてフレームのコピー、カット、削除もここで行えます。

 

各補間タイプがどのように動作するかを説明する簡単な図をここに示しますが、一般的には、最も有機的な動きを作成するスムーズ補間を使用することをお勧めします。

まず、頭の上下の動きを作成することにしました。そこで、キャラクターフォルダからすべてのレイヤーを選択し、「このレイヤーのキーフレームを有効にする」をクリックしました。

次に、最初のフレームに移動し、頭を動かし、キーボードのショートカットKを押してレイヤーをグループとして移動し、「キーフレームを追加」をクリックします。

 

そして、アニメーションを完全にループさせるには、キーボードのAltを押しながらフレームを最後のキーフレームまでドラッグして複製するか、単にタイムラインの最後に移動してキーフレームを追加します。

その後は、アニメーションに中間フレームを追加し、ピボットポイントを正しい位置から回転するように移動させただけです。

ヒント:コピー/貼り付けされたフレームは同じピボットポイントを保持しますが、新しく作成されたフレームはオブジェクトの中心にピボットを持ちます。

 

これで終わりです。あとは、すべての髪に対してこのプロセスを繰り返し、次のアセットに進むだけです。

 

ヒント01:オブジェクト変形ツールで各ファイルオブジェクトを個別に移動できることは覚えておくと良いですが、このツールで複数のオブジェクトを一度に移動することはできません。ただし、複数のファイルオブジェクト(それ自体がアニメーション化されているもの)を含むフォルダでキーフレームを有効にし、それらを1つのエンティティとして移動、回転、または拡大縮小することはできます。この方法を使用して、パペットアニメーション用の複雑なフォルダ階層を作成することも可能ですが、話がそれました。

 

ヒント02:このプロセス中はできるだけ頻繁にアニメーションをレビューし、アニメーションプレビューが少し遅くなる場合は、一部のフォルダを非表示にしても構いません。

不透明度とグローのアニメーション化

シーン全体でほぼ同じ手順を踏みましたが、文字とキャンドルのグロー効果、そして一番上のキャンドルから出る煙を作成するために、特定のレイヤーの不透明度もアニメーション化したことを特筆しておきます。

 

不透明度をアニメーション化するには、ファイルオブジェクトの小さなプラスアイコンを押し、キーフレームを有効にしてアニメーションを作成するだけです。

シーンに2Dカメラを追加する

すべてがほぼ完成しているように見えますが、動きにさらなる深みを生み出すためにシーンに追加すべき最後の一つが残っています。それは、ズームインとズームアウトの微妙なカメラの動きです。

 

シーンにカメラの動きを作成するには、上部メニュー --> アニメーション --> 新規アニメーションレイヤー --> 2Dカメラフォルダ へと進むだけです。

次に、シーン内のすべてのフォルダとレイヤーを選択し、カメラフォルダにドラッグ&ドロップするだけです。

カメラのアニメーションも非常に簡単です。フレーム12にキーフレームを作成し、その後フレーム01に戻ってカメラを少し縮小しました。動きが吐き気を催すほどではなく、しかし環境全体が少し動いているように見える程度の縮小です。次に、最初のフレームを最後のフレームにコピー/ペーストすれば、準備完了です。

 

最後に、キャンバスにカメラの視点を表示するには、カメラフォルダを選択し、ツールのプロパティで「カメラの視野を表示」アイコンを選択します。

最終アニメーションのレンダリング!

最後に、アニメーションをレンダリングし、これまでの努力の成果を目の当たりにする時が来ました。

 

アニメーションをレンダリングするには、「ファイル」→「アニメーションを書き出す」→「希望の出力形式を選択」と進みます。

私は個人的にムービーオプションを選択し、ファイル拡張子をMP4にし、名前を付けてから「保存」を押しました。これを実行すると、最後にウィンドウが表示され、希望のサイズとフレームレートを選択できます。最終レンダリングでカメラの動きを含めたい場合は、「2Dカメラ効果を適用」のチェックボックスを忘れずにオンにして、「OK」を押してください。

そして今、私たちは待つだけです。これで終わりです。それでは最後に、最終レンダリングを見てみましょう!

最後に

かなりクールですよね? >:)

 

今日のチュートリアルで皆さんが必要としたすべてを網羅できたことを心から願っています。他に知りたいことがあれば、このビデオが気に入って感謝の気持ちを抱いているなら、遠慮なくコメントしてください。ビデオに「いいね」をしてチャンネルに愛を示し、このようなチュートリアルをもっと見たい場合は購読し、気が向いたら他の推奨ビデオへと魂を漂わせてみてください。しかし、私からはこれで終わりです。私の地下室でくつろぐ時間です。皆さん、また次回まで!

 

アウヴォワール〜

コメント

新着

公式 新着