XCode 13.4 日本語化計画 : Human Interface Guidelines

システムのイメージ

macOS は、システム全体の一般的なアイテム、アクション、およびモードを表すために、大量のイメージのセットを使用します。文書化された意味に従ってこれらのイメージを一貫して使用すると、人々があなたのアプリをすばやく理解するのに役立ちます。

AppKit API を使用して特定のアイテム、アクション、またはモードを表すイメージを表示すると、あなたのアプリが実行している macOS のバージョンに適した形式でシステムが定義したイメージが自動的に取得されます。たとえば、あなたのアプリが macOS 11 以降で実行されている場合、システムは、アプリがコントロールボタンや自立型ボタンで使用できる SF シンボル を提供します。あなたのアプリが Catalina 以前で実行されている場合、AppKit は引き続き既存のイメージを提供します。開発者向けガイダンスについては、NSImage.Name を参照してください。

システムが定義する各イメージは、その外観ではなく、その意味に従って使用してください。 その意味でイメージを選択すると、イメージの外観が変わっても、あなたのアプリはシステムと視覚的に一貫性を保つことができます。たとえば、人々が左に移動できるようにするコントロールでは、「左に移動」 イメージを使用するのが理にかなっています。「左向きの三角形」 のイメージは「左に移動」のイメージと同じに見えますが、将来三角形の外観が変更された場合、ナビゲーションコントロールで使用すると混乱する可能性があります。

すべての意味のあるイメージに代替テキストラベルを提供します。 代替テキストラベル (またはアクセシビリティの説明) は表示されませんが、VoiceOver でスクリーン上に表示されている内容を音声で説明できるため、視覚障害を持つ人々のナビゲーションが容易になります。ガイダンスについては、アクセシビリティ > コピーとイメージ を参照してください。

あなたのニーズに合った、システムで定義されたものが見つからない場合は、カスタムシンボルまたはイメージをデザインします。 カスタムシンボルまたはイメージをデザインすると、人々があなたのアプリを使用するのに役立つ独自の詳細を伝えることができます。システムが定義するイメージを転用すると、混乱が生じる可能性があります。ガイダンスについては、グリフ を参照してください。

制御グリフ

制御グリフは、ツールバーやサイドバーでの使用に特に適しています。

イメージ(Catalina 以前)	SF シンボル(macOS 11 以降)	意味
actionTemplateName	ellipsis.circle	アプリ全体またはコンテキストコマンドを含むメニューを表示します。
addTemplateName	plus	新しいアイテムを作成します。
bookmarksTemplateName	book	アプリ固有のブックマークを表示します。
columnViewTemplateName	rectangle.split.3x1	コンテンツを列基本のレイアウトで表示します。
enterFullScreenTemplateName	arrow.up.left.and.arrow.down.right	フルスクリーンモードに入ります。
exitFullScreenTemplateName	arrow.down.right.and.arrow.up.left	フルスクリーンモードを終了します。
flowViewTemplateName	squares.below.rectangle	カバーフローレイアウトでコンテンツを表示。システムは標準のカバーフロービューを提供しないことに注意。
goBackTemplateName	chevron.backward	後ろに移動。
goForwardTemplateName	chevron.forward	前に移動。
goLeftTemplateName	chevron.left	左に移動。
goRightTemplateName	chevron.right	右に移動。
iconViewTemplateName	square.grid.2x2	アイコンベースのレイアウトでコンテンツを表示します。
leftFacingTriangleTemplateName	chevron.left	左へと移動します。
listViewTemplateName	list.bullet	コンテンツをリストベースのレイアウトで表示します。
lockLockedTemplateName	lock	オブジェクトがロックされていることを示します。有効にすると、オブジェクトのロックが解除されます。
lockUnlockedTemplateName	lock.open	オブジェクトのロックが解除されていることを示します。有効にすると、オブジェクトがロックされます。
pathTemplateName	list.bullet.indent	オブジェクトのパスを表示します。
quickLookTemplateName	eye	Quick Look を使用してアイテムをプレビューします。
refreshTemplateName	arrow.clockwise	コンテンツを更新します。アプリは可能な限りコンテンツを自動的に更新する必要があるため、このアイコンは慎重に使用してください。
removeTemplateName	minus	アイテムを削除します(たとえば、リストから)。
rightFacingTriangleTemplateName	chevron.right	右へと移動します。
shareTemplateName	square.and.arrow.up	現在のコンテキストで役立つ共有拡張機能、アクション拡張機能、およびコピー、お気に入り、検索などのタスクを含むメニューやビューを表示します。
slideshowTemplateName	play.rectangle	スライドショーモードでコンテンツを表示します。
smartBadgeTemplateName	gearshape	スマートフォルダなどのスマートアイテムを作成する機能を示します。
stopProgressTemplateName	xmark	メディアの再生またはスライドを停止します。

Catalina 以前で実行されるアプリでは、境界のあるコントロールでのみコントロールグリフを使用します。 コントロールグリフは、独立したボタンやツールバーのイメージとして使用するためのものではありません。スタンドアロンのボタンが必要な場合は、その目的のためのものを使用してください。ガイダンスについては、自立型ボタングリフ を参照してください。

