キーフレームを使用した基本的な歩行サイクル

11,654

マナ|Mana

マナ|Mana

こんにちは!これはマナです

 

このトピックでは、Clip StudioPaintでキーフレームを使用したウォークサイクルの基本について説明します。

 

ここでは単一の画像を使用し、キーフレームを使用してアニメーション化します。このプロセスは、CSPのPro、Debut、およびExバージョンで実行できます。 .CLIPは、記事の最後にあるので、フォローしたり、自分でアニメートしたりすることもできます。

 

ビデオプロセスはここにあります:

 

音声が乱雑になりました(私の音声は常に乱雑ですが、今回は本当に乱雑になりました)が、理解できるといいのですが。

 

この記事をビデオと同じにするように努めますので、この書かれたバージョンも使用してフォローすることができます。

 

以下のこのGIFは310x600です。元のファイルは1700x3286(10 MB以上)です

ClipStudioでのアニメーション

ClipStudioのアニメーションについて簡単に説明します。

 

•CLIPSTUDIO PAINT PRO

-これは、最大24の再生時間でのみアニメーション化できます。 (8 FPSの場合は3秒)

•CLIPSTUDIO PAINT EX

-無制限の再生時間でアニメーション化できます。

 

このチュートリアルはPROバージョンで実行できます!

 

キーフレームアニメーションとは

キーフレームアニメーションは、グラフィック自体をアニメーション化するアニメーション方法です。つまり、フレームごとに描画するのではありません。

 

キーフレームは単語からです。重要な意味の動き、1秒あたりの画像/ショットであるフレーム。フレームは、アニメーションの時間の測定値です。

 

したがって、これの最も正確な説明は、「特定の時間に「何か」を移動(アニメーション化)する」です。

 

繰り返しますが、注意してください。私たちは何かを動かしています

フレームごとに描画するのではなく、その間に再描画する必要もありません。オブジェクト自体を移動します。

 

準備

単一の画像をアニメーション化する場合は、その図面をパーツにカットする必要があります。しばらく時間がかかりますが、結果はそれだけの価値があることを覚えておいてください。

 

私はこの私の絵を使用します。彼女の名前はモニカです。

 

[選択領域]ツール> [なげなわ]サブツールを使用します

必要な選択ツールを使用できます。

 

カットする方法は、最初に衝突のないパーツ、たとえばARMを選択することです。

 

なげなわツールの使用; ARMの領域全体を選択します。それは腕そのものであり、前腕から手までです。選択したら、CTRL + Xを押してカットすると、選択した領域が別のレイヤーになります。

 

次に、残った穴をペイントする必要があります。好きな色付け方法を使用してください。私はいつも最初にGペンに行きます>ブレンディングブラシ(エアブラシ)

 

必要な部品がすべて揃うまで切断を続けます

 

私がカットしたすべてのパーツは次のとおりです。

 

 

•私たちは手を持っています。これは前腕と手そのものです。

 

• アーム;それは肩と腕そのものです。

 

•BackHair;名前自体のように、それは後ろ髪です。

 

•ボディ;または、これはアニメーションのない領域のようなものです。これは前髪、頭、首、胴体上部です。

 

•スカートもあります。スカート自体のように

 

•私たちは足を持っています。足ではありません。足首の回転にこれが必要です

 

•この下腿があります。膝から足首まで

 

•上肢;これは太ももであるはずですが、アニメーションではこの領域を表示する必要がないため、上肢全体を描画する必要はありません。

子育て

子育ては、複数のレイヤー(子)を1つのレイヤー(親)に接続する場所であり、親を移動すると、子が続きます。

 

Clip Studio Paintには子育てはありませんが、レイヤーをフォルダーにグループ化すると、そのフォルダーが親として機能します。

 

アニメーションフォルダではなく、通常のフォルダを使用します。

 

•始めましょう、HANDとARMをつかみます>右クリック>フォルダを作成してレイヤーを挿入>これをARMに名前変更します

•次に、BODYをクリック> EyeCloseまで>右クリック>フォルダの作成とレイヤーの挿入>これの名前をUPPERに変更します

•次に、FOOT and LOWERLEGを選択します>右クリック>フォルダを作成してレイヤーを挿入>これをLOWERLEGに名前変更します

•次に、[下腿と上腿]をクリック>右クリック> [フォルダを作成してレイヤーを挿入]>これをLEGに名前変更します

*下腿を上腿に分離する理由-KNEEをアニメートするため、膝を曲げ、足はこの脚の領域に従う必要があります。

 

LEGフォルダーは脚全体です。

下腿は膝を下向きにします。

 

