HIGまとめ ー Extension ー

カスタムキーボード（Custom Keyboards）

キーボード拡張は、標準キーボードをカスタムキーボードに置き換えます。カスタムキーボードは、設定アプリの[一般]> [キーボード]で有効になります。有効にすると、アプリ内のテキスト入力時にキーボードが使用可能になります。ただし、secure text fieldsとphone number fieldsを編集する場合は除きます。ユーザーは複数のカスタムキーボードを有効にして、いつでも切り替えることができます。

カスタムキーボードが本当に必要であることを確認してください
カスタムキーボードは、テキストを入力する新しい方法やiOSでサポートされていない言語を入力する機能など、独自のキーボード機能をシステム全体に公開する場合に役立ちます。アプリにカスタムキーボードのみが必要な場合は、代わりにCustom Input Viewsを作成することを検討してください。

キーボードを切り替える明確で簡単な方法を提供します
複数のキーボードを有効にしている場合に絵文字キーを置き換える標準iOSキーボードのグローブキー（地球儀マークのボタン）は、他のキーボードにすばやく切り替わることを人々は知っています。彼らはあなたのキーボードで同様に直感的な体験を期待しています。複数のキーボードがインストールされている場合は、グローブキーが絵文字キーに置き換わることに注意してください。

システムが提供するキーボード機能を複製しないでください
一部のデバイスでは、カスタムキーボードを使用している場合でも、絵文字/グローブキーとディクテーションキー（マイクマークのボタン）がキーボードの下に自動的に表示されます。アプリはこれらのキーに影響を与えることができないため、キーボードでキーを繰り返し表示して混乱を引き起こさないようにしてください。

アプリでキーボードチュートリアルを提供することを検討してください
人々は標準キーボードに慣れており、新しいキーボードを習得するには時間がかかります。キーボード自体ではなくアプリで使用手順を提供することで、オンボーディングプロセスを簡単にします。キーボードを有効にする方法、テキスト入力中にキーボードを有効にする方法、使用する方法、および標準キーボードに戻す方法をユーザーに伝えます。

カスタムインプットビュー（Custom Input Views）

カスタムインプットビューは、標準キーボードをカスタムキーボードに置き換えますが、システム全体ではなく、アプリ内のみです。カスタムインプットビューを使用して、独特かつ効率的なデータ入力方法を提供します。たとえば、Numbersというアプリは、スプレッドシートの編集中に数値を入力するためのカスタムインプットビューを実装しています。

機能を明確にします
カスタムインプットビューのコントロールは、アプリのコンテキストで意味をなす必要があります。データ入力は明確で直感的である必要があるため、追加の指示は必要ありません。

入力中に標準キーボードのクリック音を再生します
キーボードのクリック音は、ユーザーがキーボードのキーをタップしている間聞くことができるフィードバックを提供します。インプットビューでカスタムコントロールをタップしてもクリック音が生成されます。このクリック音は表示されているカスタムインプットビューでのみ使用可能であり、ユーザーは[設定]> [サウンド]でシステム全体のクリック音を無効にできることに注意してください。

必要に応じて、インプットアクセサリビューを提供します
一部のアプリは、キーボードの上に表示される追加のカスタムインプットアクセサリビューを実装しています。Numbersというアプリのインプットアクセサリビューは、標準またはカスタム計算の入力に役立ちます。

ファイルプロバイダー（File Providers）

ファイルプロバイダーという拡張機能は、システム上の他のアプリ内からアプリのドキュメントをインポート・エクスポート・開く・移動するためのカスタムインターフェイスを実装します。ファイルプロバイダーが読み込まれると、そのインターフェイスはナビゲーションバーを含むモーダルビューに表示されます。

ユーザーがファイルを開いたりインポートしたりするときに、コンテキスト固有のドキュメントと情報のみを表示します
誰かがファイルプロバイダーを使用してドキュメントを開いたりインポートしたりする場合、現在のコンテキストに適したドキュメントのみを表示します。たとえば、PDF編集アプリがファイルプロバイダーを読み込む場合、PDFファイルのみを開いたりインポートしたりできるドキュメントとして一覧表示をします。変更日・サイズ・ドキュメントがローカルかリモートかなど、役立つ可能性のある他の情報も必ず一覧表示してください。

ドキュメントをエクスポートおよび移動するときに宛先を選択できるようにします
アプリがドキュメントを単一のディレクトリに保存しない限り、ユーザーがディレクトリ階層内の特定の宛先に移動できるようにします。新しいサブディレクトリを追加する方法を提供することを検討してください。

