クリスタProでアニメーション作成練習〜パート2

Pocket

2019.08.21⇅

クリスタ(CLIP STUDIO PAINT)では動くイラスト、アニメーションなども作成できます

で、クリスタには、『動くイラスト』と、『アニメーション』というのがある。

前回は『動くイラスト』でとりあえず作ってみましたが、今回はそれらの違いや、『アニメーション』でのアレソレについて。。。。。

クリスタアニメーション

〜〜 項目〜〜〜〜〜〜〜〜〜〜〜〜〜

♥1、クリスタの『動くイラスト』と『アニメーション』の違いって?

❤︎2、クリスタ『アニメーション制作』の基礎

◆2−1、アニメーション新規作成
(演出フレーム・作画フレーム・フレームレートなどなど)

◆2-2、アニメーションフォルダ・レイヤーフォルダ

◆2-3、タイムライン割り当て

◆2-4、アニメーションパレット・オニオンスキン

〜〜〜〜〜〜〜〜〜〜〜〜〜

スポンサーリンク

♥1、クリスタの『動くイラスト』と『アニメーション』の違いって?

24フレーム制限があるかないかの違い? と思いがちですが、

  • CLIP STUDIO PAINT PROもともとアニメーションは24まで
  • CLIP STUDIO PAINT EX の方はそれ以上の長尺アニメーションが作れ

◆クリスタの場合、『クリスタEX』以外は、『アニメーション』タブから作っても『24フレーム以上のアニメーション』は作れない。

PROの場合で24フレーム以上のアニメーションを作りたい場合、

PRO内で全部描いてから、それに連番をふって画像全部を一旦書き出し、

別口で保存して外部動画ソフトなどに読み込み、動画として作るか、

もしくは24フレームまでに区切って書き出し、他のソフトで繋げるなどが必要になてくるw

ファイル>アニメーション書き出し>連番画像↓

連番画像

じゃ、クリスタPROでの『動くイラスト』と、『アニメーション』の違いって?ってなりますよね?笑

実際両方で作ってみたり、調べてみたりしましたが、やれることでの違いってないっぽいです笑

と言いますか、”違いはないです” とされています。

操作や機能的なできることは同じ

『動くイラスト』と、『アニメーション』の違いは、

“枠、画角フレームの詳細設定が『アニメーション』ではできる”

というだけです。。。。

*動くイラスト新規作成パネル
下図を見ればわかりますが、キャンパスサイズ、解像度、セルの枚数、フレームレートしか設定できない↓

動くイラスト新規作成

*アニメーション新規パネルでは、
基本フレーム、演出フレーム、作画フレーム、余白なども設定できる↓

アニメーション新規作成パネル

うごくイラストより、細かく枠設定できる

ということです、、、

ただ、クリスタPROの方だとどちらにせよ、長い本格的なアニメはできない。。。。

EXとPROの違いってどんな?については下記のページ参照↓

PRO をすでに所有してる人は優待価格でEXに簡単にアップグレードできる↓

でも、『LINEアニメーションスタンプを作りたいだけ』、という場合や、『長尺必要ない!』って方ならPROでも24フレームまでならいけるのでとにかくやってみるといいのではないかなと…

“基本フレーム、演出フレーム、作画フレーム、余白” などについては下記で↓

♥2、クリスタ『アニメーション』制作の基礎

基本的に『動くイラスト』も『アニメーション』も枠の件以外、操作は同じ。

更に、現在私はクリスタPROからEXへアップグレードしてますが、基礎操作は同じ。

それらの基礎の基礎の部分について備忘録しておきたいと思います。

前回単純に『うごくイラスト』をやってみた最初の基礎編はこちらを参照↓ 

今回は “パート2” としてより細かく備忘録してみます。

スポンサーリンク

◆2−1、アニメーション新規作成
(演出フレーム・作画フレーム・フレームレートなどなど)

ファイル>新規>アニメーションでまずは最初の設定↓

アニメーション新規作成パネル

そう、上記に言いました通り、やや細かく設定できる

基本サイズや解像度などはうごくイラストでも設定できます。。

解像度に関しての詳しくは下記のページの、
❤︎1、そもそも画素とかピクセルとか解像度とかdpiとかppiって何?
を参照ください↓

で、一番ここでわかりづらいのは、演出フレームなどです

これは動画など、アップするサービス、媒体によって、縦横比などは結構違うのでそれに対応するためのフレーミング、あたり?のりしろ?トリム?てきなものと言っていいと思う

つまり、

各フレーム
  • ❶基準フレーム
    ムービーを出力するときの出力範囲
  • ❷演出フレーム
    再生する環境により表示される範囲は異なる場合も多いので、どの環境でも表示ささせるための範囲として設定する
    ※必ず見せたい部分はこのフレーム内に描く
  • ❸作画フレーム
    描画をする範囲で、大きめに作成できる
    (※端いっぱいまで描きたい場合など)
  • ❹余白
    基準フレームや作画フレームの予備の領域