•次に、すべてのフォルダーとレイヤー(BGを除く)をクリック>右クリック>フォルダーの作成とレイヤーの挿入>これの名前をGLOBAL_Monicaに変更します

 

タイムライン

これをアニメートし始めます。

ウィンドウを取得>タイムライン

 

タイムラインツールバー。 [新しいタイムラインを作成]を選択します

 

タイムライン名:Monica_Walk

フレームレート; 15

フレーム番号、1から始まります

 

再生時間; 17

 

画像の補間、これは個人的な好みですが、シャープに見えるように最近傍を好みます。必要な補間を選択できます。

 

完了したら、[OK]をクリックします。

 

何よりもまず、私の再生設定を変更して、同じ結果が得られるようにします。

 

[アニメーション]> [再生設定]に移動します>以下を確認してください

•リアルタイムで再生

•ループプレイ

•再生を開始する前にレンダリングする

•品質を優先する

 

キーフレームの追加

タイムラインパネルの「キーフレームの追加」は使用しないでください。

 

私はそれをお勧めしません。これを使用する場合は、アニメーションを必要としない領域にキーフレームを追加します。

 

例;スケールを変更するだけで済みますが、そのボタンをクリックすると、位置と回転にキーフレームも追加されます。

[操作]ツール> [オブジェクト]サブツールの下の変換ボックスを使用してください。

 

変換の近くのボックスを使用してキーフレームを配置します

 

-残念ながら、CSPでは、これを使用すると、クリックまたはアニメーション化していない領域にもキーフレームが追加されます。整理のために、ボックスをもう一度クリックして、不要なキーフレームを削除します。

キーフレームを追加する好ましい方法

 

•タイムラインパネルでアニメーション化するレイヤーを選択します

 

•+アイコンをクリックします

 

•>アイコンをクリックして、変換オプションを展開します

 

•必要な変換をクリックし、[操作]ツール-[オブジェクト]サブツールの変換パネルを使用して値を追加します

アニメーション|本体

私が言及するのを忘れた2つのこと:

 

ここでアンカーポイントを大幅に変更することになります。変更したくない場合は、レイヤーを画像マテリアルに変換できます。

 

二;親に何か忘れました。 GLOBALフォルダの下。すべてのキャラクターレイヤーをつかみ、右クリック>フォルダーの作成とレイヤーの挿入>これをメインボディと呼びましょう。

 

*私のグローバルのスペルが間違っています。ごめんなさい!

 

 

ここで、MAINBODYフォルダ>このレイヤーでキーフレームを有効にするでアニメーションを開始しましょう。

[操作]> [オブジェクトサブツール]が表示されていることを確認してください

 

MAIN BODY FOLDERのアンカーポイントを変更し、胴体に置きます。

 

*選択範囲の中央にマウスを置きます。ポインタが変わります。アンカーポイントをクリックして目的の場所にドラッグします

 

アンカーポイントを変更すると、キーフレームが自動的に作成されます。

--------------削除できます。そのキーフレーム内にはアニメーションがないので

ヒント:アニメーションを作成するとき。常に最大の動きから始めます。

 

歩行サイクルを行う際の最大の動きは脚ではなく、全身です。足を踏み入れると体が上下します。

そこで、POSITIONトランスフォーメーションを使用して上下に動く体をアニメーション化します。

 

はい。したがって、アニメーションのリファレンスに従います。

 

これは、3Dアニメーションに使用するのと同じアニメーションリファレンスであり、少し調整するだけです。

 

ここから始めましょう。繰り返しますが、POSITIONトランスフォーメーションをアニメーション化します

MAINBODYフォルダが選択されていることを確認してください。

 

●フレーム5、これは通常の高さの位置であるRESTです。そこにキーフレームを置くだけです。

 

●フレーム3–体がかなり下がるので、位置Yに行きましょう。 1480

 

●フレーム1–フレーム3よりも小さいため、位置Yに移動します。 1450

 

●フレーム7–体が上がるので、位置Yは、たとえば1390です。

 

●フレーム9は最初のフレームと同じです。

したがって、最初のキーフレームに移動>右クリック>コピー

フレーム9に戻り>右クリック>貼り付け。

 

●では、2番目から5番目のキーフレームをコピーしてみましょう>右クリック>コピー>フレーム11に移動>右クリック>貼り付け

 

私たちがそれをプレイするとき:

 

体が上下する

アニメーション|脚

脚のアニメーションを始めましょう

LEGフォルダに行きましょう。

 