一般的には、システム API を使用して、フルスクリーンモードに入るグリフとフルスクリーンモードを終了するグリフの代わりにフルスクリーンモードをサポートします。 ウィンドウがシステム API を使用する場合、ウィンドウのタイトルバーには、人々がフルスクリーンモードの開始と終了を切り替えることができる、使い慣れたボタンが自動的に表示されます。

自立型ボタングリフ

以下のグリフを、Safari ダウンロードポップオーバーのような自立型のフチなしボタンとして使用します。開発者向けガイダンスについては、NSButton (NSButton) の isBordered (isBordered) プロパティを参照してください。

イメージ(Catalina 以前)	SF シンボル(macOS 11 以降)	意味
followLinkFreestanding TemplateName	arrow.right.circle.fill	URL を開きます。
invalidDataFreestanding TemplateName	arrow.left.circle.fill	フィールドに無効なデータがあることを示します(たとえば、電話番号フィールドの郵便番号)。
refreshFreestandingTemplateName	arrow.clockwise.circle.fill	ビューを更新するか、プロセスを再開します。
revealFreestandingTemplateName	magnifyingglass.circle.fill	アイテムの親コンテナに移動し、アイテムを選択します。
stopProgressFreestanding TemplateName	xmark.circle.fill	現在のプロセスの進行を停止します。

メニューグリフ

メニューでは以下のグリフを使用します。ガイダンスについては、メニューでのシンボルの使用 を参照してください。

イメージ(Catalina 以前)	SF シンボル(macOS 11 以降)	意味
menuMixedStateTemplateName	minus	選択範囲の一部にのみ適用される属性を示します。
menuOnStateTemplateName	checkmark	[ウィンドウ] メニューで、アクティブな文書を示します。他のメニューでは、選択全体に適用される属性。

多項目のドラッグイメージ

複数の文書またはアイテムを、ある場所から別の場所にドラッグすると、多項目のドラッグイメージが人々に表示されます。システムは、カスタムイメージを作成したくない場合に使用できる、事前にレンダリングされた多項目のドラッグイメージを提供します。

イメージ	名前	API
	Multiple Documents	multipleDocumentsName

ドラッグアクションにコンテキストを提供するために、カスタムの多項目のドラッグイメージを作成することを検討してください。 理想的には、カスタムイメージは、ドラッグされている実際のコンテンツのように見える文書、写真、またはその他のアイテムのスタックを表します。ガイダンスについては、ドラッグアンドドロップ を参照してください。

権限のイメージ

以下のイメージを使用して、ユーザの権限のカテゴリを表します。

イメージ(Catalina 以前)	SF シンボル(macOS 11 以降)	意味
everyoneName	person.3.fill	すべての人の権限。
userName	person.crop.circle	個人の権限。
userGroupName	person.2.fill	人々のグループの権限。
userGuestName	person.crop.circle	ゲストの権限。

環境設定イメージ

以下のイメージを [環境設定] ウィンドウのツールバーのスタンドアロンアイテムとして使用して、使い慣れた設定のカテゴリを表します。ガイダンスについては、設定 と ツールバー を参照してください。

イメージ(Catalina 以前)	SF シンボル(macOS 11 以降)	意味
advancedName	gearshape.2	詳細設定または環境設定。
preferencesGeneralName	gearshape	一般設定または環境設定。
userAccountsName	at	ユーザアカウント

ステータスイメージ

以下の、事前にレンダリングされたイメージを使用して、ネットワークまたはサービスの利用可能ステータスを示します。たとえば、[ネットワークシステム] 環境設定ペインには、各サービスのステータスイメージが表示されます。

イメージ	名前	API
	利用可能	NSImageNameStatusAvailable
	なし	NSImageNameStatusNone
	部分的に利用可能	NSImageNameStatusPartially Available
	利用不可	NSImageNameStatusUnavailable

システム実体のイメージ

システム実体のイメージは、ネットワークやユーザのコンピュータなどのアイテムを表します。通常、これらの実体には関連するアクションはありませんが、アクションを表す必要がある場合は、バッジを追加できます。たとえば、スマートフォルダを作成するアクションを表すには、スマートフォルダのイメージにプラス記号のバッジを追加します。

イメージ(Catalina 以前)	SF シンボル(macOS 11 以降)	意味
applicationIconName	applicationIconName	あなたのアプリのアイコン。
bonjourName	同等の物はなし。	Apple の Bonjour ネットワーキング機能。
folderBurnableName	folderBurnableName	焼くことが可能なフォルダ。
cautionName	cautionName	注意。
computerName	computerName	現在のコンピュータ。
folderName	folderName	汎用のフォルダ。
homeTemplateName	ハウス	ホームの位置。
networkName	networkName	ネットワーク。
folderSmartName	folderSmartName	スマートフォルダ。
trashEmptyName	trashEmptyName	ゴミ箱（空）。
trashFullName	trashFullName	ゴミ箱（一杯）。

ツールバーのイメージ

以下の画像は、環境設定ウィンドウ以外のウィンドウのツールバーでスタンドアロンアイテムとして使用してください。

イメージ(Catalina 以前)	SF シンボル(macOS 11 以降)	意味
colorPanelName	colorPanelName	カラーパネルを表示または非表示にします。
fontPanelName	textformat	フォントパネルを表示または非表示にします。
infoName	info.circle	情報ウィンドウまたはビューを表示または非表示にします。

前：多項目のドラッグイメージ 次：ウインドウの構造