SeedProd ドキュメント

SeedProd のドキュメント、リファレンスマテリアル、チュートリアル

アニメーション効果

アニメーション効果機能を使用すると、ページ上の任意のブロック、セクション、行、または列に入場アニメーションを追加できます。アニメーションが適用された要素が訪問者のビューポートにスクロールインすると、選択したアニメーションが再生され、デザインに動きと視覚的なエンゲージメントが追加されます。

SeedProdアニメーション効果で利用可能な入場アニメーションオプション

アニメーションの追加方法

  1. アニメーションを適用したいブロック、セクション、行、または列をクリックして、設定パネルを開きます。
  2. 詳細タブをクリックします。
  3. アニメーション効果セクションを展開します。
  4. ドロップダウンメニューから入場アニメーションを選択します。
  5. 変更を適用するには、保存をクリックします。

利用可能なアニメーション

SeedProdには、次のグループに整理された46種類のアニメーションが含まれています:

注意を引くアニメーション

バウンス, フラッシュ, パルス, ゴムバンド, シェイクX, シェイクY, ヘッドシェイク, スイング, ただ, ワブル, ゼリー, ハートビート, バウンスイン, フリップ, フリップインX, フリップインY, ライトスピードインレフト, ライトスピードインライト

バックイン

バックインダウン, バックインレフト, バックインライト, バックインアップ

フェードイン

フェードイン, フェードインダウン, フェードインレフト, フェードインライト, フェードインアップ, フェードインダウンビッグ, フェードインレフトビッグ, フェードインライトビッグ, フェードインアップビッグ, フェードイントップレフト, フェードイントップライト, フェードインボトムレフト, フェードインボトムライト

ズームイン

ズームイン, ズームインダウン, ズームインレフト, ズームインライト, ズームインアップ

回転

ローテートイン, ロールイン, ローテートインダウンレフト, ローテートインダウンライト, ローテートインアップレフト, ローテートインアップライト


アニメーションは、ページ上の任意の要素に個別に適用できます。セクションやブロック間で異なる種類のアニメーションを組み合わせて、訪問者がページをスクロールする際にダイナミックでレイヤードな感覚を作り出します。

関連記事