文書のアイコン


文書のアイコン は、あなたのアプリがサポートする文書の型を使用するファイルを表します。伝統的に、文書のアイコンは、右上隅が折りたたまれた一枚の紙のように見えます。この独特の外観は、アイコンのサイズが小さい場合でも、文書をアプリやその他のコンテンツから区別するのに役立ちます。


サポートしているファイルの型の文書のアイコンを提供しない場合、macOS 11 は、アプリのアイコンとファイルの拡張子をキャンバス上に合成することで文書のアイコンを作成します。たとえば、プレビュー では、システムで生成された文書のアイコンを使用して JPG ファイルを表します。



注意

あなたのアプリが以前のバージョンの macOS で実行されている場合は、レガシーの文書のアイコンを提供する必要があります。以前のバージョンの macOS に文書のアイコンを生成させると、バージョンごとに異なる結果が得られます。具体的には、macOS 10.15 では、あなたのアプリのアイコンを合成して文書のアイコンを作成しますが、ファイル拡張子は作成しません。macOS 10.14 以前では、アセットを提供しない場合は汎用の文書の背景を使用します。


あなたのアプリが 1 つ以上のカスタムファイルの型を開く場合、それらを表すカスタム文書のアイコンを作成できます。たとえば、Xcode はカスタム文書のアイコンを使用して、プロジェクト、AR オブジェクト、および Swift コードファイルの文書を人々が区別できるようにします。






カスタムの文書のアイコンを作成するには、背景の塗りつぶし、中央のイメージ、テキストの任意の組み合わせを指定できます。macOS 11 は、必要に応じてこれらの要素を macOS の層を作成し、配置し、マスクし、おなじみの折り畳まれた角のアイコンの形に合成します。





背景の塗りつぶし





中央のイメージ











テキスト





macOS 11 は、提供した要素を合成して、カスタムの文書のアイコンを生成します。


Apple Design Resources は、文書のアイコン用のカスタム背景塗りつぶしと中央のイメージを作成するために使用できるテンプレートを提供しています。このテンプレートを使用するときは、以下のガイドラインに従ってください。


文書の型を明確に伝えるシンプルなイメージをデザインします。 背景の塗りつぶし、中央のイメージ、またはその両方を使用するかどうかにかかわらず、複雑でない形状と明確な色の縮小されたパレットを好みます。あなたの文書のアイコンは 16x16pt まで小さく表示できるため、あらゆるサイズで認識できるデザインを作成する必要があります。


背景の塗りつぶし用に単一の表現力豊かなイメージをデザインすることは、人々が文書の型を理解して認識するのに役立つ優れた方法です。たとえば、Xcode と TextEdit はどちらも、中央のイメージを含まないリッチな背景イメージを使用します。





あなたのアイコンの小さなバージョンの複雑さを軽減することを検討してください。 大きいバージョンでは明確なアイコンの詳細が小さなバージョンではぼやけて見え、認識しにくい場合があります。たとえば、カスタムのハート文書のアイコンのグリッド線を中間サイズで明確に保つには、使用する線を少なくし、縮小されたピクセルグリッドに揃えて太くします。16x16 ピクセルのサイズでは、行を完全に削除できます。




32x32 px のアイコンは、グリッド線が少なく、EKG 線が太くなっています。



16x16 px @2x のアイコンは、EKG 線を保持しますが、
グリッド線はありません。



16x16 px @1x のアイコンには、EKG 線もグリッド線もありません。



