Character Animatorで、全身のキャラクターを動かしてみました。

こんにちは！楽じい(“@rakujii7“)です。前回に続きCharacter Animatorで遊んでいます。

今回は頭だけでなく胴体を付けて、全身のキャラクターを動かしてみました。もちろんProcreate＋Apple Pencilで作成したキャラクターです。

基本的なフォルダー分けから最後ビヘイビアーの追加まで、手足を動かせるツールを紹介します。

ちなみに前回の頭までの記事はこちらです↓↓↓どうぞ。。。

フォルダー分け

まず、Procreateで作成したキャラクターをPSD形式で書き出し、Photoshopで開きます。

事前にテンプレートと同じレイヤー名で作成しているので、ここではフォルダー分けが主な作業となります。

今回は、胴体・腕・手を追加しているので、前回の頭(Head)の下に(Body)のフォルダーを作りました。

 

フォルダーの名前はBodyとして、その中にRight ArmとLeft Aemのフォルダーでグループ分けをします。

それぞれのフォルダーにはArm(腕)とHand(手)のレイヤーを入れています。

これらのレイヤーを用意することで、腕を曲げる動作が可能になります。

腕を曲げる動作はマウスポインターで行う為、レイヤー名の決まりはなく英語で付ける必要はありません。自由でOKです。

また、今回はMouth(口)のフォルダーは作成していません。

というのも、このグループには13種類もの口の形があるからです←つまり、めんどくさいから

Creative Cloudメンバーなら、口などのパペットの要素が無料でダウンロードできるで、その方法も紹介します。

口の形をダウンロードする

では、口の形をダウンロードする方法ですが、こちらはCharacter Animatorの「開始」ワークスペースからAdobe公式サイトに移動します。

ダウンロードしたZipファイルは解凍してからPhotoshopで開きますが、解凍したファイルの中には、Illustratorにも対応した形式があるので、TemplateMouth.psdを選択しましょう。

キャラクターへの挿入方法は、Mouthフォルダーを挿入したい位置へドラッグすれば簡単に移動することができます。

また、レイヤーパネル内にMouthフォルダーを適切に配置したい場合は、配置したい下のレイヤーを予め選択しておくことで、適切な配置ができます。

Photoshopでは移動ツールを使えば簡単にでき、レイヤーパネル内の移動もドラッグできますが、作業効率を上げるためには覚えておいた方がいいですね！

Character Animatorで動かしてみる

では、Photoshopでホルダー分けが終わったので、次にCharacter AnimatorにPSDファイルを読み込んで実際に動かしてみます。

はじめにCharacter AnimatorにPSDファイルを読み込んで、シーンを作成します。

シーンの作成方法は下図の通り、プロジェクトパネルの読み込んだPSDファイルを選択して カチンコのマークをクリック すれば作成できます。

この他、直接タイムラインにドロップする方法もあります。

次にキャラクターを編集するためにパペットを作成します。読み込んだPSDファイルをダブルクリックでパペットが作成されます。

これでキャラクターを編集する準備ができました。Photoshopで作成したフォルダー構造も反映されていますね。

今回はBodyファイルを中心に編集していきます。

• 胴体が浮つかないようにピンツールで固定
• 足を動かすためのタングルを設定
• 腕を動かすタングルと肘が曲がるスティックツールを設定
• 動かした手足が自然に元にもどるビヘイビアーを追加

胴体が浮つかないようにピンツールで固定

まず、胴体がふわふわと浮つかないように、下部のツールバーからピンツールを使用して固定します。

通常、一番下の靴の部分で固定するようですが、今回は足も動かしたいので股関節あたりに2か所で固定しました。

固定方法は、Bodyフォルダーを選択⇒ピンツールを選択⇒固定する場所でクリックです。

※くれぐれも「Bodyフォルダーを選択」することを忘れずに！

固定ピン設置後、移動したい場合はドラッグでOKです。また削除したい場合は、Deleteキーです。

足を動かすためのタングルを設定

次に、足を動かすためにドラッガーツールを使ってタングルを設定します。

タングルというのは、キャラクターを動かすハンドルのようなものです。

足先にタングルを付けるとマウスで足を動かすことができます。

設定する手順は、ピンツールと同じです。移動、削除も同じですね。

※まだBodyフォルダーのままですよ！選択するのを忘れずに！

このキャラクターは足が短いのでタングルだけでも動いて見えますが、ここに人の骨のようなスティックツールを使うとよりリアルな動きになります。

左足と右足を比較してみると、スティックツールの付けてない右足の画像がぼけて見えますね。ただ伸びるだけって感じです。

腕を動かすタングルと肘が曲がるスティックツールを設定

次に、腕を動かせるように編集します。

やり方は足を動かした場合とほぼ同じで、ハンドルとなるタングルを手先に設置(ドラッガーツール)して、肘が曲がるようにスティックを2か所に設置(スティックツール)します。

今度は、Right Arm(右腕)のフォルダーとLeft Arm(左腕)のフォルダーがあるのでそれぞれ設置していきます。

まず、右腕から・・・

• Right Armのフォルダーを選択
• 始点となるオリジンを肩に移動
• タングルを手先に設置
• 肘が曲がるようにスティックを上腕と前腕の2か所に設置します。

上図のように、腕が動く始点のオリジンを移動ツールで肩に移動して、タングルを手の先に付けました。

こちらも足の時と同じで、スティックを付けるとより自然に肘が曲がります。

スティックを付けてない方は、腕を無理やり曲げているようで、変形しているのが分かると思います。

最後に、動かした手足が自然に元にもどるビヘイビアーを追加します。

ビヘイビアーのドラッガーで基本姿勢に戻す

ビヘイビアーというのは、パペットをコントロールするパラメーターです。

プロパティーパネルの一番下＋をクリックすると色んな命令を追加することができます。

今回は、ドラッガーツールを使ったので項目の中から「ドラッガー」を選択します。

パラメーターを見ると今回 Bodyフォルダー で、両手足の4っのタングルを使用したのが分かります。

その下の「移動後」「戻り時間」はデフォルトでは、(固定)(0.2秒)となっているのでこれを変更します。

• 固定を(基本姿勢に戻る)に変更すれば、マウスのドラッグで動かした手足が自然に元の姿勢に戻るようになります。
• 戻る速さは(0秒)なら一瞬で戻り、数秒かけて戻したい場合は秒数を指定すればその速さで戻ります。

他にもビヘイビアーには様々なパラメータがあり、もっと複雑な命令をパペットに指示できるようです。

今回はドラッガーの簡単な動きでしたが、今後色んなことを試してみたいと思います。

また、文中で作業する「フォルダーを選択するのを忘れずに！」と言っているのは、私の反省を込めています。

違ったフォルダーまたはレイヤーにタングルなどを付けてしまうと、上手く動作しません。あたりまえですが・・・

「今、どこの部分を編集しているのか？」確認しながら作業を進めるのは大事なことですね！