キャラクター作成方法：体

hr.icon

1. チュートリアルサイト

本演習では、以下URLの公式チュートリアルに沿って行う。

https://gyazo.com/0d5ba6209ae00418f4ffe47e9be57106

hr.icon

2. リギングとは

このチュートリアルではアニメーションに必要な構造の構築＝リギングを行う。

リギングは3DCGアニメーションでも必須の工程であり、ボーンとコントローラ（下図）の設定を含む。

　BlenderでArmatureのリグデモ（できればmixamoで）　

https://gyazo.com/48942d2afc8ef3c9cbcf075b513afbee

Character Animatorではハンドルやタグを追加することでリギングを行う。本チュートリアルでは、サンプルキャラクター「クロエ（下図）」を利用して2Dキャラクターリギングを学ぶ。

https://gyazo.com/071ec604ae0ad755c43eb03423bd083c

参考

hr.icon

3. プロジェクトの準備

「ファイルメニュー > 新規プロジェクト」をクリックして、任意の場所（ここではDesktop/Character Animator Projects）にプロジェクトを保存する。

https://gyazo.com/fff90e499c1bc48e4525d6d6ebe4d46f

プロジェクト名はZoeyに変更する。理由は4〜5に記述。

https://gyazo.com/74126b2f07f15feb75b7e7eae03999c9

シーンが含まれない空のプロジェクト（録画モード）が表示される。

下図の上部のプロジェクト名（紫枠）がZoeyであることを確認する。

https://gyazo.com/d1726dd9009c49fcd53ca25ebacb406f

ホームに切り替えて、パペット例からPhotoshop版クロエ（Chloe）を読み込む。

https://gyazo.com/188adb39b80c5324d59008527ae5f542

録画モードに切り替わり、プロジェクトパネルに以下が作成される。

シーン：シーン・クロエ（Photoshop）

パペット：クロエ（Photoshop）

カメラやマイクが有効であればボディトラッキングやリップシンクが可能。

https://gyazo.com/adf992a53ba732eb45ca8b3314a56d10

hr.icon

4. キャラクターデータ（PSD）の複製

クロエデータでは既にリギングが完成しているので、元のPSDデータを複製してリギングなしのパペットを作成する。

① クロエのオリジナルPSDを開く

プロジェクトパネルでクロエパペットを選択（下図上）して、PSアイコン（下図下）をクリックする。

https://gyazo.com/2e7c6e4f48bb7983989d3328e642c4bf

Photoshopが起動して、Chloe.psd（場所は下記）が開く。

/Users/ユーザー名/Desktop/フォルダ名/Zoey/Ch Media/Gathered Media

https://gyazo.com/6b0b23b9d88ed4eb868bede8aacdc657

② トップレイヤー名称の変更

トップレイヤーの名称をダブルクリックして、「+Chloe」から「+Zoey」に変更する。

https://gyazo.com/89453c62e3e76103775060bc8727029e

③ Zoey.psdとして保存

「ファイルメニュー > 別名で保存」で名称をZoey.psdに変更して同じ場所に保存する。

https://gyazo.com/bc4dd3432af017426c609c38f15bf348

https://gyazo.com/656325105164556618663b897fecd57f

hr.icon

5. Zoeyパペットの読み込みとプロジェクトの準備

① PSDデータの読み込み

「ファイルメニュー > 読み込み」からZoey.psdを選択して読み込む。

https://gyazo.com/affdafa982cc5c8a656047a1acff0551

https://gyazo.com/13397f0f9ae2af9efceb61edff4bfdf6

プロジェクトパネルにZoeyパペットが表示される。

https://gyazo.com/e6bcaef6b157f65ad1f931472cb4b9c7

② Zoeyのシーンを作成

プロジェクトパネルでZoeyパペットを選択した状態で、左下の「シーンを作成アイコン」をクリックする。

https://gyazo.com/c51e17f8d1e76b5d235cd9a25b8c4217

プロジェクトパネル内にシーンが追加される。

https://gyazo.com/fe0992952afa7c75bb80909ecc4d2770

プロジェクトパネル内には以下の４種が存在しており、見た目も一緒なので混同しないように注意が必要。クロエに関するものを削除してもよいが、リギングの参考となるのでこのまま残しておく。

シーン：シーン・Zoey

シーン：シーン・クロエ

パペット：Zoey

パペット：クロエ

③ シーン及びパペットの切り替え