実際に何かに応募するなどの場合はその応募基準に合わせる必要が当然あるし、

YouTubeなども結構横長なのでそのあたりは合わせるといいかもですね…

最初はここを細かく設定しなくとも出来るので必要性に駆られたら活用すればいいかなと。。。

で、

『うごくイラスト』同様にフレームレートを設定しておく(後で変更できる)

おさらいになるけれど、、、

ここは重要なとこなので何回も書きますw

*フレームレート(fps)とは、============
アニメを動かすために、1秒間で表示できる画像の数
例えば24に設定した場合、1秒につき24枚の画像(セル)を使える
(クリスタPROの場合つまりトータル1秒になる)

クリスタPROの場合、最大24フレームまでなので、
フレームレートを4に設定した場合は 1秒に4枚なので、トータル6秒
フレームレートを6に設定した場合、トータル4秒のものになるってこと

=====================

で、これは後で再生させてチェックしてみると見え方の速さ、遅さなどしっくりこない場合も多い

でもフレームレート数全体のフレーム数などは変更できるので大まかに設定しておいて、後で微調整するのもいいと思う。

※ただ、LINEアニメーションスタンプなど、何か目的が明確な場合はそれぞれ規定があるのでそれに沿った設定でやる必要がある。

変更の仕方は、(これもおさらいになるけど)

◆フレームレートの変更 ↓

アニメーション>タイムライン>フレームレートを変更でできる
(タイムラインパネルの左上の三角のタブからも行ける)↓

07_アニメーション_タイムライン_フレームレートを変更
タイムラインからフレームレート変更

新規設定の各内容詳細はこちらにもある
▶︎CLIP STUDIO PAINT ユーザーガイドHome > メニュー > ファイルメニュー > 新規 > 新規ダイアログ(アニメーション)【PRO/EX】

◆タイムライン設定の変更 ↓

更に、上図のように、『フレームレートを変更』の上の項目に『設定変更』があり、そこで最初に設定した内容を変更することもできる。

フレームレートを増やせば1秒で使うフレーム数(コマ数)は増やせるけど、

最初に設定したトータルの終了フレーム以上にすると当然おかしなことになりますよね笑。

そんな場合も、先にトータルフレーム数を設定し直してからフレームレートを設定し直せる。

アニメーション>タイムライン>設定変更 でできる↓

タイムライン設定変更

      ↓

終了フレーム数の数値で変更もできる↓

設定変更

その他、区切り線や開始フレームなどなども変更できる↑

フレームレート・秒数を頭に入れつつ設定してみるといいかなと。。。
(上図の25は中途半端なんでアレです..気にしないでくださひ笑)

◆2-2、アニメーションフォルダ・レイヤーフォルダ

設定ができたら、それぞれのセルをタイムラインに割り当てなきゃ描けないのですが,,

その前に、今回は『アニメーションフォルダ』や『レイヤーフォルダ』をまず理解しておきたい。

*アニメーションフォルダとは、

  • イラストを動かすために描くためのセル(レイヤー・レイヤーフォルダなど)を格納、管理するためのフォルダのこと
  • アニメーションフォルダの中は動的なものを順に入れ、管理する
  • アニメーションフォルダ内の各画像(セル)は、1枚1枚を同時に表示はできない

