AdobeソフトでVTuberを作ろう!Character Animatorの使い方

当ページには広告リンクが含まれています。
  • URLをコピーしました!

面白そうと思ったら試してみたいイラストレーター、さらえみ(@saraemiii)です。

やっぱりイラストを動かせるアニメって楽しいですね。

動画で発信する際、Vチューバーって個人で作るなら何が必要でどれくらい手間がかかるんだろう?と思い、今回はAdobe Character Animatorを試してみました。

さらえみ

細かい動作は必要無く、とりあえず動かしてみたい!という方にAdobe Character Animatorがオススメです。

に付属しているので、持っているクリエイターさんには気軽にはじめやすいと思います!

この記事はAdobe公式「Adobe Students Japan」で紹介されました!

https://twitter.com/AdobeStudentsJP/status/1416019836325572612?s=20
もくじ

Adobe Character Animatorとは

海外の方による使用感の説明動画です
  • AdobeCreativeCloudに搭載されているソフト
  • 現在は単体では売っていないようです
  • カメラの顔認識で2Dキャラクターが自在に動く
  • 他のAdobeソフトと連携しやすい(たぶん)

試しに簡単に作って使ってみた動画がこちら

ボロボロの試作品ですが(汗)
あわせて読みたい
モーションキャプチャーアニメーションソフト | Adobe Character Animator Adobe Character Animatorは誰でも使える直観的なアニメーション作成ソフトです。モーションキャプチャーや2Dキャラクターアニメーション、ライブアニメーションの作成のほ...

作って触ってみた感想

カメラ連動で動かすのがラク

イラストデータさえあれば、このソフトひとつでリップシンクまで出来ます。

特に細々いじらなくてもイラストデータとカメラがあればとりあえず動きます。

頭の振り、口パク、瞬きもカメラを通して自分の動きと連動しています。

WEBカメラはこれで充分対応できます

こちらのWEBカメラの古いモデルを何年も使用していますが、何の問題もなく使用できています。

角度調整もカメラを触ってできるのでとても使いやすいです。

高性能ならこのWEBカメラ

撮影する室内が暗めで認識しにくそうな場合は、こちらのような高性能なカメラの方が良いです。

デジタル絵が描ける人なら割とすぐ動かせる

レイヤー構成さえ合わせればある程度動かせます。

細かい設定無しでここまで動かせるのは結構ラクです。
多少雑な部分もありますが、他のソフトだともっと設定しないとここまで動かない印象があります。

細かい微調整は慣れたらすぐに出来そう

試してみた動画では、目が微妙な位置にズレたり、手の動きが伸びるだけだったりしています。

ちょっと研究が必要ですが、複雑な操作画面ではないので慣れればこのあたりの調整も出来そうです。

まだ認知度が低くチュートリアルが少ない

公式か作ってみた人のレビューがチラホラある程度で、情報やチュートリアルになる見本がまだまだ少ないです。


デフォルトでサンプルがいくつか付いているので、そこから研究していくと早めに色々出来そうです。
歩くループとかもありました。

分かりづらい所はアップデートですぐ便利になるかもしれません。

細かい2次元キャラの動きはLive2Dに軍配!

頑張れば出来るかもだけど、横振り向きとかなめらかな瞬きなど細かい所作はLive2Dのほうが強そうです。

さらえみ

私は試してみて、アニメ系キャラでクオリティ出すならLive2Dの方が良いと感じました。

Live2Dのクオリティを取るか、CharacterAnimatorの手軽さを取るかは、条件や好みの問題かなと思います。

ちなみに…Live2DでVTuberを作る方法はこちら

あわせて読みたい
Live2Dを使ったVTuberキャラクターモデルの作り方 Live2D初期の頃から触ってはいた、さらえみ(@saraemiii)です。 キャラクターを動かしたいけれど、アニメーションはハードルが高い。 イラストの良さを残したまま動画用...

簡単でもとりあえず動けば良いのなら、このCharacterAnimatorがオススメ!