プロジェクトパネルで特定のシーンやパペットをダブルクリックして切り替えることができるが、それぞれのパネル左上の名称をクリックして表示されるメニューで切り替えることもできる。

録画モードのシーンパネルの名称をクリックして切り替え。

https://gyazo.com/c820c4d316cf65edcbe1360b4a5ceb84

リグモードのパペット名称をクリックして切り替え。

https://gyazo.com/5c159a2cd64362e99eba932439ed115e

hr.icon

6. シーンプロパティの確認

プロジェクトパネルのシーンを選択する。

https://gyazo.com/718208e6734419b4c727e706b4e8020a

プロパティパネルがシーン情報に切り替わる。

https://gyazo.com/68e51d8f1c5727dcacc16672abd4b2c3

最終的な出力映像に関わるので最初に設定を行って制作を行う必要がある。

フレームレート

デュレーション（持続時間）

幅

高さ

hr.icon

7. キャラクターの縮小

このままでは、シーンサイズ（1920 x 1080）よりもキャラクターがはみ出ているので、キャラクラーのサイズを修正する。

タイムラインのZoeyトラックを選択する。

https://gyazo.com/f5adadb234538f32562f437d4a9b60dc

プロパティパネルがパペットトラックビヘイビアーに切り替わる。

https://gyazo.com/5d0226ffa5fb00898015b2c8c3884378

パペットトラックビヘイビアーには様々なビヘイビアが含まれるが、ここではトランスフォームのスケールを修正する。

下図部分を左右にドラックするか、適当な数値（50%程度）を入力する。

場合によっては、位置Xや位置Yも調整する。

https://gyazo.com/a7e767b9852dfb6396bacbf5e5341ba1

hr.icon

8. 頭と体の関係

リグモードに切り替える。

https://gyazo.com/6d0c4e5c700bd7366e94a76739c3e4b2

この段階でPSDのレイヤー構成から、ある程度のグループ構成やタグ付けは行われているが、身体のリギングは未設定の状態。

https://gyazo.com/83ae356f3eadbff598e3192fa6c25171

次に、パペットパネル左のレイヤー構成を確認する。

Zoey直下に大きくHead、Body、Hairのグループがあることがわかる。

https://gyazo.com/309bddab0447bbde17406d75d8680f81

わかりづらい場合は、それぞれのグループ左の「>」をクリックしてグループルートのみを表示させる。

https://gyazo.com/2e1ceb7a710f384b1340c26f17dbefc2

キャラクターを作成する場合は、このように大きく頭と身体を分けてグループ化した上で、それぞれを独立レイヤーには設定しないことが重要である。

ここで実験として、あえてHeadグループを独立レイヤーにしてみる。

下図のようにHeadレイヤー左の空白をクリックしてクラウン（王冠）アイコンをつける。

https://gyazo.com/6fe6fd3968b717fd7bc44ae450e25bcb

録画モードに変更して、カメラ入力有効の状態で頭を揺らしてみよう。

PSDデータのレイヤー構成から

Zoeyの頭が身体から外れてしまっているのが確認できる。

https://gyazo.com/dcf4b50f67c36f29c89eee3963e4d75c

PSDデータのレイヤー構成や独立レイヤー設定がキャラクターの動作に大きく影響することがわかる。キャラクターを作成する場合は、これらの特性をよく理解しておく必要がある。

hr.icon

9. 足（腰）の固定

現在の状態では、キャラクターの足は固定されていないので、頭の動きに合わせて揺れてしまい、地面に立っているようには見えない。そこでハンドルを追加して足（ここでは腰）を固定する。

https://gyazo.com/68c9be0eea07ab8e24df1ffa8d346330

① Zoeyパペットのリグモードを開く

プロジェクトパネルのZoeyパペットをダブルクリックしてリグモードを開く。

https://gyazo.com/7fb6602e9bd0964a96b611ca57a8519b

② パペット表示画面の操作（Photoshop同様）

以下の方法でパペット表示画面の拡大縮小・移動が可能。

拡大縮小：OPTION（ALT）キーを押しながらマウススクロールホイール

移動：SPACEキーを押しながら左ドラッグ

③ 対象レイヤー（Body）の選択

ハンドルはどのレイヤーに追加されるかによって動作が異なる。

ここではBodyレイヤーを選択する。

https://gyazo.com/d4811ef9aaa25987459d36bf143a952a

④ 固定ハンドルの追加　方法①

ハンドルツール（機能なし）を選択。