カスタムナビゲーションバーを提供しないでください
ファイルプロバイダーはナビゲーションバーを既に含むモーダルビュー内で読み込まれます。2つ目のナビゲーションバーを提供すると混乱を招く上にスペースを取ってしまいます。

ホームスクリーンクイックアクション（Home Screen Quick Actions）

ホームスクリーンクイックアクションは、ホーム画面からアプリ固有の便利なアクションを実行する便利な方法です。アプリアイコンを長押しすると、利用可能なクイックアクションのメニューを取得できます（3D Touchデバイスでは、アイコンを短く押すとメニューが表示されます）。たとえば、メールには、受信トレイ or VIPメールボックスを開き、検索を開始し、新しいメッセージを作成するクイックアクションが含まれています。

各ホーム画面のクイックアクションには、タイトル、左または右のアイコン（ホーム画面でのアプリの位置に応じて）、およびオプションのサブタイトルが含まれます。タイトルとサブタイトルは、左から右の言語では常に左揃えになります。新しい情報が利用可能になると、アプリはクイックアクションを動的に更新することもできます。たとえば、メッセージは最新の会話を開くためのクイックアクションを提供します。

TIPS
一部のアプリでは、クイックアクションのリストの上にウィジェットが表示されます。 たとえば、現在の株価を示すウィジェットの下に株価のクイックアクションリストが表示されます。 ウィジェットを実装して、さらに魅力的な体験を提供することを検討してください。 

魅力的で価値の高いタスクのための迅速なアクションを作成します
たとえばマップを使用すると、ユーザーは最初にマップアプリを開かなくても、現在地の近くで検索したり自宅までの道順を取得したりできます。すべてのアプリで少なくとも1つの便利なクイックアクションを有効にする必要があります。合計4つ提供できます。

クイックアクションを使用してナビゲーションを容易にしないでください
アプリの重要な領域にアクセスするのが困難または時間がかかる場合は、最初にナビゲーションを修正してすべての人にとって適切に機能するようにします。次に便利で創造的なタスクを可能にするクイックアクションの提供に焦点を当てます。

クイックアクションに予測できない変更を加えないでください
動的なクイックアクションはアクションの関連性を維持するための優れた方法です。たとえばアプリの現在の場所や最近のアクティビティ、時刻、または設定の変更に基づいてクイックアクションを更新するのが理にかなっている場合があります。ただし、アクションは予測不能または混乱を招くような方法で変更すべきではありません。

クイックアクションごとに簡潔なタイトルを指定します
アクションのタイトルは「自宅までの行き方」、「新規コンテンツの作成」、「新規メッセージ」のようにアクションの結果を即座に伝える必要があります。さらにコンテキストを追加する必要がある場合はサブタイトルも提供します。メールはサブタイトルを使用して、受信トレイとVIPフォルダーに未読メッセージがあるかどうかを示します。タイトルまたはサブタイトルにアプリ名や無関係な情報を含めないでください。切り捨てを避けるためにテキストを短くし、限られた場所にテキストを書くように考慮してください。

通知にクイックアクションを使用しないでください
人々は他の方法でアプリから通知を受け取ることを期待します。

クイックアクションごとに認識可能なアイコンを提供します
可能な限り、クイックアクションアイコンに一覧表示されている使い慣れたシステムアイコンを使用してください。独自のアイコンを設計する場合はiOS用のApple UIデザインリソースに含まれているクイックアクションアイコンテンプレートを使用し、カスタムアイコンのガイドラインに従ってください。

アイコンの代わりに絵文字を使用しないでください
絵文字は右揃えのテキストと適切に整列しません。また、絵文字はフルカラーですが、クイックアクションアイコンは単色です。

メッセージング（Messaging）

iMessageアプリとステッカーパックは、人々がコンテンツを友人と共有し、表現力豊かに通信し、共同体験を共有できるメッセージング拡張機能です。

iMessageアプリ

iMessageアプリは、メッセージ会話のコンテキスト内でインタラクティブな体験を提供します。iMessageアプリを使用するとデータやメディアを共有したり、共有タスクで共同作業したり、互いにゲームをプレイしたりできます。

直感的なインターフェイスを設計します
iMessageアプリがテキスト、写真、ビデオなどの静的コンテンツを提供する場合、会話に挿入するアイテムを簡単に拾い読みして選択できるようにしてください。マルチプレイヤーゲームボードや共同テイクアウトの注文など、アプリがインタラクティブな場合はその機能が有用で理解しやすいものであることを確認してください。

焦点を絞ったコンテンツを提供します
明快さと使いやすさのために、各メッセージング拡張機能は一つの焦点を持つ必要があります。たとえば、ステッカーとライドシェアリングの両方を組み合わせた1つのアプリを設計しようとしないでください。