細かいクオリティは気にせず、とりあえずキャラクターを動かしたいならオススメです。

基本的な作り方を以下にまとめておきます。

作り方

イラストデータの作成

Adobe Character Animator用にイラストデータを作成します。

例えば、Adobe Character Animatorのサンプル「クロエ」を開くと勝手にPhotoshopが立ち上がりPSDが開きます。

上書きしないように別名保存して、これを元にキャラを作成していくと一番わかりやすいです。

パーツごとに別れていて、どういった素材がどういった構成で必要なのかが一目瞭然です。

レイヤー名

フォルダ構成とレイヤー名が、組み込む際にすぐ連動してくれる肝になっています。

こんな感じのPhotoshopでのレイヤー構成が・・・

Adobe Character Animatorではこのような感じに。

▼レイヤー構成をリストアップしました!

ほぼ英語の翻訳ですが・・・(汗)

ひとまずこの通りにキャラクターパーツを作ればAdobe Character Animatorで動かせます。

やたら口パーツが多いです。英語の発音に合わせた構成らしく私は一通り用意してみましたが、必要最低限の数だけあればとりあえずは動きます。

ひとつのpsd内に「Head」と「body」フォルダーで構成されていました。

「Head」フォルダー内

<フォルダ・レイヤー名><中身>
+Right Eyebrow右眉毛(フォルダ)
Worried悲しい眉毛
Angry怒ってる眉毛
Normal普段の眉毛
+Left Eyebrow左眉毛(フォルダ)
Worried悲しい眉毛
Angry怒ってる眉毛
Normal普段の眉毛
+Right Eye右目(フォルダ)
Right Blink閉じ目
+Right Pupil黒目・瞳
Right Eyeball白目
+Left Eye左目(フォルダ)
Left Blink閉じ目
+Left Pupil黒目・瞳
Left Eyeball白目
+Nose
Mouth口(フォルダ)
Neutral通常の口
Smile笑顔の口
Ah「あー」の口
D「いー」の口
Ee「えー」の口
F下唇噛んでるような口
L「れー」の口
M閉じて「んー」の口
Oh小さめ「おー」の口
RLより小さい「ろー」の口
SDより横に伸びた「いー」の口
UhLに似た「あー」の口
W-Oo(フォルダ)
1「うー」の口(小)
2「うー」の口(中)
3「うー」の口(大)
Background顔パーツ以外の頭部(フォルダ)
Hair Top Front前髪(フォルダ)
Clip「クロエ」のクリップ・無くていい
Unnamed-2前髪
Face Background顔のベース
Hair Top Back顔より奥の前髪
+Hair1右のうしろ髪
+Hair2左のうしろ髪

「Body」フォルダー内

+Right Arm右腕(フォルダ)
Sleeve右二の腕(袖)
Hands右手(フォルダ)
Point2差し指裏返した手
Point1差し指
Switch裏返した手
Default通常の手
Arm肘からの腕
+Left Arm左腕(フォルダ)
Sleeve左二の腕(袖)
Hands左手(フォルダ)
Point2差し指裏返した手
Point1差し指
Switch裏返した手
Default通常の手
Arm肘からの腕
Body BG首から下の胴体+足

多少構成変えても動くので、ここから上手く調整すれば髪を複雑に動かしたり、まぶたの中に瞳を構成する等も出来ます。

固定用のポイントを打っておく

読み込んだ際に体など固定できるようにポイントを打ったレイヤーが必要になります。

作り方は以下の通り。

Photoshopにて、新規レイヤーを作ります。

↑「Head」フォルダーの直下に「origin」レイヤーを作成。

青い点が追加したハンドルです。

↑ペンツールの「シェイプ」でハンドルを1点、首の付根あたりに追加。

これで必要以上に首がグラグラすることはなくなります。

「fixed」レイヤーの腰あたりにハンドル(青い点)を追加。

「Body」フォルダーの直下に「fixed」レイヤーを作成。

こちらは腰あたりに点を追加しておきます。これで体がフワフワ浮くことはなくなります。