https://gyazo.com/899b21756e96f25aa32720793b7a41ba

特定の場所（腰の左右２箇所、およそでよい）をクリックして追加。

https://gyazo.com/7fb1b1ddc5affeb91ba89b3e776fc1d8

追加した後、ハンドルを移動をする場合は、選択ツールに持ち替えて移動。

https://gyazo.com/6e7ec6956379ad1cfe56bcdee8fab3d6

削除するときは、選択ツールでハンドルを選択してDELETEキー。

ハンドルを選択した状態で、プロパティパネルのタグ > 修飾子の「固定」を選択。２箇所とも設定する。

※チュートリアル映像では足に設定しているが身体全体が斜めになった場合はあまり固定されないので、ここでは腰に設定する。

https://gyazo.com/c500fed2a5c4cb3777f3d05edfdfb2dc

⑤ 固定ハンドルの追加　方法②

固定のタグを持つハンドルは利用頻度が高いため、ピンツールとして準備してある。

ピンツールは追加した時点で固定の修飾子を持つ。

https://gyazo.com/43303562e0a92e41b063fd1b97cf43d7

⑥ 動作確認

腕の調整は行っていないので少し離れるが、腰はある程度固定されている。

https://gyazo.com/451c5e86a7f4fa2aeb4c1856683dc431

hr.icon

10. 足の固定（手足のIKビヘイビア）

ここではチュートリアル映像には含まれないが、サンプルのクロエで行われている方法で足を固定する。実際には足を固定するのではなく、タグの設定と手足のIKビヘイビアの設定で実現している。

① 腰のハンドルの削除

9で追加したハンドル２つを削除する。

② Right Legレイヤーの選択

Right Legレイヤーを選択する。パペットの右足も選択状態となる。

https://gyazo.com/12b835e70c920779112f9d5438188c1a

③ 原点（回転軸）の移動

※原点設定する場合は、パネル下の「メッシュのアウトラインおよび自動ハンドルを表示」を有効にしておく必要がある。

選択ツールで下図紫丸部分をドラッグする。

https://gyazo.com/2bded7d82c327d6f792263e1716e8b24

胴体に近づけるとBody部分が緑に変化して、ハンドルも緑縁で表示される。これはRight LegとBodyがリンクされたことを意味する。

https://gyazo.com/30e898d2bbebe2bf027ad5615e667787

④ 構造用ハンドルとタグの追加

ハンドルツールで下図のようにハンドルを三箇所追加して、それぞれに「右つまさき」「右かかと」「右膝」のタグを設定する。下図では３箇所同時に表示しているが一つずつ設定していく。

https://gyazo.com/66ff40df2265ee49f3e9186238e4b389

⑤ 曲げない設定（スティックツール）

スティックツールを選択する。

https://gyazo.com/0c0c2c77225e3362572a311645427d2f

曲げたくない場所（3箇所）をスティックツールでドラッグしながら設定する。必要に応じて拡大表示しながら行う。

https://gyazo.com/721d3ba212dc425f0966f7cfd40a33f3

スティックツールは一度描くと移動のみしか修正できないので、失敗した場合は削除してもう一度描く。

⑥ Left Legの設定

②〜⑤同様の作業をLeft Legにも行う。

https://gyazo.com/2404a3997ced8dcee0d36bdbf935d82f

⑦ Bodyレイヤーの選択

次にBodyレイヤーを選択する。

https://gyazo.com/8767588eb359417429c813610b0e89ff

⑧ 腰の構造用ハンドルとタグの追加

下図のように２箇所のハンドルを追加した後、「右腰」「左腰」のタグを追加する。

※前半で固定タグを適用していた場合は固定タグを削除する

https://gyazo.com/6841d3d0c91df3116450ec237f37d5c7

⑨ 手足IKビヘイビアを追加

パペットパネル左上のアイコン（下図）をクリックして「手足のIK」ビヘイビアを追加する。

IKはInverse Kinematics（参考参照）の意味。

https://gyazo.com/bcc7de64aeacc72624a560ffaafaa8ee

プロパティ > ビヘイビアに手足のIK（下図右）が追加される。

https://gyazo.com/e41ad6c9b64b21fa5e5fb2fb09d6d4b8

参考

⑩ 動作確認

両足と腰のハンドルとタグ設定、手足のIKビヘイビアにより、頭の高さに合わせて膝が曲がる動きが実現できる。

足や腰を固定しなくても地面に立った状態となる。