MAIN BODYフォルダはすでにキーフレームが有効になっているので、その中のフォルダとコンテンツもすでに有効になっているので、[操作]ツールを選択してみましょう。 [オブジェクト]サブツール。

 

LEGフォルダのアンカーポイントを変更します。

 

スカートを非表示にして、LEGフォルダーアンカーポイントを脚の上部に配置できるようにします。

 

それでは、ここでLOWERLEGフォルダーに移動しましょう。この名前をKNEEに変更しましょう。

スカートとUpperLegレイヤーを非表示にしましょう> KNEEのアンカーポイントを上部中央に配置します

FOOTに移りましょう。アンカーポイントを靴下の中央の陰影に配置します。これを回転させたときに、黒いスペースができなくなります。

----------------------------------------- 

それでは、KNEEに行きましょう

 

まず、LEGフォルダをキーフレーム参照として使用してキーを設定しましょう。ここでは回転角を使用します。

 

•最初のフレームでは動きはありませんが、この位置を維持するためにキーを押す必要があります。回転角のキー。

 

•5番目のフレーム、動きなし、ポーズが保持されるように、回転をもう一度キー入力しましょう。

 

•9、動きはありませんが、曲げを追加するために、2.6でキーを設定しましょう。

 

•13、動きがありますが、最初に終わりをキーイングしましょう。

 

•動きを終わらせ、回転をキーにしましょう。 0.0>キーフレームをタイムラインの最後までドラッグしてループします。

 

•13に戻りましょう。13番目のフレームで何が起こっているのですか?足が折れる。

したがって、この膝を約95度回転させる必要があります。

 

そしてそれをプレイすると:

 

アニメーション|足

アニメーションはまだ硬く見えます

それでは、詳細を追加するためにFEETをアニメートしましょう。

 

繰り返しますが、回転角にキーを設定します

 

そして、上記の他の2つと同じキーフレームフォーメーションを使用してFEETにキーを設定します。

 

•最初のキーフレーム>これをひねると、-4は問題ないように見えます。

•2番目のキーフレーム–これは床が平らなので、問題ありません。元の休憩キーをそのままにしておきます。

 

•3番目のキーフレーム–靴の先端が地面を向くように、これを少しひねりましょう。

20度は大丈夫に見えます。

 

•4番目のキーフレーム–またはフレーム13、足は地面を指しているので、これを回転させる必要があります–20も問題ないように見えます。

 

•最後のキー。最初のキーフレームをコピーして、ここに貼り付けましょう。

 

これをプレイするとき:

 

これは問題ないように見えますが、片方の脚しか見えないので奇妙に見えます。もう一方の脚を作りましょう。

アニメーション|脚の重複

•LEGフォルダーをクリック>右クリック>レイヤーの複製

•次に、複製レッグをクリックし、LEGフォルダーの下にドラッグドラッグして、複製の名前をBACKLEGに変更します。

 

 

 

•複製されたフォルダの内容を展開して、BACKLEGフォルダの最初の2つのキーフレームを選択します>キーフレームの削除

 

•次に、残りのすべてのキーを選択し、タイムラインの先頭にドラッグします。

 

他のキーフレームを追加しましょう。

最初のLEGフォルダを非表示にすると、混乱する可能性があります。

 

•つまり、BACKLEGの13番目のフレームです。脚は13フレームで静止しているので、すべてを0.0に変換します。

 

•最後のキーで、最初のキーフレームをコピーするだけです。ループを取得できるように、タイムラインの最後にあるPASTEDキーをドラッグしてください。

 

それでは、最初のLEGを再表示しましょう。

 

これを遊ぼう

 

アニメーション|脚の間隔

足が近すぎると感じた場合は、スペースを確保することができます。

 

最初のLEGフォルダーに移動しましょう。再びフォルダ。

 

•最初のフレーム。キーポジション

•9番目のフレーム。キーポジション

•最後のフレーム。キーポジション

 

最初と最後のPOSITIONキー[X軸]フレームは900になります。

MiddlePOSITIONキー[X軸]フレームは800になります。

 

BACKLEGでも同じことをしますが

最初と最後のPOSITIONキー[X軸]は800です。

中央のPOSITIONキー[X軸]は900です。

 

アニメーション|腕

では、追加の詳細やアクセサリをアニメートしましょう。

 

腕から始めましょう。ARMアンカーポイントはそれを肩に置きます。回転させて確認してください。

 

手;これは肘への手です。アンカーポイントをエルボに変更します

-------------------------------------------------- --------- 

では、ここからARMフォルダから始めましょう。回転角をキー入力します。

最初のフレーム、9番目、最後のフレームにキーフレームを追加します

 

