デジタルでお絵描きした事がある人はいても、アニメーションを作った事がある人は少ないのではないでしょうか?

そもそもどうやって作ったらよいのか、全然わからないという方がほとんどだと思います。

このサイトの2Dイラスト、アニメーション素材は自分で制作しているので、

やった事が無い人の為にアニメーションの作り方を教えたいと思います。

最終的にはGIFアニメーションにして、自分のブログに貼ったり、メールに添付したり、デスクトップに貼る事も出来るようになりますよ!

基本的な2dアニメーション制作。

アニメーションとは、絵がある一定の時間表示されて、次の絵に入れ替わる。それが連続して起こる事でまるで動いている様に見える“動く絵“です。

それでも「えっ。全く何したらよいか分からない」と言う人も多いと思います。

アニメーションは、動かしたい動きの中で、大事なポーズを抜き出してつなげる事です。

だから、まず、大事なポーズを決定します。

今回は、ワンちゃんが敬礼するアニメを作りましょう!

Kritaのインストール

まず、まだな人はKritaをインストールしてください。

Photoshopフォトショップに勝る、無料ソフトKritaクリタ を参照

完全フリーのお絵描きのソフトです。完全無料ながら、実力的には大御所、Photoshopに勝るとも劣らないと言って良いでしょう。

大丈夫です。オープンソースなので、ダウンロード/インストールしても、変なウィルスや宣伝ソフトが付いてきたりしません

Windowsオペレーションだったら、PCでもSurfaceでも動きます!

スポンサーリンク

実際に作ってみる

さて、まずKritaを開いた時の最初の画面はこんな感じ。

敢えて日本語版にしています。

少し違っても大丈夫です。直しますから。

そしたら、上のメニューから、

ファイル - 新規

今回は512ピクセル x 512ピクセルで行きましょう。

図のようにすると、画面に白い正方形の画面が出てきたと思います。

ちなみに、この画面を動かすには、マウスの真ん中ボタンでクリック&ドラッグ

大きさは、 マウスの真ん中ボタン のウィールを回す事で出来ます。

*マウスにウィールが付いていない人は、画面右下のスライダーか、右クリックして出てくるポップアップの下にあるスライダーで操作する事が出来ます。

少しだけ、画面のレイアウトが違う人、

左上のボタンをクリックすると、

プルダウンメニューが出てくるので、アニメーションレイアウトを選びます。

そうすると今のレイアウトになります。

左のレイヤーウィンドウで、Backgroundの上に「レイヤー 1

が出来てて、それがハイライトされてるのを確認したら、(ハイライトされていない場合はクリックして)

もし、レイヤーが無かったら、下の丸で囲んだ+マークを押して、レイヤーを挿入してね。

上の格子状のボタン、ツールボックスからペンを選んで

上の赤い円で囲まれた、格子状のボタンを押すと、ペンのパレットが出てきます。

ひとまずは下書きなので、この黄色の万年筆で描きます。(好きなペンを選んでもらって良いですよ)

あ、頻繁に

ファイル – 保存 もしくは

ファイル – 名前を付けて保存を忘れないで!

下のタイムラインの、オレンジ色で囲まれたところを右マウスボタンでクリックすると、プルアップメニューが出るので、その中から

Create Brank Frameを選んでください。(この辺はまだ日本語対応していないのですね。)

これで、“フレーム“をこのレイヤーに与える事が出来ます。(アニメーションと言うのは、一秒間に(ここでは)24フレームが連続して映る事で動いているように見えます。ここで、1/24の絵を与えたと言う事です。)

これで、このレイヤーは“アニメーション”を扱うレイヤーとなったのです。

いよいよ絵をかきましょう。

そうしたら、絵を描いていきましょう。

今回は、犬が敬礼する所を作るのでしたね。

そしたら、犬が“直れ”をしているポーズと、“敬礼”をしているポーズを基本ポーズにしましょう。 - これを”Key pose”“キーポーズ“と言います。

絵に満足したら、フレーム10まで進めて、キーボードの”Delete”ボタンを押してください。

絵が消えてしまいました!

でも安心してください。

画面下、タイムラインの「レイヤー1」の横にあるいくつかのアイコンの中で、一番右の電球マークをクリックしてください。

Voila!

0フレームに描いた絵が違う色で表示されましたね!

これは前後の絵を見る事の出来る機能です。

左下にある、アニメーションタブの中の、玉ねぎのマークのボタンを押してください。

そうすると、アニメーションタブの隣に、「前後フレームの表示」と出てきます。

このタブをクリックすると、

こんな棒グラフみたいのが表示されます。

これは、英語でOnion Skin(玉ねぎの皮)といって、日本語で言うと、「トレス機能」の事です。アニメーションでは、紙を何枚も重ねて、下からライトテーブル等で光を当てて、透かして、前後のフレームを見て絵を描くのです。

この棒グラフをいじると、何フレーム前後ろまで、どの位の透明度で透かしたいか設定できます。

そしたら、犬が敬礼した絵を描きましょう!

そうしたら、もう一度アニメーションタブに戻り、

開始フレームと、終了フレームがあるのを確認してください。

その終了フレームを24に代えてください。

はい。そしたら、再生ボタンを押して。

はい。

とても基本的なアニメーションが出来上がりました!

初心者向けKrita(無料)を使った2dアニメーション講座:02 タイミングと中割り

四足歩行(犬)のアニメーションを制作する。その1、足と重心。Kritaで作る2dアニメ

スポンサーリンク
おすすめの記事