動画チュートリアル：Figmaのバナーデザインにカスタムアニメーションを追加する

Bannerifyプラグインを使って、バナーにカスタムキーフレームアニメーションを追加する方法を解説した動画です。

Easingメニューから項目を選ぶと、アニメーションに付けるイージングの種類を選べます。イージングはタイムライン全体に自動で適用され、Live previewエリアも更新されるので、選んだイージングでキーフレームアニメーションの動きがどう変わるかを確認できます。

選べるイージングは次のとおりです。

• Ease (Default)
• Ease out
• Ease in
• In and out
• Linear
• Gentle
• Overshoot
• Anticipate

カスタムのCubic Bezierイージングを設定する

動画チュートリアル：Figmaでバナーアニメーションにcubic-bezierイージングを追加する

Bannerifyプラグインを使って、Figmaのバナーアニメーションにカスタムのcubic-bezierイージングを追加する方法を解説した動画です。

独自のカーブを使うには、Easingメニューでカーブのハンドルをドラッグするか、プリセットの下にあるフィールドに有効なCSSのcubic-bezierの値（例：cubic-bezier(0.65,0.05,0.36,1);）を貼り付けます。カスタムのcubic-bezierカーブは、https://easings.co/のようなサイトや、CSSのcubic-bezierカーブを生成できるお好みのWebサービスを使って作成できます。