背景の塗りつぶしでは右上隅に重要なコンテンツを配置することは避けてください。 システムは、文書のアイコンの形状に合うようにイメージを自動的にマスクし、塗りつぶしの上に白い折り畳まれた角を描画します。以下に示すサイズの背景イメージのセットを作成します。


  • 512x512 pt (1024x1024 px @2x)

  • 256x256 pt (512x512 px @2x)

  • 128x128 pt (256x256 px @2x)

  • 32x32 pt (64x64 px @2x)

  • 16x16 pt (32x32 px @2x)

  • 使い慣れたオブジェクトまたはグリフが文書の型またはあなたのアプリとの関係を伝えることができる場合は、それを表す中央のイメージを作成することを検討してください。 あらゆるサイズで、鮮明で認識可能な、シンプルで明確なイメージをデザインします。中央のイメージは、文書のアイコンキャンバス全体の半分のサイズです。たとえば、32x32 pt の文書のアイコンの中央のイメージを作成するには、16x16 pt 大のイメージキャンバスを使用します。以下のサイズで中央のイメージを提供できます。


  • 256x256 pt (512x512 px @2x)

  • 128x128 pt (256x256 px @2x)

  • 32x32 pt (64x64 px @2x)

  • 16x16 pt (32x32 px @2x)

  • イメージキャンバスの約 10 %を測定するマージンを定義し、その中にイメージの大部分を保持します。 イメージの一部は光学的位置合わせのためにこのマージンまで拡張できますが、イメージがイメージキャンバスの約 80 %を占める場合に最適です。たとえば、256x256 pt のキャンバスの中央のイメージのほとんどは、205x205 pt の領域に収まる必要があります。



    人々があなたの文書の型を理解するのに役立つ場合は、簡潔な用語を指定してください。 デフォルトでは、システムは文書のアイコンの下端に文書の拡張子を表示しますが、拡張子に慣れていない場合は、よりわかりやすい用語を指定できます。たとえば、SceneKit のシーンファイルの文書のアイコンでは、ファイル拡張子 scn の代わりに scene という用語を使用します。システムは、文書のアイコンに収まるように拡張テキストを自動的に拡大縮小するため、小さいサイズでも読みやすいように十分に短い用語を使用してください。デフォルトでは、システムはテキスト内のすべての文字を大文字で始めます。








    前:アプリのアイコン 次:多項目のドラッグイメージ

    目次

    Xcode の新機能



    macOS

    テーマ

    macOS 11 の新規事項

    視覚的インデックス


    アプリの構造

    フルスクリーンモード

    ロード

    モダリティ

    搭載

    優先

    状態の復元

    セキュリティ


    ユーザの操作

    アカウント

    データ入力

    ドラッグアンドドロップ

    ファイル処理

    ゲームコントローラ

    ヘルプ

    キーボード

    マウスとトラックパッド

    ユーザフィードバックの提供

    許可の要求


    システムの能力

    自動セーブ

    ドック

    Finder

    ミッションコントロール

    通知

    印刷

    クイックルック

    格付けとレビュー

    検索とスポットライト


    視覚的デザイン

    アニメーション

    カラー

    ダークモード

    透明さ

    印刷


    アイコンとイメージ

    イメージのサイズと解像度

    アプリのアイコン

    文書のアイコン

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

    システムのイメージ


    ウインドウとビュー

    ウインドウの構造

    アラート

    ボックス

    コラムビュー

    ダイアログ

    イメージビュー

    アウトラインビュー

    パネル

    ポップオーバー

    スクロールビュー

    シート

    サイドバー

    スプリットビュー

    タブビュー

    表のビュー

    ツールバー

    Web ビュー

    Drawer(引き出し)*

    プラカード*


    メニュー

    メニューの構造

    コンテクストメニュー

    ドックメニュー

    メニューバーのメニュー


    ボタン

    チェックボックス

    開示コントロール

    勾配ボタン

    ヘルプボタン

    イメージボタン

    ポップアップボタン

    プルダウンメボタン

    押しボタン

    ラジオボタン

    スコープボタン

    スイッチ

    ベベルボタン*

    ラウンドボタン*


    フィールドとラベル

    コンボボックス

    ラベル

    検索フィールド

    テキストフィールド

    トークンフィールド


    セレクタ

    色の源

    日付の選別

    イメージウェル

    パスコントロール

    セグメントコントロール

    スライダ

    ステッパ


    インジケータ

    レベルインジケータ

    プログレスインジケータ


    タッチバー

    タッチバー概観

    視覚的デザイン

    グリフとイメージ

    コントロールとビュー


    拡張機能

    アクション拡張機能

    オートメータアクション

    ファインダー同期拡張機能

    メニューバーの追加

    サービス

    共有拡張機能



    iOS


    tvOS


    watchOS


    Technologies

    アクセシビリティ

    序文

    ベストプラクティス

    ユーザとの対話

    ナビゲーション

    テキストのサイズと太さ

    色とコントラスト

    外観の効果と動き

    コンテンツ


    AirPlay

    メディア再生

    アイコン

    社説


    アプリクリップ

    序文

    ユーザ体験

    アプリクリップカード

    アプリのクリップコード

    印刷ガイドライン

    法的要件


    Apple Pay(アップルペイ)

    序文

    Apple Pay の提供

    チェックアウトと支払い

    エラー処理

    サブスクリプションと寄付

    ボタンとマーク

    社説


    拡張現実

    ホームスクリーンのアクション

    マルチタスクと複数のウィンドウ

    通知

    印刷

    クイックルック(検索)

    評価とレビュー

    スクリーンショット

    TV プロバイダー


    CareKit

    序文

    データとプライバシー

    ビュー

    ユーザー体験

    シンボルと商標化


    CarPlay

    序文

    オーディオアプリ

    自動車メーカーのアプリ

    伝達および VoIP アプリ


    アーキテクチャ

    バッジ付け

    エラー処理

    ロード

    ナビゲーション

    テスト


    対話

    オーディオ

    車のデータ

    iPhone

    ノブとコントロール

    タッチスクリーン

    Voice (Siri)


    視覚的デザイン

    アニメーション

    商標化

    レイアウト

    タイポグラフィ(印刷)


    アイコンと画像

    画像のサイズと解像度

    アプリのアイコン

    カスタムアイコン

    システムアイコン


    システム要素

    アクションシート

    活動指標

    アラート

    ボタン

    コレクション

    ラベル

    ナビゲーションバー

    スクロールビュー

    タブバー

    テキストビュー

    Web ビュー


    CareKit

    序文

    データとプライバシー

    ビュー

    ユーザ体験

    シンボルと商標化


    ゲームセンター

    序文

    アクセス・ポイント

    ダッシュボード

    実績

    順位表

    マルチプレイヤー

    カスタムダッシュボードリンク


    象形文字

    HealthKit

    HomeKit

    序文

    用語とレイアウト

    設定

    Siri の作用

    カスタム機能

    アイコン

    社説


    iCloud

    アプリ内購入

    序文

    自動更新可能なサブスクリプト


    inclusion(含有)

    ライブ写真

    Mac Catalyst

    序文

    アプリの構造

    ユーザとの対話

    視覚的デザイン

    Mac 慣用句


    マシン学習

    序文

    マシン学習の役割


    入力

    明示的なフィードバック

    暗黙のフィードバック

    較正

    訂正


    出力

    間違い

    複数のオプション

    自信

    帰属

    制限事項


    地図(Maps)

    アプリとウェブサイトの地図

    Apple Watch の地図

    屋内の地図


    ResearchKit

    序文


    右から左へ

    序文

    テキストと文字

    コントロール

    画像と象形文字


    SharePlay

    Apple でサインイン

    序文

    データ管理

    ボタン


    Siri

    序文

    システムインテント

    カスタムの注視

    ショートカットと提案

    編集ガイドライン


    ソーシャルメディア

    SF Symbols

    Wallet(財布)

    序文

    許可証のデザイン


    小道具

    序文

    コンテンツ

    編集と対話

    デザイン




    Human Interface Guidelines


    概要


    リソース


    ビデオ


    新規事項



    ニュース

    見つける

    デザイン

    開発

    配信

    サポート

    アカウント
    (セキュリティの面で、リンクを提供できませんでした。)













    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ












    トップへ