•最初のキーフレーム、これを引き戻して、20を取得しました。

•中央のキーフレーム。行きましょう-20

•最後のキーフレームについては、最初のキーフレームをコピー>右クリック>貼り付け>最後のキーフレームにドラッグして上書きします。

 

これを遊ぼう、

これは問題ないようです。それでは、手または肘の領域をアニメートしましょう。

 

繰り返しますが、キームーブメントにキーを押します。

つまり、1番目のフレーム、9番目、最後のフレームの回転角です。

 

•最初のキーフレームで。腕を少し曲げましょう–14は大丈夫そうです。

•2番目のキーフレーム--20は良さそうです。

•最後のキーフレームについては、最初のキーフレームをコピー>タイムラインの最後に移動>右クリック>貼り付け>クリックしてタイムラインの最後にドラッグします。

 

そして、これをプレイします、これはよさそうです〜!

別の腕を追加しましょう。

 

•繰り返しになりますが、前と同じように> ARMフォルダーを右クリック>レイヤーの複製

 

•この複製フォルダーをSKIRTの下にドラッグし、名前をBACKARMに変更します。

•さて、バックアームフォルダの最初のキーフレームを選択します。フォルダとレイヤー自体の両方>それらを削除します。

 

•残りのキーフレームをタイムラインの先頭に移動し、最初のキーフレームをタイムラインの末尾にコピーします>最後のキーフレームをタイムラインの末尾にドラッグすることを忘れないでください

 

私たちがそれをプレイするとき:

 

 

アニメーション|背中の髪

さて、他に何をアニメートできますか。 BackHairに行きましょう。

アンカーポイントを変更し、頭のてっぺんに置きます。

 

 

•フレーム5と13はREST位置であるため、回転角をそのままキーイングし、他のすべてのキーの動きをアニメーション化します。

 

筋金入りのことをする必要はありません、

 

•最初のキーをアニメートするだけです。回転角で、2度としましょう。

 

したがって、最初のキーをコピーして9番目の最後のフレームに貼り付けます。

 

*アニメーション|スカート|上半身

これらの次の部分はオプションです。必要に応じてこれらをアニメーション化できます。

 

SKIRTをアニメートすることもできます。

 

ここにアンカーポイントをスカート自体の上部に配置します。

-------------------------------------------------- - 

上半身もアニメートしましょう。繰り返しますが、これはオプションです

BACKHAIRで行ったのと同じ方法でこれをアニメートします。基本的に2つのキーフレームで、毎回コピーして貼り付けます。

 

スカートと同じ場所でアンカーポイントを変更します。

 

 

回転角をもう一度キー入力します。

 

•最初のフレーム–最初のキー–値を0.8に変更します

•5番目のフレーム– 2番目のキー–値を-0.4に変更します

 

•次に、両方のキーフレームを選択>右クリック>コピー>フレーム9に移動>右クリック>貼り付け

 

•最後にキーがありません>最初のキーフレームに移動>右クリック>コピー>最後のフレームに移動>右クリック>貼り付け>クリックしてタイムラインの最後にドラッグすると、ループが発生します。

 

これを再生すると、少しレンダリングされます。

 

エクスポート|画像シーケンス

さて、これで完了です。これをエクスポートしましょう。

背景を隠す

 

[ファイル]> [アニメーションのエクスポート]>に移動します

 

私のお気に入りのエクスポート方法は画像シーケンスです。

Image Sequenceは、アニメーションをフレームごとにレンダリングするため、これを自分で合成できます。必要に応じて、これをGIFまたはビデオファイルに変換できます。

 

-------------------------------------------------- ------ 

私は生のファイルを持っていて、それらを使ってやりたいことが何でもできるので、画像シーケンスを好みます。

同様に、このエクスポートファイルは私のビデオチュートリアルで使用されています。そのためにPremiereProを使用しました。

 

これを透明度のあるGIFに変換しました。 AdobePhotoshopを使用してGIFを作成しました

.CLIPファイル-ダウンロード+最終的な考え

この.CLIPファイルを入手して、自分で試すことができます。

繰り返しますが、これは単なる基本的なアニメーションです。必要に応じて、より多くの動きを誇張してください。時間を延長するか、プロジェクトを自分で試してみてください。

また、ビデオのアウトロプレビューは無視してください。私は2つのビデオを作成することになっていたのですが、病気になり、いくつかのファイルが破損しました。

 

私はまだいつかそのプレビューを投稿します、私はまだそのために生のファイルを回復しようとしています。

 

とにかく、これがお役に立てば幸いです。

乾杯! ; u; )///

コメント

新着

公式 新着