楽しく、協力的な体験を提供します
iMessageアプリは通常、2人以上の人とのペースの速いくだけた会話のコンテキストで使用されます。この環境を創造的に活用して、コンテンツを共有、編集、または拡張することにより、行ったり来たりの参加を促進します。すべての関係者がアプリを一緒に使用している場合、コンテンツの更新はリアルタイムで行われます。

興味深いiOSアプリのコンテンツを強調します
iOSアプリの機能を拡張するには、メッセージスペースでコンテンツを表示します。人々がどのような種類の情報を共有したいのか、そして活発な会話のコンテキスト内でアプリとどのようにやり取りできるのかを考えてください。

切り抜きを避けたコンテンツを挿入します
アプリのコンテンツは角の丸いメッセージバブルで表示されるため、重要な情報を角に入れないでください。

コンパクトビューと拡張ビューを区別します
アプリは、会話の下のコンパクトビューに表示されます。このビューはアプリを他のアプリと視覚的に区別し、頻繁に使用される機能へのアクセスを提供する必要があります。また、アプリを展開表示で開いて高度な機能にアクセスしたり、一度に他のオプションを表示したりすることもできます。

拡張ビューでのみテキスト編集を許可します
コンパクトビューは、キーボードとほぼ同じ高さです。ユーザーが編集中の内容を確実に表示できるようにするには、拡張ビューでのみテキスト入力を許可します。

ステッカー

ステッカーは、人々が文字を入力したり絵文字を使用したりせずに、メッセージの会話で自分自身を表現するための楽しく魅力的な方法を提供します。ステッカーは、メッセージ、写真、および他のステッカーに送信または配置して、強調を加え、感情を伝えることができる画像またはアニメーションです。

表現力豊かなデザインをしてください
人々はステッカーを使用して気分や反応を視覚的に伝えます。感情的なレベルで人々をつなげるステッカーを提供してください。画像、単語、フレーズを取り入れて、会話に新しい広がりを加えることを検討してください。

グローバルに考えます
メッセージングは​​コミュニケーションの普遍的な形式です。広くグローバルな訴求力を持つステッカーを目指してください。

説明的な画像名を使用するか、代替テキストラベルを提供します
画面上には表示されませんが、画像名と代替テキストラベルを使用するとVoiceOverでステッカーを音声で説明できるため、視覚障害のあるユーザーのナビゲーションが容易になります。

アニメーションを通じて活力を追加します
ステッカーは静止画像でもかまいませんが、アニメーションステッカーは会話にエネルギーを与えるのに最適な方法です。動きを滑らかに保つのに十分高いフレームレートを使用してください。

配置の可能性をテストします
ユーザーは会話の一部をおおいかかるようにステッカーを拡大縮小、回転、および配置できます。ステッカーは、位置やサイズに関係なく、さまざまな色や画像に対して読みやすいことを確認してください。

鮮やかな色と背景の透過の使用を検討してください
鮮やかな色は会話に豊かさと興奮を加えます。背景の透過により、ステッカーをメッセージ、写真、他のステッカーの上に有意義に配置できます。ステッカーサイズ

メッセージは3つのステッカーサイズをサポートしており、これらはグリッドベースのブラウザに表示されます。コンテンツに最適なサイズを選択し、そのサイズですべてのステッカーを準備します。

ステッカーを適切に拡大縮小します
メッセージは必要に応じて大きなステッカーを縮小しますが、最適な品質とパフォーマンスを得るために事前に拡大縮小されたステッカーを提供することが最善です。

ファイルサイズの制限に注意してください
効率のために、個々のステッカーは500KBを超えてはなりません。Xcodeは24ビットパレットを使用してPNGアニメーションを保存するため、予想されるファイルサイズよりも大きくなる可能性があることに注意してください。

ステッカーの形式
メッセージは、次のファイル形式のステッカーをサポートしています。

iMessageアプリとステッカーパックアイコン

iOSアプリのように、iMessageアプリとステッカーパックには、認識可能なアプリアイコンが必要です。

背景をシンプルに保ち、一つの焦点を提供します
一目で注意を引く、一つの焦点を持つアイコンを設計します。他のアイコンを圧倒しないシンプルな背景を含めます。

アイコンの角を正方形にしてください
システムはアイコンの角を自動的に丸めるマスクを適用します。

さまざまなサイズのアイコンを提供します
App Store、メッセージ、通知、および設定にアイコンが表示されます。どのようなコンテキストやデバイスでもアイコンが見栄えよく表示されるようにするには、次のサイズでアイコンのバリエーションを提供できます。

写真編集

