透明さと鮮やかさ
macOS アプリは、ビューとコントロールが背景にあるコンテンツを示唆できるようにすることで、半透明性とぼかしを使用して奥行き感を呼び起こします。また、明暗のテクニックの注意深いバランスを使用して前景色と背景色を動的にブレンドする微妙な効果である鮮やかさも使用します。この組み合わせは、前景のコンテンツを背景に対して際立たせるのに役立ちます。
ダーク | ライト |
鮮やかさに備えてください。 メニューなどの一部の要素はデフォルトで鮮やかであるため、鮮やかさはすべてのアプリに影響します。鮮やかなビューが表示されないアプリも含まれます。
必要に応じて、あなたのアプリの鮮やかさを有効または無効にします。 システムビューとコントロールは、それらの構成とシステム設定に基づいて自動的に鮮やかさを取り入れます。カスタムビューとコントロールの場合、鮮やかさを許可するかどうかを選択します。鮮やかさを有効にした状態でビューがどのように見えるかを確認し、必要に応じて採用します。
システムが提供する要素と色を優先します。 一部のビューでは、それらの色に基づいて動的に鮮やかさを与えることができます。たとえば、ラベルの色が [ラベルの色] または [二次ラベルの色] に設定されている場合、ラベルは鮮やかさを使用します。関連するガイダンスについては、ラベル と システムカラー を参照してください。
ダーク | ライト |
テンプレートイメージを使用します。 サイドバーやメニューなど、背景が半透明のビューで使用すると、フルカラーイメージの背景とのコントラストが不十分になり、位置がずれて見える場合があります。関連するガイダンスについては、カスタムアイコン を参照してください。
ヒント
半透明さと鮮やかさには、ビュー階層に視覚効果ビューが存在する必要があります。開発者向けガイダンスについては、NSVisualEffectView (NSVisualEffectView) を参照してください。
背景ブレンドモード
システムは、背景コンテンツをブレンドする 2 つの方法を提供します。
ウィンドウの後ろのブレンド。 このブレンドモードでは、ウィンドウの背後にあるコンテンツが透けて見えます。メニュー、シート、サイドバーテーブルなどの一部のインターフェイス要素は、このモードを自動的に採用しますが、必要に応じて無効にすることができます。
ウィンドウ内ブレンド。 このブレンドモードは、ウィンドウに存在する要素によって採用され、要素の背後にあるウィンドウコンテンツが透けて見えるようにします。多くの場合、ツールバーはこのモードを実装し、ツールバーの下をスクロールするウィンドウコンテンツを示唆します。
開発者向けガイダンスについては、NSVisualEffectBlendingMode (NSVisualEffectBlendingMode) を参照してください。
マテリアル
システムが提供するマテリアルは、あなたのインターフェイスに適用される半透明、ぼかし、および鮮やかさの量を定義します。システムはあなたが使用するための多くの標準的なマテリアルを提供し、それぞれが指定された目的を持っています。たとえば、ウィンドウ、メニュー、ポップオーバー、サイドバー、タイトルバー、その他多くのデフォルトの外観に一致するマテリアルが存在します。
意味のあるマテリアルを選択してください。 マテリアルの名前は、それらが使用されることを意図されている場所を反映しているため、意図された目的のためにマテリアルを使用してください。たとえば、カスタムヘッダービューにはヘッダービューマテリアルを使用します。
明るい外観
ダークな外観
システムマテリアルでシステムカラーを使用します。 システムが提供する色を使用する場合、さまざまなコンテキストで色が暗すぎたり、明るすぎたり、飽和していたり、コントラストが低く見えたりすることを心配する必要はありません。関連するガイダンスについては、カラー を参照してください。
開発者向けガイダンスについては、NSVisualEffectView (NSVisualEffectView) を参照してください。