プロトタイプアニメーション – Figma Learn - ヘルプセンター

はじめに

この機能を使用できるユーザー

編集可アクセス権があれば、ユーザーはプロトタイプを作成できます。

プロトタイピングの概要については、プロトタイピングの開始ガイドをご覧ください。

アニメーションはスムーズなページ間のトランジションの作成に使用され、メニューの展開、ページ間のスワイプ、ギャラリーを開く場合などのアクションの動作を定義します。

即時

即時トランジションは、ホットスポットを操作(クリック、マウスカーソルを合わせる、押す)すると移動先フレームが直ちに表示されます。

ディゾルブトランジションは、元のフレームの表面で移動先フレームにフェードインします。

サポート機能:

スマートアニメートは複数のフレームに存在するマッチングレイヤーを探します。マッチするレイヤーについて、何が変化しているかを認識し、トランジションを適用してフレーム間でシームレスに切り替わります。

サポート機能:

ムーブトランジションは、元のフレーム上で移動先フレームをビューの中にまたはビューから外にスライドします。

サポート機能:

プッシュトランジションは移動先フレームがビューに入ってくると同時に元のフレームをプッシュアウトします。スワイプジェスチャーの再現に最適のトランジションです。

サポート機能:

スライドは移動先フレームをビューの中にまたは外に移動します。ムーブでは元のフレームは移動しませんが、スライドではフレームがディゾルブしながらゆっくりオフセットします

サポート機能:

ヒント! プロトタイプイージングとばねアニメーションカーブでアニメーションをユニークで自然な感じにしましょう。