写真編集の拡張機能を使用すると、フィルターを適用するなどの変更を行うことで写真アプリ内で写真やビデオを変更できます。編集は常に写真アプリに新しいファイルとして保存され、元のバージョンを安全に保持します。

写真編集の拡張機能にアクセスするには、写真が編集モードになっている必要があります。編集モードでツールバーの拡張機能アイコンをタップすると、利用可能な編集拡張機能のアクションメニューが表示されます。いずれかを選択すると、拡張機能のインターフェイスがナビゲーションバーを含むモーダルビューに表示されます。このビューを閉じると編集が確定して保存されるか、キャンセルされてフォトアプリに戻ります。

編集のキャンセルを確認します
写真やビデオの編集には時間がかかる場合があります。誰かがキャンセルボタンをタップした場合、すぐに変更を破棄しないでください。本当にキャンセルしたいことを確認してもらい、キャンセルすると編集内容が失われることを伝えます。編集がまだ行われていない場合はこの確認を表示する必要はありません。

カスタムナビゲーションバーを提供しないでください
拡張機能はナビゲーションバーを既に含むモーダルビュー内で読み込まれます。2つ目のナビゲーションバーを提供すると混乱を招く上にスペースを取ってしまいます。

編集をプレビューできるようにします
編集が加えられた画面が見えない場合、編集を承認するのは困難です。拡張機能を閉じてフォトアプリに戻る前に作業の結果を他の人に見せてください。

写真編集の拡張機能アイコンにアプリアイコンを使用します
これにより、拡張機能が実際にアプリによって提供されるという自信が生まれます。

共有とアクション

共有拡張機能は、現在のコンテキストの情報をアプリ、ソーシャルメディアアカウント、その他のサービスと共有する便利な方法を提供します。アクション拡張機能により、ブックマークの追加、リンクのコピー、画像の保存など、コンテンツ固有のタスクを始めることができます。ユーザーはアプリのアクションボタンをタップしてアクティビティビューを表示することにより、共有拡張機能とアクション拡張機能にアクセスします。アクティビティビューには現在のコンテキストに関連する拡張機能のみが表示されます。たとえば、ビデオの編集中にテキスト操作アクションは表示されません。アクティビティビュー内で共有拡張機能はアクション拡張機能の上にリストされます。

一つに焦点を当てたタスクを有効にします
拡張機能はミニアプリではありません。現在のコンテキストに関連する狭い範囲のタスクを実行します。

使い慣れたインターフェイスを作成します
共有拡張機能の場合、システムが提供する構成の見た目は使い慣れており、システム全体で一貫した体験を提供します。可能な限り使用してください。アクション拡張機能の場合はアプリ名を含めるか、認識可能でアプリの自然な拡張機能のように感じるインターフェイスを設計します。

流れるようなインタラクションにし、機能する場所を限定します
最高の拡張機能はわずか数ステップでタスクを実行することができます。たとえば、共有拡張機能は、シングルタップですぐにソーシャルメディアアカウントに画像を投稿できます。必要な場合にのみインターフェースを提供してください。

拡張機能の上にモーダルビューを配置しないでください
拡張機能はデフォルトでモーダルビュー内に表示されます。アラートは拡張機能の上で意味をなす場合がありますが、追加のモーダルビューを重ねることは避けてください。

メインアプリを使用して、長時間の操作の進行状況を示します
アクティビティビューは共有またはアクションを開始した直後に終了する必要があります。時間のかかるタスクはバックグラウンドで続行する必要があり、メインアプリはこれらのタスクのステータスを確認する方法を提供する必要があります。これには通知を使用しないでください。人々はタスクが完了するたびに通知を見たくありませんが、問題がある場合は通知しても大丈夫です。

アクション拡張機能アイコンにテンプレート画像を使用します
テンプレート画像はマスクを使用してアイコンを作成します。適切な透明度とアンチエイリアスを備えた白と黒を使用し、ドロップシャドウを含めないでください。テンプレート画像は約70px×70pxの領域の中央に配置する必要があります。

ウィジェット

ウィジェットはタイムリーで有用な情報やアプリ固有の機能を少しだけ表示する拡張機能です。たとえばニュースウィジェットにはトップの見出しが表示されます。カレンダーには2つのウィジェットがあり、1つは今日のイベントを表示し、もう1つは次の予定を表示します。メモを使用すると、最近のメモをプレビューして、新しいメモ、リマインダー、写真、図をすばやく作成できます。ウィジェットは大いにカスタマイズ可能であり、ボタン、テキスト、レイアウトのカスタマイズ、画像などを含めることができます。

3D Touchを使用してホーム画面のアプリアイコンに圧力をかけると、クイックアクションリストの上にウィジェットが表示されます。ユーザーは関心のあるウィジェットを検索画面に追加します。検索画面にはホーム画面とロック画面を右にスワイプすることでアクセスできます。あなたの目標は人々が検索画面に追加したいウィジェットを設計することです。

優れた見やすい体験を設計します
人々はウィジェットを使用して簡単な更新を取得し、非常に単純なタスクを実行するため、適切な量の情報と対話性を提供することが不可欠です。可能な限り、シングルタップで完了するタスクを提供します。ウィジェット内でのパンニング（音像定位の調整？）とスクロールはサポートされていません。

コンテンツをすばやく表示します
ウィジェットを見る時間はほとんどなく、コンテンツがロードされるのを待つ必要はありません。限られた場所に情報を隠して、更新の取得中に常に最新の情報を表示できるようにします。

十分なマージンとパディングを提供します
コンテンツをウィジェットの端まで拡張しないでください。一般的に、両端とコンテンツの間に少なくとも数ピクセルのマージンを設けます。縦一直線に視線を誘導してもらうために、ウィジェットの上部にアプリアイコンを使用します。コンテンツはアイコンの中央を基準線として整列配置するとうまく機能する傾向があります。アプリがグリッドスタイルのレイアウトを提供する場合は、グリッドアイテム間に十分かつ均等なパディングを提供してください。可能であれば、アイコンとボタンのグリッドを行ごとに4つに制限します。

順応性があるようにしてください
ウィジェットの幅はデバイスと向きによって異なります。ウィジェットによって表示される高さと情報は、折りたたまれているか展開されているかによって異なります（すべてのウィジェットが展開をサポートしているわけではありません）。折りたたまれたウィジェットは、約2行半のテーブル行の高さです。展開されたウィジェットは画面の高さよりも高くないことが理想的です。クイックアクションリストには、折りたたまれた状態のウィジェットのみが表示されます。折りたたむと、ウィジェットは単独で使用できる重要な情報を表示します。ウィジェットを展開すると、主要情報を強化する追加情報がウィジェットに表示されます。たとえば天気ウィジェットは、折りたたまれると現在の気象条件を表示しますが、展開すると時間ごとの予報を追加します。

ウィジェットの背景をカスタマイズしないでください
システムが提供する明るくぼやけたウィジェットの背景は、一貫性と読みやすさのために設計されています。可能な限り使用してください。ロックやホーム画面の壁紙と衝突する可能性があるため、写真を背景として使用しないでください。

一般的に、テキストには黒または濃い灰色のシステムフォントを使用します
システムフォントは読みやすいように設計されており、暗い色は標準のウィジェットの背景に適しています。

必要に応じて、他のことをするためにアプリに遷移してもらうようにします
ウィジェットはアプリとは独立して動作する必要があります。ただし、ウィジェットが提供する以上のことをときどき行う必要がある場合は、簡単に行えるようにしてください。コンテンツからスペースを奪う「アプリを開く」ボタンを含めないでください。代わりに、ユーザーがコンテンツ自体をタップしてアプリで表示または編集できるようにします。たとえばカレンダーウィジェットでは、予定をタップしてカレンダーアプリで開くことができます。他のアプリを開くためにウィジェットを使用しないでください。

適切なウィジェット名を選択してください
アプリのアイコンとタイトルが各ウィジェットのコンテンツの上に表示されます。一般的に、ウィジェットの名前はアプリの名前と一致する必要があります。アプリに複数のウィジェットが用意されている場合は、主要なウィジェットにはアプリ名を使用し、他のウィジェットには明確で簡潔な名前を使用することを検討してください。カスタムタイトルを使用する場合は、アプリの名前にプレフィックス（”pre” のように、単語の先頭に付加して特定の意味を付け加える要素のこと）を付けることを検討してください。たとえば、近くの場所を表示するためのマップウィジェットの名前は「マップの近く」です。アプリ名を含めることで、ウィジェットが実際にアプリによって提供されているという自信が生まれます。

認証が必要になってくる場合は人々に知らせてください
もし誰かがあなたのアプリにログインしていたとしてウィジェットが追加機能を提供する場合、人々がそのことを知っているかどうか確認してください。たとえば近日中の予約を表示するアプリには、ユーザーがログインしていないときに「アプリにサインインして予約を表示する」というメッセージを含めることができます。

クイックアクションリストのウィジェットを選択します
アプリに複数のウィジェットがある場合、3D Touchを使用してホーム画面のアプリアイコンに圧力をかけるときにでてくるクイックアクションメニュー内に表示されるウィジェットを1つ選択します。