Procreateで描いたネコをなめらかに動かす！
レイヤー設定のコツ
アートスクールオンライン講座 イラストレーション講師の森末です。
皆様、ご自身の描いたイラストを動かしてみたい！でもアニメーションは少し難しそう…と思われたことはないでしょうか？
今回は、私が担当をさせていただいている講座、「Procreateを使いこなそう！」で使用しているiPadアプリ、Procreate（プロクリエイト）で、ご自身の描いたイラストをなめらかに動かす方法をご紹介していきます。
1.Procreateとは
Procreate（プロクリエイト）とはデジタルアートイラスト制作のために特化した高機能なアプリで、イラストレーションだけでなくアニメーション作成にも非常に便利なアプリです。
イラスト、絵画、デザインなど、多様なアート表現を直感的にできるため、初心者からプロフェッショナルまで幅広いレベルのアーティストに支持されています。
Apple Pencilを使い直感的に操作をすることが可能で、レイヤー管理・色選びなどをスムーズに行うことができるため、初心者でも抵抗なく使い始めることができます。
加えて、豊富なブラシ機能など多くの高度な機能が備わっているため、プロフェッショナルなデジタルアートイラスト制作ユーザーにとっても魅力的なアプリです。Procreateは数百種類のプリセットブラシを備えており、さまざまな質感や効果を表現することが可能です。繊細な毛並みや、独特の質感を描くためにカスタマイズできるブラシも多く、特に動物イラストを描く際にはその表現力が大きな武器になります。
今回は基準となる動物（ネコ）キャラクターのイラストを1枚作成し、アニメーションを作成していく方法をご紹介します。
2.動物キャラクターを描くための基本レイヤー設定
こちらが今回使うイラストです。
・ネコを瞬きさせる
・尻尾をうごかす
の二つの動きをつけていきます。
最終的にはこのようになります。
3.Procreateのイラスト制作手順①レイヤーの整理
アニメーションに加工をしやすいように、大きく以下3つのレイヤーを作成します
・前景
・基準のネコレイヤー
・背景
基準のネコのレイヤーはこの後アニメーションで動きをつける為に、動かしやすいようレイヤーを分割しておきます。
今回は両目の瞬き・尻尾動かす動きのため、目と尻尾は別々のレイヤーに分けておきます。
4.Procreateのイラスト制作手順②アニメーションアシストの設定
画面上部の「アクション」メニュー（レンチアイコン）をタップし、「キャンバス」タブを選択します。
「アニメーションアシスト」をオンにすると、」てタイムラインが表示され、アニメーション作成のためのツールが使用可能になります。
5.Procreateのイラスト制作手順③前景・背景のレイヤー設定
何も設定をしていない状態だと、このように１つづつのレイヤーのかたまりが、１コマと設定されます。
このままの状態だとフレームが
（1コマ目）背景→（2コマ目）ネコのイラスト→（3コマ目）前景
と動くことになります。
※前景は画像では「調整レイヤー」と表記
今回のイラストだと、背景と前景は動かしたくない為、背景と前景は固定します。
背景の設定
一番手前にあるレイヤーをタップ「フレームオプション」の背景をオンにします。
前景の設定
一番後ろにあるレイヤーをタップ「フレームオプション」の前景をオンにします。
6.Procreateのイラスト制作手順④ネコの描画とフレームの作成
（1）フォルダを複製する
「ネコ１基準」のフレームを複製し、複製をしたフレームを加工し動きを作っていきます。
「ネコ１基準」のフォルダを左にスライド、複製をタップすると、フォルダの複製ができます。
わかりやすいようにフォルダ名を変えておきます。
（2）「ゆがみ」機能でなめらかにまぶたを動かすコツ
まぶたを動かす為に「目 上」のレイヤーをゆがませていきます。
「目 上」のレイヤーをタップで選択し、
画面上部の「アクション」から調整アイコンをタップし、「ゆがみ」を選択します。
「目 上」のレイヤーを少し下向きに歪ませていきます。
この時、「目 上」のレイヤーと「ネコ」のレイヤーに裂け目ができてしまうとアニメーションになった時に違和感が出るので注意してください。
「目 下」も同じ要領で上に向かって歪ませていきます。
まぶたを動かす時、少しだけ周辺も連動して動かすと、より自然に見えます。
今回は目を閉じるのと一緒にネコの頭部の上を下向きに、鼻先を上向にゆがませてみました。
（3）「ワープ」機能で尻尾を滑らかに動かす
今度は尻尾を動かしていきます。
「尻尾」レイヤーをタップして選択します。
画面上部の「アクション」から変形（矢印アイコン）をタップします。
なめらかに動かす為にワープを使用して変形していきます。
この時、尻尾がどんな風に動くか意識して動かしていきます。
前のフレームから少し動かすと、オニオンスキン機能で前のフレームを確認することができます。
オニオンスキンは色や不透明度、表示枚数をアニメーションの「設定」で調整できるので、見やすいように調整してみてください。
フォルダの複製、変形の作業を繰り返していきます。
7.Procreateのイラスト制作手順⑤アニメーションのプレビューと調整
（1）アニメーションのプレビューして確認する
タイムラインの「再生」ボタンをタップして、現在のアニメーションをプレビューします。
（2）フレームの調整してスムーズな動きにする
プレビューを見ながら、必要に応じてフレームを追加、削除、または調整して、ネコの動きをよりスムーズにします。
アニメーションの「設定」でフレームを1秒間に表示されるフレームの数を調整できます。
数が少ないほど、カクカクした動き、数が多いほどなめらかになります。今回は“5”にしました。
再生の方法も「設定」から変更できます。
再生方法は３つあります。
ループ
アニメーションが最後のフレームに達すると、最初のフレームに戻って再生を続けます。
ピンポン
アニメーションが最後のフレームに達すると、逆再生を開始します。最初のフレームに戻ると再び通常再生に戻ります。
ワンショット
アニメーションが最後のフレームに達すると再生が停止します。
基本の設定はループですが、今回はフレーム作成をできるだけ減らしたかったのでピンポンを使用しました。
ピンポンを使用すると、目を閉じる動作を逆再生され、フレームを新しく作らなくても目を開ける動作になります。
尻尾の動きも同様に新しくフレームを作らなくても動きを増やすことができます。
ただ、動きによっては不自然になるので、一度再生してそのアニメーションに合ったものを選択してください。
8. アニメーションのエクスポート
アニメーションが完成したら、「アクション」メニュー（レンチアイコン）を開き、「共有」タブを選択します。
「アニメーション」セクションから、アニメーションGIF、 アニメーションPNG、アニメーションMP4、などの形式でエクスポートできます。
9．動物のイラストを描く際のポイント
動物イラストを描く際には、ただ見たままを描くだけでなく、動物特有の構造や背景との調和を意識することが重要です。自然な表現や生き生きとした仕上がりを目指すために、以下のポイントを押さえましょう。
（1）動物の構造や動きを理解する
動物のリアルなイラストを描くには、まずその構造や動きについて理解することが大切です。
たとえば、動物の骨格や筋肉の構造を意識すると、ポーズや表情に説得力が増します。
動物には種類ごとに特有の身体の形や筋肉の付き方があり、それが動きにも影響します。
例えば、ネコのしなやかな体のラインと、犬の力強い骨格や筋肉の付き方は異なります。
これらを意識して描くと、動物の「らしさ」を表現しやすくなるのです。
また、動物の自然な動きも観察しておくと良いでしょう。
鳥が飛び立つ瞬間や、魚が泳ぐ姿勢、馬が走るときの脚の位置など、特定の動作を捉えるときには、その動きが持つリズムや動作の特性を掴むことが重要です。
動画や写真を参考にしたり、スケッチを重ねたりすることで、動物の身体の仕組みを理解し、より動きのあるイラストを描けるようになります。
（2）背景との調和を意識する
動物イラストに背景を加える際は、動物と背景が自然に調和するように工夫しましょう。
背景は動物を引き立たせたり、全体の雰囲気を高めたりする役割を持つため、色合いや構図に注意が必要です。
まず、背景の色や動物がいる環境（森、草原、水辺など）に合わせた色や質感・奥行等を意識することで、イラストに深みとリアリティが生まれます。
10．おわりに
今回は、Procreateでのアニメーションの作成方法の1つをご紹介しました。
すでにProcreateでイラストを描いている方なら、気軽に試せる方法だと思います！ぜひ一度ご自身のイラストを動かしてみてください。
前景にあった蛍も動かしてみました。
「Procreateを使いこなそう」ではこのようなアニメーションの作成方法も学んんでいただけます。
デジタルアートを描けるお絵かきソフトは多くありますが、Procreateは比較的安価で操作しやすいため初心者向けでもありますが、各種機能が奥深く、多様な表現が可能なため上級者も満足できるデジタルイラストレーションアプリです。
当講座ではProcreateの使い方がまだよくわからない、イラストの表現方法を知りたい、など、その方の目的に合ったカリキュラムを学んでいただくことができます。
Procreateアプリを使用したイラストの描き方や技術を基礎から学びたい方や、高度な機能を利用してイラストやアニメーションを作ってみたい、イラストレーターを目指したい、副業を考えている、SNSの投稿コンテンツをブラッシュアップしたい、趣味として楽しみたい等、目的に応じてレッスン可能です。
マンツーマンのオンラインレッスンで画面共有しながら丁寧に、受講生様のペースに合わせて指導いたしますので、少しでも気になった方は是非一度、無料体験から試してみてください！
森末 麻利
- Profile
- デジタル使用ソフト
iPad、Procreate、CLIP STUDIO PAINT、Illustrator
美容関係会社のPRイラストや、
LINEスタンプ販売など
イラストレーターとして活動中
- ArtWorks
-