*レイヤーフォルダとは

  • レイヤーを格納・管理するフォルダ
  • レイヤーフォルダは1つのセルとして認識させられる
    →(1フォルダで1カット)
    →(レイヤーフォルダ内の各レイヤーは、通常のイラストを描くのと同じで、同時に表示できる
  • レイヤーフォルダの中で、輪郭、塗り、などレイヤーを分けたい場合に便利
アニメーションフォルダー・レイヤーフォルダー

例えば、
1カットごとに下書きレイヤー、輪郭線ベクターレイヤー、塗りレイヤーとかしたい場合、

アニメーションフォルダの中にレイヤーフォルダを作れば、

その複数のレイヤーを含んだレイヤーフォルダ1フレーム(1カット)にできる。

◆2-3、タイムライン割り当て

上記のフォルダをざっと設定したら、先にタイムラインに割り当てる必要がある

割り当てないと描けない(ペイントできない)

ウィンドウ>タイムラインで表示できる↓

クリスタタイムラインパレット表示

表示できたら、各フレームにセル(各カット)を割り当てる
(割り当てたいフレームの位置で右クリックして、割り当てたいセル番号、またはレイヤーフォルダ番号を選択して割り当てられる)↓

タイムラインにセルを割り当て
タイムライン

その他、背景をしっかり描いてその上にうごく人を描きたいなどの場合も便利。

アニメーションフォルダを背景用としてもう1つ作って、その中に『レイヤーフォルダ』を作り、

そのレイヤーフォルダ内に通常のように複数のレイヤーを使って背景を描き、ずっとその背景を流しとくことなどできる。

背景を何回も描く必要はなく、その背景レイヤーフォルダが入ったアニメーションフォルダのタイムライントラックを、表示させておきたい位置まで伸ばせばOK.

    ↓

01_タイムラインでアニメーションフォルダトラックを追加↓

01_タイムラインでアニメーションフォルダ追加

02_背景の場合一番下の階層に設定する
(アニメーションフォルダトラックを下へドラッグ)↓

02_アニメーションフォルダを下へドラッグ

03_レイヤーパネルで、レイヤーフォルダ・各レイヤーを追加↓

03_フォルダとレイヤー作成

     ↓

05_タイムラインに割り当てる

04_タイムラインで割当てる
❶タイムラインアニメーションフォルダトラックの、割当てたいフレーム位置で右クリック
❷割当て選択できるパネルが立ち上がる
❸割当てたいレイヤーフォルダ名を選択 ↓

04_タイムライに割り当てる

割り当てるとそのレイヤーに描画できるようになる。
(割当ててなかったり、描くレイヤーやフレームを選択してないと描けない)

その背景を表示させたい位置まで伸ばすだけでずっとその背景を表示させられる。
(トラック最後の上部にカーソルを置くと伸縮できるカーソルが表示されるので伸ばしたり短くしたりできる)
          ↓

07_タイムライン伸ばす

更に、その背景用のアニメーションフォルダをタイムラインで『カメラワーク設定』して移動・拡大などなどを、

キーフレームで編集すれば、新たに描くことなく背景を動かすこともできる。↓

キーフレームでカメラワーク設定

背景とメインのアニメーションフォルダを分けて、背景を上記のやり方で動かしてみたやつ。
(背景は1カットのみ描いてキーフレーム&カメラワーク設定だけで動かしてみたやつ。※メインは動きの1カットづつ描いてるけど..しかもまだ途中w)
   ↓

◆2-4、アニメーションパレット・オニオンスキン

アニメーションセルに描く時に、他のセル(レイヤー)や画像ファイルを参照しながら描いたりできるようにこれで設定できる。

アニメーションセルパレット
『編集対象セル』に描きたいセル配置して『セル固有ライトテーブル』や『キャンバス共通ライトテーブル』に参考にするセルを読み込んで登録して描ける↓

アニメーションセルパレット
アニメーションセルパレットを使う

アニメーションセルパレットについてはこちらにもある
▶︎CLIP STUDIO PAINT ユーザーガイド>アニメーションセルパレット

また、

タイムラインの上部バーにある、“オニオンスキン有効化” タブをクリックすれば、単純に前後のセルを見ながら描ける↓

オニオンスキンの有効化

で、最後、割り当て、速度などをチェック

こちらもなんとなく把握できる
▶︎CLIP STUDIO PAINT アニメーション製作ガイド|創作活動応援サイト『CLIP』

OKならGIFアニメや、ムービーとして書き出しw

下のGIFは目の動く部分とその他の部分にアニメーションフォルダトラックを分けて初めて練習してみた時のやつ 笑笑。。。。。↓

ぱちくり

ザツすぎてびっくりですねぃ笑…….

ま、先は長いですがアニメーションと言えるものも作っていきたいとはおもっておりますw

うごイラ

フレーム数を省略してサボるとカクカクな動きになるよ!笑 ↓

なおんニコリん
nyanparari
アコギネック折れたGifアニメ

アニメーションできるソフトも今の時代たくさんあるけど、クリスタもかなり時短できる機能があり、しかもベクターレイヤーとラスターレイヤーを併用できるので、ヤル気あれば本格的な制作も可能。。。

で、クリスタはその『種類』と『購入の仕方』で『値段が違います』。クリスタ全種類・全部の購入方法の違いなどを知りたい方は下記の内容を参照ください↓

ってことで

楽しいクリエイトあれ!

しゃらんるあぁあああああああ❤︎

\(`^`)b

スポンサーリンク

 

REACH_rh.jam project / Creative Support
REACH_rhがあなたのクリエイトをサポートします
サポート内容をチェックしてみる ↓

rhjampj_v-min

 

❤色々やり散らかしております、宜しくどうぞ御贔屓に<(_ _)><(_ _)><(_ _)>

Twitter-REACH_rh Facebook-REACH_rh G+ -REACH_rh Insta-REACH_rh note-REACH_rh

YouTube-REACH_rh SoundCloud-REACH_rh PIXIV-REACH_rh CREATORS BANK_REACH_rh

関連コンテンツ

Pocket