Windows アプリのモーション

Fluent モーションはアプリで目的を果たします。 これは、ユーザーの動作に基づいてインテリジェントなフィードバックを提供し、UI にアクティブな印象を与え、アプリ内でユーザーのナビゲーションを誘導します。 Fluent モーションは、ユーザーとそのデジタル エクスペリエンス間の感情面の結び付きを生み出します。 マイクロソフトでは、ユーザーが既に現実世界から認識している自然な動きの基盤のうえに構築し、そこからシステムを拡張します。

例

WinUI 2 ギャラリー アプリがインストールされている場合、こちらをクリックしてアプリを開き、モーションの動作を確認してください。 WinUI 2 ギャラリー アプリ (Microsoft Store) を入手する ソース コード (GitHub) を入手する

Fluent モーションの原則

運動能力

移動中のオブジェクトは、現実世界のオブジェクトの動作を示します。流動的で応答性の高い動きにより、エクスペリエンスが自然に感じられ、感情のつながりが生み出され、パーソナリティが追加されます。

タッチで UI を操作すると、UI の動きが、操作の速度に直接関連します。 また、タッチは直接操作であるため、操作するオブジェクトが周囲のオブジェクトに影響します。

機能

モーションは目的を果たし、確信があります。 複雑さに関してユーザーをサポートし、階層を確立する手助けをします。 モーションは、パフォーマンスが向上した印象を与え、体感する待ち時間を隠蔽することでユーザー エクスペリエンスを最適化します。

ページ切り替えは、目的に特化されています。 ページが相互に関連する方法に関するヒントを提供します。 パフォーマンスが最適でない場合でも速く感じられるような方法で移動します。

継続的

ポイントからポイントへの流動的な移動は、自然に目を引き、ユーザーを導きます。ユーザーのタスクを洗練された方法で組み合わせ、より使いやすくフレンドリーなものにします。

オブジェクトは、シーン間を移動したり、シーン内でモーフィングして継続性を提供し、ユーザーがコンテキストを維持できるようにします。

コンテキストに応じた判断

インテリジェントなモーションは、UI を操作する方法に沿った方法でユーザーにフィードバックを提供します。 対話式操作はユーザーが中心になっています。この動きはフォームファクターに適しており、シナリオを中心に設計されています。ユーザーごとに快適である必要があります。

アニメーションはユーザーの操作に沿ったものである必要があります。 コンテキスト メニューは、ユーザーがアクティブ化したポイントから展開されます。

モーションの記事