Adobe Character Animator内でも固定ポイントの調整はできます。

新規プロジェクトとしてPSDキャラを読み込み

Adobe Character Animatorで「ファイル」→「新規プロジェクト」を押し、データを保存する場所を指定します。
指定した所にフォルダとデータが作成されて新規画面になります。

「ファイル」→「読み込み」で先程のイラストPSDデータを指定します。

ワークスペース「プロジェクト」内に読み込まれたデータを「タイムライン」へドラッグします。

するとこんな感じにもうある程度動きます。

画面の大まかな説明はこの通り。拡大できます。

読み込んでクリーチャーが出来たらココ押すと直るかも

キャラクターイラストデータを作って、最初に読み込んだ時こんなクリーチャーになりました。

さらえみ

これはひどい(汗)

私の場合「基本姿勢を設定」を押すと認証しなおして綺麗な状態になりました。

揺らす・腕を動かす・固定する・・・細かい設定

動きの範囲を調整する場合

画面右側にあるキャラの動かす範囲をコントロールできるパネルはこちら。

ここではリップシンクを音声とリンクさせるか手入力させるかを選べたり、「顔の傾きの強度」等の%を調整して動きの大きさを細かくここでコントロールできます。

キャラデータを編集する場合

ここで画面切り替えができます。

キャラデータを編集する場合は「リグ」を選びます。

こんな画面になります。

レイヤー構造など確認できます。ここで関節などの編集ができます。

動きに連動して揺らす

「リグ」画面で揺らしたいパーツを選択。
丸いポイントが出て来るので、これを揺らしたい付け根へドラッグ。

「リグ」画面下にあるツールから右端の「ダングル」を選びます。

「ダングル」ポイントを揺らしたい先に追加します。

これで設定した髪の毛などが動きに連動して揺れます。

腕などをマウスにあわせて動かす

「リグ」画面で揺らしたいパーツを選択。
丸いポイントが出て来るので、これを関節の付け根へドラッグ。

「リグ」画面下にあるツールから「スティック」を選びます。

ドラッグして関節に骨を入れるように付けていきます。

「リグ」画面下にあるツールから「ドラッガー」を選びます。

マウスで吊りたい先端にドラッガーポイントを打ちます。

これでマウスのドラッグに吊られて振り子のようにパーツが動きます。

パーツを動かないよう固定する

「リグ」画面で固定したいパーツを選択。
「リグ」画面下にあるツールから「ピンツール」を選びます。

固定したい位置にポイントを打つだけです。

とりあえず簡単にVチューバーやるならAdobe Character Animatorは使える

以上の工程を繰り返し、背景などの画面合成をして配信できる状態に持っていきます。

Adobe Character Animatorが付属しているを持ってるクリエイターさん多いと思うので、新規に専門ソフト揃えるよりは入りやすいです。

動画を無視できない時代になってきているので、もし簡単に試してみたいならオススメです。

あわせて読みたい
クリエイターに必須!Adobe CCを安く買う4種の方法 イラストやアニメの制作にAdobe製品から離れられない、さらえみ(@saraemiii)です。 会社員時代から現在フリーランスとして仕事をしていても必ず使うAdobe製品。 デジタ...

Live2Dで動くキャラクターを作ってみたまとめはこちら!

あわせて読みたい
Live2Dを使ったVTuberキャラクターモデルの作り方 Live2D初期の頃から触ってはいた、さらえみ(@saraemiii)です。 キャラクターを動かしたいけれど、アニメーションはハードルが高い。 イラストの良さを残したまま動画用...

既にLive2D素体を持っていてVTuberのように動かしたい場合はこちら

あわせて読みたい
自作のLive2Dモデルを動かす「FaceRig」の使い方 Live2D制作をはじめてみたイラストレーター、さらえみ(@saraemiii)です。 ビデオ通話や動画配信で、自分の動きに連動シンクロしたキャラクターを使って発信したい時に役...

2次元になりたい人へのヒント

よかったらシェアしてね!
  • URLをコピーしました!
もくじ