https://gyazo.com/557689e7fdec55ff6ac5e3aa18dec877

hr.icon

11. 腕の設定

① Right Armレイヤーの選択

https://gyazo.com/44805d6b02b89b7aae982fd52b462ea4

② 原点（回転軸）の移動

下図のピンク枠部分をドラッグして・・・

https://gyazo.com/76d7c0e8f986c65ed5346c1cc4d3d3f5

下図のように緑色に変化する位置に移動する。

これでRight ArmとBodyが接続された。

https://gyazo.com/11eae83708bb53d3e972d790742eb854

③ ドラッグ可能なハンドルの追加（ドラッガーツール）

右手部分にハンドル（左ピング枠）を追加して、修飾子のドラッグ可能なタグ（右ピンク枠）を設定する。

https://gyazo.com/1262c3f6777442bfcc3525507380b944

録画モードに切り替えて、左手をドラッグすると動かすことができる。

https://gyazo.com/cad75633d5c2159fccdaf391d14c9161

このままだと関節のない軟体な腕になるので、肘関節の追加、上腕と前腕に曲がらない設定を行う。

下図のように軟体な腕のままでもそれなりに面白い動きではある。

https://gyazo.com/aa94784d9ea4ed0bfef9d87f1d57e60e

④ 肘用ハンドルの追加

下図ピンク枠のように、肘部分にハンドルを追加する。

このままでは何も動きは変わらない。

https://gyazo.com/b8ddeee7cd79fa6aa92b0dfe1d7cab87

⑤ 曲げない設定（スティックツール）

スティックツールで曲げたくない部分を設定する。

上腕と前腕をスティックツールで描く。

https://gyazo.com/d2f2fc8afeb76acad34084546047982d

このとき、スティックツールと肘のハンドルの位置関係が動きに影響する。

上図では前腕は下に曲がるが上には曲がらない。

下図のようにすると上に曲がる一方、下には曲がりにくい。

どちらにも曲がりやすくするためにはハンドルとスティックツールで描いた線が同一線上にあるように調整する。

場合によっては肘ハンドルもドラッグ可能なタグを設定したほうがよい。

https://gyazo.com/23faf71c8d1232bcc1d2fb6c4eacba43

⑥ 右手首と右肘のタグ付け

右手首と右肘にプロパティからタグ付けする。

https://gyazo.com/a6e80ccc5bf33ccd3dd95d4c6582abbf

⑦ Left Armの設定

①〜⑥の作業をLeft Armに対しても行う。

https://gyazo.com/b0f54c20326cf9d8ae147c8dbbcb337c

⑧ 左肩、右肩の設定（Bodyレイヤー）

⑦までの設定だと、腕が伸びてしまう。

https://gyazo.com/9747f83605017c1e5f09b4e5fd330d31

左肩と右肩を設定することで腕が伸びない。仕組みは不明だが、スティックに影響するハンドルがすべてタグ付けされたことが影響すると思われる。。

Bodyレイヤーを選択して、下図のようにハンドル追加とタグ付けを行う。

このとき、Left ArmやRight Armレイヤーの原点に肩を設定はしない。実はその方法でも同様の効果があるが、クロエではBodyに設定されている。理由は不明だが、管理しやすさか？

https://gyazo.com/64d2af8e490829228e5ceecdb8e00803

hr.icon

12. 全体の動きの確認

上記までで基本的なアニメーションキャラクターの土台（リギング）が完成した。

実際の録画モードで動きを試してみよう。

https://gyazo.com/523a69619b1e5bc779cccc4a200ba148

hr.icon

13. クロエのリグ分析（任意）

身体全体のリグの設定方法を理解するには、レイヤー構造、タグ、ビヘイビアの特性を深く知る必要がある。

今回設定したハンドルやタグは一部であり、サンプルのクロエでは髪等へも設定されている。もっと詳細な動きを実現したい場合は、すでに動作しているサンプルデータを分析することが近道なので、余裕があればクロエのリグを分析してみよう。

https://gyazo.com/c5532bfd6b726917da42785993dd33a2

hr.icon

14. 追加パペットの利用（紹介）

Character Animatorのホームではキャラクターのサンプルが用意されている。

https://gyazo.com/5465a72eeab9b40a6f1eff045545ab72

開発者のDave Werner氏が以下のサイトで多数のパペットを公開している。

https://gyazo.com/12c755ddcf3367e37f067d2fc828fcdc

hr.icon