パスの数が違うもの同士のモーフィングが可能なのか解決方法を知りたいです

[RAURI]

「自」のパス

行いたい表現として

・英字　「i」     を漢字　「自」　へモーフィングしたい

「i」はシェイプ化しており「i」に関しては上（レイヤー１）と下（レイヤー２）とレイヤーを分けている。

レイヤー１はパス一つ、レイヤー２もパス一つの状態で、二つのレイヤーで「i」という文字ができています。

「自」もシェイプ化していてパスが５つでできています。

●疑問としてチュートリアルを見ているとパスが一つでできているものでの動画が多くパスが分かれていたりする場合は可能なのか不可能なのか何か方法があるのかを知りたい。

●「i」はそれぞれ動きを別に付けているのでレイヤーを二つに分けていますが、別レイヤーにもなっているので、こちらに関しては片方のレイヤーのみを使用してそちらを「自」に変更でもできるのであればそちらで進めたい。

※ 実践してできなかったこと

「ｉ」それぞれのレイヤーにて「自」のパス５つをコピペしてモーフィングさせてみても元のパスが一つ（各レイヤーのパスが一つ）なので結局一つのパスしか変形してないような状態です。

解決方法があれば教えていただけると助かります。

＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿

追記：他の部分に関しても例えば英字がパスが何十個もあるものを感じのパスの量が数個のものへなども同様な悩みで悪戦しております。

参考までに「D」のパスのスクショを載せておきます。

フォントはAdobeフォントのものを利用していますがいわゆるよく使われるゴシック、明朝ではなく少し遊んだようなフォントを使用しています。

[Mukaida]

Illustratorを使用して素材を作成する方法になるため、参考になるのかわかりませんが、一例です。

Illustratorで行う作業は、下記になります。
・テキストのアウトライン作成。
・全てのテキストの複合パスを解除して「自」の内側も通常の塗りつぶされた状態にする。
・「自」の頭の部分をハサミで切り離す。

・ドキュメント情報でポイント数を確認して、「自」と「ｉ」のポイント数を合うようにペンツールでポイントを増やす。

　　
＊ モーフィングがスムーズにできるように、必要に応じて「パスの方向反転」を使用する。

After Effects で行う作業は下記になります。
・レイヤーメニューからシェイプレイヤーを作成して「コンテンツ追加」メニューからパスを選択する。
・Illustratorのパスを１つ選択してコピーして、シェイプレイヤーのパスを選択してからペーストする。
・インジケーターを移動させて、先のパスから変化する形状のパスをIllustratorでコピーしてペーストする。
＊アニメーションが滑らかになるように、必要に応じてレイヤーメニュー「パスの開始点」を設定する。
・「自」の内側の長方形は、マスクとして追加する。

サンプルの動画を添付しています。

＜追記＞

ポイントを追加する位置によって変形中の形状が変わります。

また、プレビュー上でポイントを動かして形を整えることもできます。

[RAURI]

Mukaida様

ご丁寧にありがとうございます。

しかしながらイラレからではなくAE上で行う方法をぜひ知りたかったのですが、方法はあるのでしょうか？

また、モーフィングして動いている途中にパスが反転する理由として、以前、条件が異なるもの同士のパスをモーフィングさせるとなると聞いた時がありました。

（例えば長方形ドラックからぺジェパス変換のキーフレームからペンツールで手動で書く長方形への変形など）、ですので今回はどちらも同じ条件同士を変形させたのですが（テキストからシェイプ化したもの同志のパスをモーフィングした。）試しに行うと中間地点で捻れたり小さくなったりとあまり綺麗なモーフィングにはならないようでした。

解決策として、ペンツールでパスを足したりあまりにも多い時は減らしたりしてみてもそれで改善できる時もあればできない時もありました。

その際にパスを減らしすぎたのか本来の形にはならず文字自体が変形してしまい、あまりパスを増減しても形が変わってしまうのかなと思い、結局捻れや小さくなったて一度消えるようなモーフィングになったりしていたりします。

最初の頂点を切り替えて動きを変えてみてもなかなかうまくできなかったりとモーフィングをする際の基本と注意事項などがあれば知りたいです。

＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿

追記疑問点：「Aiでのベクター画像のパスについて新たな疑問」

実践：

ベクトルのAiデータとして文字ではなくイラストのものをAEに持っていく際に、

・レイヤー一つに一つのイラスト（A)としてレイヤーを分け、その一つのイラストをAeへファイルの見込みでAiデータをそのままAeに持ってきたところ、ベクトルからシェイプ作成しパスを見ると２００個近くのパスがグループ分けされて大量のパスが存在していました。

※ レイヤーを展開するとパスや複合パスがたくさん表示される状態でレイヤーは一つです

・もう一つのイラスト（B)もAiデータの方は同じ方法でファイルの読み込みで持ってきたところ複数のパスで作られたような形ではありますが、ダウンロードした時点でパスは一つのAiデータでしたのこちらはそのままAEでもパス一つでとても扱いやすい状態でした。

※ レイヤー一つに展開してもパスは一つ

・イラストBからAへモーフィングさせようとした際Bはパス１つAはパスが数百。

どうしたら良いかわからずAi上でパスを連結や単純化など試みましたが、連結をするとパスと複合パスが含まれているせいなのかエラー喚起が出てできず、単純化はPCが重たくなったのかフリーズして強制終了せざる負えない展開になりパスをひとつにする方法がわかりませんでした。

質問：Ai上もしくはA E上でAiデータの複数のパスをひとつにする方法はあるのでしょうか？

[Mukaida]

パスが反転する場合は、変形前と変形後でパスの開始点が離れたポイントに設定されているか、パスの方向の違い のどちらか、または、両方が原因だと思います。

イラストなどの図形をモーフィングする場合は、エフェクト「リシェイプ」を使った方が良いかもしれません。

Illustratorのファイルを読み込んで、パスに変換する場合は不要なパスが多数できるので手間がかかって効率が悪いと思います。
Illustratorと比較してAfter Effectsのパスを編集するツールは、かなり劣るので素材の制作はIllustratorで行なうのが良いと思います。

[Mukaida]

＜追記＞
Illustratorでパスを作成してコピペするようにすれば、思いつきで変形途中で円形にしたりすることもすぐにできます。

[RAURI]

Mukaida様

結論的にはAe上で作るのではなくイラレで作ってパスをコピペでAeへ持ってくるのがベストという事なんですね。

こちらの丸にできるという方法ですが、よろしければイラレとAeでのレイヤー状況のスクショと方法を教えていただけると助かります。

[Mukaida]

Illustratorでシェイプのサイズとポイントを適切な位置に追加して数を合わせておけば、After Effectsの時間を調整してパスを貼り付ける作業だけです。
ポイントの数を合わせるのが重要です。