初心者向け

【初心者向け】オリジナルキャラクターの作成【Adobe Character Animator】

こんにちは、Shionです

Character Animator(以降Ch)を最短で使えるようにするためには

やはり、キャラクターを0から作るのが一番良いでしょう

というわけで今回はオリジナルキャラクターを0から作ってみましょう

この記事はこんな方向け
  • キャラクターを0から作ったことがない
  • オリジナルキャラクターを作りたい
  • オリジナルキャラクターを作りたいとは思ってるけどハードルが高いと思っている方

まずはテンプレートをダウンロードしよう

初心者が最も失敗することは

レイヤー構造と独立、レイヤー名を間違えることです

トライアル&エラーで覚えていくということも重要ですが

特殊な構造のキャラクターでない限りは、レイヤー構造が大きく変わることはないと思うので、テンプレートを使ってしまった方が早いでしょう

では、みんな大好きDave(@okaysamurai)さんのサイトから
『Blank Template』をダウンロードしましょう

こちらのサイトの最下部あたりにあります

Blank Template.zipをダウンロードしたら、解凍して、イラストレーター(Templateblank.ai)かフォトショップ(TemplateBlank.psd)で開きましょう

キャラクターを描いていく

では、各レイヤー名に対応したパーツを描いていきましょう

注意するポイントはLeft Pupil(左の瞳)とかRight Eyeblow(右の眉)とか
『キャラクター目線』でということを間違えないでください

『私たちから見て』ではなく

Left Pupil(左の瞳)には文字通りキャラクターの左の瞳を描いてあげましょう

シンプルなパーツをサクッと描きます

以下のパーツは特に間違えることは無いと思いますので、サクッと描いてしまいましょう

  • Right Eyeblow
  • Left Eyeblow
  • Nose
  • Face Backgroud
  • Body

サクッとね

はい

色々と言いたいことがあると思いますが、口に出さずによく噛んで飲み込んでください

眼(Eye)周辺のレイヤーを描く

目の構造は以下の通り

  • ■Left Eye (左眼)
    • Left Blink(左のまばたき)
    • +Left Pupil (左瞳)
    • Left Eyeball(左の眼球とか白目)
  • ■Right Eye (右眼)
    • Right Blink(右のまばたき)
    • +Right Pupil (右瞳)
    • Right Eyeball(左の眼球とか白目)

今回はまん丸の白目と、さらに小さいまん丸な瞳で描いていきますが
瞳が大きなキャラクターを作りたい場合はこちらの記事を参考にしてください

眼・視線ビヘイビアーの使い方と解説【Adobe Character Animator】『眼』を正しく動かすためのレイヤー構造や設定、視線ビヘイビアーについて詳しく解説。失敗しやすいポイントや、レイヤー名についての解説など...

白目(Eyeball)を描く

白目に当たる部分

Left Eyeball, Right Eyeballにそれぞれ描きます

瞳(Pupil)を描く

瞳を描きます

Left Pupil, Right Pupil

まばたき(Blink)を描く

Left BlinkとRightBlinkにまばたき
目を瞑った状態を描きましょう

わかりやすいようにPupilとEyeballは非表示にしています

ただの棒?いいえ、彼は目を瞑っています

口(Mouth)を描く

口を描いていきましょう

  • ■+Mouth
    • Neutral (ニュートラル)
    • Smile (スマイル)
    • Surprised (驚き)
    • Ah
    • D
    • Ee
    • F
    • L
    • M
    • Oh
    • R
    • S
    • Uh
    • W-Oo

レイヤー数が非常に多いですが、リップシンク(音声に口パクを合わせる)するためのものです

英語の発音に合わせているため、このようなレイヤー名になっています

以下を参考に口を描いていきましょう

レイヤー名のサムネイルを見ていただければわかると思いますが

全てのレイヤーを雑に、、、もといサクッと描いています

これでキャラクターのイラストは完成です

その後、以下の設定に必ず変更しましょう

  • EyeグループはPupilとEyeballを表示し、Blinkは非表示
  • MouthグループはNeutralだけ表示し、他は非表示

別名で保存し、キャラクターの名前にしておくと良いでしょう

Chで動かしてみよう

『新規プロジェクト』を作成し

作成したPSDを『プロジェクト』パネルへドラッグ&ドロップで読み込ませ

キャラクター(わたしの場合はMan)を選択した状態で、新しいシーンに追加をクリックします

どうでしょう?

無事に動きました?

少なくともわたしのManくんは健やかに動き回っています

GIFです、クリックすると動きます

 

うまく行かなかった場合

レイヤー名を間違えて変更してしまったりしない限りは、レイヤーの表示/非表示ぐらいしか問題は考えられないです

その場合に起きるであろう問題は目か口の表示がおかしい、というぐらいのはずです

もしこの問題が発生した場合は

プロジェクトパネルからキャラクター(わたしの場合はMan)を選択し、プロジェクトパネルのした方にある、オリジナルを編集(ショートカット Cmd+E)をクリックし、フォトショップへ戻りましょう

そして以下を確認

  • EyeグループはPupilとEyeballを表示し、Blinkは非表示
  • MouthグループはNeutralだけ表示し、他は非表示

これになっていなかったら変更して、上書き保存した後、Chに戻りましょう

どうですか?直りました?

まとめ

  • オリジナルキャラクターは意外と簡単!
  • 軽い気持ちで作ってみよう!

これからオリジナルキャラクターを作っていく方へ

Chでキャラクターに何度も編集を加えて行くと、レイヤーがズレるバグが起こります

そうなると手間が格段に増えますので、そうならないようにChでトリガーの設定などなど大々的に行う前に以下の記事を読んで、対策しておきましょう、いや、マジで、見ておいたほうが良いです

レイヤーの位置がズレるバグへの対策【Adobe Character Animator】今回はCharacter Animatorで発生する『位置ズレ』のバグについての解説と対応をしていきます。そもそもなぜ位置ズレが発生するのか、一時的な対応と恒久的な対応について...

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA