【XD】グローバルナビゲーションのホバーアニメーション

【XDでボタンのホバーアニメーションする方法】で紹介した作業と同じです。

あわせて読みたい

【XD】ボタンのホバーアニメーション この記事では、XDで作れるボタンのホバーアニメーションの作成方法をご紹介します。 ディレクターへのデザイン確認やコーダーへの指示に細かい説明が必要なく、直感的に仕様を伝えられるのでとても便利な機能です。

右クリックでメニューバーから設定するか、ショートカット　macOSは⌘＋K、WindowsはCtrl＋Kで設定してください。

その後も同じく、右側のサイドバーのコンポーネントからホバーステートで設定します。

作業中は、コンポーネント内に作成できているかどうかを確認しながらやると、失敗しません。

ホバーステートが完成したら、左上のメニューバーからプロトタイプを開き、初期設定のステートをアクション設定します。

トリガーはホバー、移動先はホバーステートになっていることを確認してプレビューを見てみましょう。