ボールのバウンド

このSTEPで学ぶこと

アニメーションの定番題材「バウンドするボール」を描きます。 ボールは落ちるときスクワッシュ（つぶれる）し、跳ね上がるときストレッチ（伸びる）します。 この2つの変形を5枚のフレームで表現しましょう。

「スクワッシュ＆ストレッチ」はアニメーションの12原則の中でも最も基本的な技法です。 ここで one cut note の基本操作（フレームの追加・切り替え・書き出し）を習得することも目標です。

完成イメージ

5フレームのバウンドボール（スクワッシュ＆ストレッチあり）

フレームとタイミング

頂点で長め（4コマ）、着地は短く（1コマ）するのがポイントです。 すばやい着地と長い滞空時間でボールらしい動きになります。

F5の次はF2から繰り返されます（F5=F1と同じ位置のループアニメーション）。

※ 1コマ ≈ 42ms（24fps基準）　合計13コマ（≈542ms）

実習手順

1. キャンバスを開きフレームを5枚用意する

   「+」ボタンでフレームを4回追加します。スライダーで各フレームに切り替えながら描きます。

2. F1（頂点）を描く

   ボールがいちばん高い位置にある状態です。丸い形で描きましょう。

3. F3（着地・スクワッシュ）を描く

   地面に触れた瞬間です。ボールを横に広く・縦に短くつぶします。丸じゃなくて楕円形にします。

4. F2（落下中・ストレッチ）を描く

   F1とF3の中間の高さに、縦に少し長くしたボールを描きます。

5. F4・F5を描く

   F4はF2の上昇バージョン（縦長）。F5はF1と同じ頂点の位置（丸）。F5がF1と同じ見た目になるとループアニメーションになります。

6. コマ数を設定してプレビューを確認する

   タイムラインのコマ数ステッパーで F1=4コマ、F3=1コマ、F5=4コマ、F2・F4=2コマに設定します。再生ボタンで確認しましょう。

7. 書き出す

   APNG または GIF でダウンロードして、ブラウザで動きを確認します。

自己評価チェックリスト

AIで答え合わせ（任意）