Windows 11 の署名エクスペリエンス

  • [アーティクル]

署名エクスペリエンスは、Windows 11 で視覚言語を表現するために使用されるデザイン要素であり、Fluent エクスペリエンス全体で一貫性のある外観を備えています。

Several UI elements highlighting new geometry in Windows 11

ジオメトリ

ジオメトリは、画面の UI 要素の形状、サイズ、位置を表しています。 これらの基本的なデザイン要素は、デザイン システム全体でエクスペリエンスの一貫性を持たせるのに役立ちます。 Windows 11 の機能によってジオメトリが更新され、よりわかりやすく魅力的で最新のエクスペリエンスが実現されます。

A window and modal dialog in light mode on the left and dark mode on the right

色

色は、ユーザー インターフェイス要素間の視覚的階層と構造を示して、ユーザーがタスクに集中できるようにします。 Windows 11 では、落ち着きのある基本部分が用意され、ユーザーの操作性をさりげなく向上させ、必要な場合にのみ重要な項目が強調されるように色が使用されています。

An application window with a single content area

レイヤー化と昇格

レイヤー化とは、1 つのサーフェスを別のサーフェスに重ね合わせ、同じサーフェス内に複数の視覚的に区別された領域を作成する概念です。 Windows 11 では、アプリ階層の基本としてレイヤー化と昇格が使用されます。

A UI surface made of acrylic

素材

素材 は、UI サーフェスを実際の人工物に似せる視覚効果です。 Windows 11 では、UI と環境とのつながりを保つために素材が使用されています。 素材は表面に命を吹き込み、フォーカスがあるアプリケーションとないアプリケーションを際立たせるのに役立ちます。

A shopping cart icon

アイコン

アイコンとは、ユーザーがアプリを理解して移動するのに役立つ、一連の視覚的画像とシンボルのことです。 Windows 11 のアイコンは、デザイン言語と一緒に進化しています。 システム アイコン フォントのすべてのグリフは、より柔軟な配置と最新のメタファーを受け入れるよう再設計されました。

Several words rendered in Segoe UI Variable

タイポグラフィ

言語の視覚的表現である文字体裁において、何よりも重要な役割は情報を伝達することです。 Windows 11 書体システムを使用すると、コンテンツ内に構造と階層を作り出すのに役立ち、UI の読みやすさと読みやすさを最大限に高めます。

An animated image that shows several examples of motion in the Windows UI.

モーション

モーションにより、インターフェイスがユーザーの操作に対してどのようにアニメーション化して応答するかが表されます。 Windows のモーションは、反応的、直接的であり、状況に応じて変化します。 ユーザーの入力をフィードバックし、目的地まで分かりやすく誘導する配置の枠組みを強化します。