Windows 7 リボン
Note
この設計ガイドは、Windows 7 用に作成されたもので、新しいバージョンのWindows用に更新されていません。 ガイダンスの多くは原則として適用されますが、プレゼンテーションと例には 現在の設計ガイダンスは反映されていません。
リボンは、ユーザーが最小限のクリック数でコマンドを効率的かつ直接検索、理解、使用するのに役立つ最新の方法であり、試用とエラーに頼る必要が少なく、ヘルプを参照する必要はありません。
リボンは、プログラムの機能をウィンドウの上部にある一連のタブに整理するコマンド バーです。 リボンを使用すると、機能の検出可能性が向上し、プログラム全体の学習が迅速になり、ユーザーはプログラムのエクスペリエンスをより制御できるようになります。 リボンは、従来のメニュー バーとツール バーの両方を置き換えることができます。
一般的なリボン。
リボン タブは、密接に関連するコマンドのラベル付きセットであるグループで構成されます。 タブとグループに加えて、リボンは次で構成されます。
- [アプリケーション] ボタン。ファイル関連のコマンドなど、ドキュメントまたはワークスペースに対して、またはドキュメントまたはワークスペースで何かを行うコマンドのメニューが表示されます。
- クイック アクセス ツール バー。これは、頻繁に使用されるコマンドを表示する、カスタマイズ可能な小さなツール バーです。
- コア タブは、常に表示されるタブです。
- コンテキスト タブ。特定のオブジェクトの種類が選択されている場合にのみ表示されます。 常に表示されるタブは、コア タブと呼ばれます。
- タブ セットは、1 つのオブジェクト型のコンテキスト タブのコレクションです。 オブジェクトは複数の型を持つことができます (たとえば、図を含むテーブル内のヘッダーは 3 種類です)、一度に複数のコンテキスト タブ セットを表示できます。
- モーダル タブ。これは、印刷プレビューなど、特定の一時モードで表示されるコア タブです。
- ギャラリー。グラフィカルに表示されるコマンドまたはオプションの一覧です。 結果ベースのギャラリーは、コマンド自体ではなく、コマンドまたはオプションの効果を示しています。 リボン内ギャラリーは、ポップアップ ウィンドウではなくリボン内に表示されます。
- 強化されたツールヒント。関連するコマンドを簡潔に説明し、ショートカット キーを指定します。 また、グラフィックスやヘルプへの参照を含めることもできます。 強化されたツールヒントにより、コマンド関連のヘルプの必要性が軽減されます。
- ダイアログ ボックス起動ツール。グループに関連する機能を含むダイアログ ボックスを開く一部のグループの下部にあるボタンです。
リボンは当初、Microsoft Office 2007 で導入されました。 リボンOffice使用する必要がある理由と、リボンを使用した多くの問題の解決については、「リボンのストーリー」を参照してください。
これは適切なユーザー インターフェイスですか?
リボンの使用を決定するには、次の質問を検討してください。
プログラムの種類
- どのような種類のプログラムを設計していますか? プログラムの種類は、リボンの適切性を示す適切なインジケーターです。 リボンは、ドキュメントの作成と作成プログラムだけでなく、ドキュメント ビューアーやブラウザーにも適しています。 リボンは他の種類のプログラムで機能する場合がありますが、他の形式のコマンド表示の方が適している場合があります。 一般に、軽量プログラムには軽量のコマンド プレゼンテーションが必要です。
検出可能性と学習の問題
- ユーザーがコマンドを見つけるのに問題がありますか? ユーザーがプログラムに既に存在する機能を要求していますか? その場合、リボンを使用すると、わかりやすいラベルと関連コマンドのグループ化を使用して、コマンドを見つけやすくなります。 また、リボンを使用すると、将来の拡大のためにメニュー バーやツール バーよりもスケールが向上します。
- ユーザーがプログラムのコマンドを理解できない場合 多くの場合、適切なコマンドを選択したり、コマンドの動作を判断したりするには、"試用版とエラー" に頼る必要がありますか? その場合は、ギャラリーとライブ プレビューに基づく結果指向のコマンドでリボンを使用すると、コマンドを理解しやすくなります。
コマンドの特性
- コマンドは複数の場所に表示されますか? プログラムが既に存在する場合、コマンドはメニュー バー、ツールバー、作業ウィンドウ、作業領域内に表示されますか? その場合、リボンを使用すると、コマンドが 1 つの場所に統合され、見つけやすくなります。
- コマンドはウィンドウ全体に適用されるか、特定のペインにのみ適用されますか? リボンは、ウィンドウ全体または特定のオブジェクトに適用されるコマンドに最適です。 インプレース コマンドは、個々のウィンドウ ウィンドウに適しています。
- ほとんどのコマンドを直接表示できますか? つまり、ユーザーは 1 回のクリックで操作できますか。 一般的に使用されるコマンドにメニューやダイアログ ボックスからアクセスする場合は、直接リファクタリングできますか? 一部のコマンドはメニューとダイアログ ボックスを使用して表示できますが、この方法でほとんどのコマンドを表示するとリボンの効率が低下し、メニュー バーの方が適している可能性があります。
コマンドスケール
- コマンドの数は少ないですか? 最も頻繁に使用されるコマンドは、単一のシンプルなツールバーに簡単に表示できますか? コア タブとコンテキスト タブを追加すると、リボンを使用すると、最も一般的なタスクを実行するために単独で使用できる単純な [ホーム] タブが作成される場合に価値があります。 そうでない場合、リボンを使用する利点は、少数のコマンドに対する余分な重みを正当化しない可能性があります。
- コマンドの数が多いですか? リボンを使用するには、7 つ以上のコア タブが必要ですか? ユーザーは一般的なタスクを実行するために常にタブを変更する必要がありますか? その場合は、(タブを変更する必要がない) ツール バーと パレット ウィンドウ (タブの変更が必要になる場合がありますが、一度に複数開く場合があります) を使用する方が効率的な選択肢になる場合があります。
- ほとんどの場合、ユーザーは少数のコマンドを使用する傾向がありますか? その場合は、[ホーム] タブにこのようなコマンドを配置することで、リボンを効率的に使用できます。タブを絶えず変更すると、リボンが非効率的になります。
- プログラムは、プログラムのコンテンツ領域を可能な限り大きくすることで恩恵を受けますか? その場合、メニュー バーと 1 つのツールバーを使用すると、リボンよりもスペース効率が高くなります。 ただし、プログラムで 3 行以上のツール バーが必要な場合や作業ウィンドウを使用する場合は、リボンを使用する方がスペース効率が高くなります。
- ユーザーは、プログラム内の大きなウィンドウ内の特定の領域で長時間作業する傾向がありますか? その場合は、ミニ ツールバー、パレット ウィンドウ、直接コマンドの近接性の恩恵を受けます。 作業領域からリボンへのラウンド トリップを行うと、効率が悪すぎます。
- 効率と柔軟性を高めるために、ユーザーはコマンドプレゼンテーションの内容、場所、またはサイズを大幅に変更する必要がありますか? その場合は、カスタマイズ可能で拡張可能なツール バーとパレット ウィンドウを選択することをお勧めします。 一部の種類のツールバーをドッキング解除してパレット ウィンドウにしたり、パレット ウィンドウを移動、サイズ変更、カスタマイズしたりできます。
最後に、この最終的な質問を考えてみましょう。 発見可能性、学習の容易さ、効率、生産性の向上は、余分なスペースのコストと、コマンドを整理するためのタブの必要性に値しますか? その場合は、リボンの使用が最適な選択肢です。 わからない場合は、リボン ベースのデザインを使いやすさテストし、最適な代替方法と比較することを検討してください。
リボンは、コマンドプレゼンテーションの新しい魅力的な形式であり、プログラムを最新化するための優れた方法です。 しかし、彼らが魅力的であるのと同じように、彼らはすべてのプログラムに適した選択ではありません。
正しくない:
この操作は行わないでください。
7 つの最も重要なもの
- プログラムの種類に適したコマンド ソリューションを選択します。 リボンを使用すると、プログラムの使い方が簡単になり、効率が上がり、使いやすくなります。 リボンの使用が適切でない場合は、代わりに豊富なコマンドを使用することを検討してください。
- 効果的なリボンを作成する際の課題を過小評価しないでください。 既存のメニュー バーとツール バーの単純なポートになることは想定しないでください。 また、リボンを使用するとプログラムが自動的に向上することを当然のことと考えないでください。 コマンドの再設計に必要な時間と労力をコミットすることは、リボンの使用を決定する上で重要な要素です。
- コマンドを検出可能にします。 コマンドと説明的にラベル付けされたタブの間に明確で明確な一意のマッピングがあるタブ デザインを選択します。 ユーザーは、探しているコマンドを持つタブをすばやく自信を持って判断でき、間違ったタブを選択することはほとんどありません。
- コマンドを説明します。 ユーザーは、ラベル、アイコン、ヒント、プレビューからコマンドの効果を理解する必要があります。 コマンドのしくみを確認するために、ヘルプ トピックを試したり読んだりする必要はありません。
- コマンドを効率的に使用します。
- ユーザーは、[ホーム] タブでほとんどの時間を費やす必要があります。
- ユーザーは、一般的なタスク中にタブを変更する必要はほとんどありません。
- ウィンドウが最大化され、ユーザーが正しいタブに移動すると、最も頻繁に使用されるコマンドが最も視覚的に強調され、ユーザーは 1 回のクリックで呼び出すことができます。 ユーザーは、最大 4 回のクリックでタブで他のすべてのコマンドを実行できます。
- ユーザーは、一般的なタスクでコマンドを指定したり属性を変更したりするために、ダイアログ ボックスを開く必要はありません。
- ユーザーが自信を持ってコマンドとオプションを選択し、試行錯誤の必要性を最小限に抑えるのに役立ちます。 結果指向のコマンドは、必要に応じて常に使用します。多くの場合、ギャラリーやライブ プレビューの形式で使用します。
- リボンが最大ウィンドウ サイズから最小サイズに適切にスケーリングされていることを確認します。
設計概念
既存のプログラムでリボンを調整する
既存のプログラムの従来のメニュー バーとツール バーのデザインをリボン形式にリファクタリングするだけでも、リボンを使用する場合のほとんどの値が失われる可能性があります。 リボンは、結果指向のコマンドを即時に表示するために使用される場合に最も価値があります。多くの場合、ギャラリーやライブ プレビューの形式です。 結果指向のコマンドを使用すると、コマンドの理解が容易になり、ユーザーの効率と生産性が大幅に向上します。 既存のコマンドをリファクタリングする代わりに、プログラムでコマンドを実行する方法を完全に再設計することをお勧めします。
効果的なリボンを作成する際の課題を過小評価しないでください。 また、リボンを使用するとプログラムが自動的に向上することを当然のことと考えないでください。 効果的なリボンを作成するには、多くの時間と労力がかかります。 このようなコマンドの再設計に必要な時間と労力を計画することは、リボンの使用を決定する上で重要な要素です。
リボンの性質
従来のメニュー バーやツールバーと比較すると、リボンには次の特性があります。
- すべてのコマンドの 1 つのユーザー インターフェイス (UI)。 メニュー バーは包括的で簡単に学習でき、ツール バーは効率的で直接的ですが、これらすべてを実現する単一のコマンド UI を作成するために、もう少し画面領域を使用しないのはなぜですか? UI が 1 つだけの場合、リボンでは、ユーザーが探しているコマンドを持つ UI を把握する必要はありません。
- 目に見える、わかりやすい。 メニュー バーのコマンドは、ラベルを通してわかりやすいですが、ほとんどの場合、表示されません。 画面領域を節約するために、ツール バー ボタンは主にラベルではなくアイコンで表され (一部のツール バー ボタンでは両方を使用します)、アイコンがわかりやすい場合はヒントに依存します。 ただし、ユーザーは通常、最もよく使用されるコマンドのアイコンのみを認識します。
- ほとんどのコマンドにラベル付きアイコンを表示することで、リボン コマンドは表示され、わかりやすいものになり、補足情報を提供するためにのみツールヒントを使用します。 コマンドを理解するために他の場所 (ヘルプなど) に移動する必要はほとんどありません。
- ラベル付きグループ化。 メニュー カテゴリにはラベルが付けられますが、ドロップダウン メニュー内のグループは表示されず、ラベルのない区切り記号でのみ示されます。 ツール バー内のグループも、ラベルのない区切り記号で示されます。
- リボンは、ラベル付けされたグループにコマンドを整理することで、コマンドを見つけて目的を特定しやすくします。
- モーダルですが、階層構造ではありません。 メニュー バーは、コマンドの階層を作成してスケーリングします。 項目が多いメニューでは、1 つ以上のレベルのサブメニューを使用して、より多くのコマンドを提供できます。
- リボン コマンドはツールバー コマンドよりも多くの領域を必要とするため、タブを使用してスケーリングします。 このタブを使用するとリボンがモーダルになり、ユーザーはコマンドを見つけるためにモードを変更する必要があります。 ただし、タブ内のほとんどのコマンドは、階層ではなく、直接または単一の分割ボタンまたはメニュー ボタンを使用します。
- 直接および即時。 コマンドは、1 回のクリックで呼び出された場合は直接実行され (つまり、メニュー内を移動せずに)、すぐに有効な場合は即時に実行されます (つまり、追加の入力を収集するためのダイアログ ボックスはありません)。 メニュー バーのコマンドは常に間接的であり、多くの場合、すぐには実行されません。 ツールバーと同様に、ほとんどのリボン コマンドは直接的かつ即時に設計されており、頻繁に使用されるコマンドは 1 回のクリックで呼び出され、ダイアログで追加の入力を収集する必要はありません。
- 広い。 メニュー バーとツールバーは、主にスペース効率が高いよう設計されています。 その利点を提供するために、リボンは、メニュー バーとツールバーの 3 行とほぼ同じ、より多くの垂直方向のスペースを消費する可能性があります。 ツールバーの行が 3 行以上あるプログラムがほとんどないため、リボンでは通常、コマンドの従来の UI よりも多くの領域が使用されます。
- アプリケーション ボタンとクイック アクセス ツール バーがあります。 リボンには、常にアプリケーション ボタンとクイック アクセス ツール バーが表示されます。 これにより、ユーザーはタブを変更せずにファイル関連の頻繁に使用されるコマンドにアクセスでき、プログラム間の一貫性が促進されます。
- 最小限のカスタマイズ。 メニュー バーには固定のプレゼンテーションが用意されていますが、多くのツールバーは非常にカスタマイズ可能であり、ユーザーは場所、サイズ、コンテンツを設定できます。 リボン自体はカスタマイズできませんが、クイック アクセス ツール バーではカスタマイズが制限されます。
- キーボードのアクセシビリティが向上しました。 Alt キーを押すとメニュー バーの入力フォーカスが直接表示されるため、メニュー バーはキーボードのアクセシビリティに優れています。 ただし、ツール バーには、ウィンドウのコンテンツとキーボード ナビゲーションを共有するため、このようなメカニズムはありません。 その結果、ユーザーは Tab キーを使用してツール バーに移動し (最後のタブ位置が与えられます)、方向キーを使用して特定のコマンドに移動する必要があります。
これに対し、リボンは キーヒントを通じてキーボード アクセシビリティを強化します。通常は、次の 3 ステップのプロセスを使用します。
Alt キーを押してキーヒント モードに入ります。
文字を押して、クイック アクセス ツール バーのタブ、アプリケーション ボタン、またはコマンドを選択します。
タブ内で、1 文字または 2 文字を押してコマンドを選択します。
このアプローチは非常に視覚的です。 また、柔軟性が高く、スケーリングが向上し、ニーモニック アクセス キーの割り当てが増えます。
アクセス キーとショートカット キーを混同しないでください。 アクセス キーとショートカット キーの両方が UI へのキーボード アクセスを提供しますが、目的とガイドラインは異なります。 詳細については、「 キーボード」を参照してください。
豊富なコマンドの性質
リッチ コマンドは、リボン コンテナーを使用せずに、リボンで使用されるコマンドのプレゼンテーションと相互作用を参照します。 リッチ コマンドには、次の特性があります。
ラベル付け。 すべてのコマンドにはわかりやすいラベルが付けられますが、アイコンが非常によく知られており、スペースが高い場合にのみ例外があります。
正確:
これらのコマンドは非常によく知られているので、ラベルは必要ありません。
正しくない:
これらの判読不可能なアイコンには、豊富なコマンドのラベルが必要です。
サイズ。 コマンドは、均一なサイズ設定の代わりに、使用頻度と重要度に対して相対的なサイズになります。 最も頻繁に使用されるコマンドを見つけてクリックしやすくするだけでなく、 よりタッチ可能になります。
この例では、最もよく使用されるボタンが他のボタンよりも大きくなります。
動的サイズ変更。 豊富なコマンド コントロールは、サイズが小さすぎる場合に切り捨てたりオーバーフローを使用したりするのではなく、使用可能な領域を最大限に活用するようにサイズを変更します。
この例では、コマンド ボタンのサイズが、使用可能な領域で適切に動作するように変更します。
[分割] ボタン。 分割ボタンは、最も頻繁に使用されるコマンドの直接的性を維持しながら、必要に応じてコマンドのバリエーションのセットを統合する優れた方法です。
この例では、[名前を付けて保存] コマンドは分割ボタンを使用します。メイン ボタンは最も一般的なバリエーションを実行し、メニュー部分にはコマンドのバリエーションを含むメニューが表示されます。
豊富なドロップダウン メニューとギャラリー。 ドロップダウン メニュー、ドロップダウン リスト、ギャラリーでは、多くの場合、グラフィックスとテキストの説明を使用して、選択内容の通信と効果を区別するために必要な領域を使用します。 カテゴリは、大規模なオプション セットを整理するために使用されます。
これらの例では、メニュー ボタンをクリックすると、その効果を示す選択肢の一覧が表示されます。
ライブ プレビュー。 ユーザーが書式設定オプションにカーソルを合わせると、実際のコンテンツを使用してその書式設定で結果が表示されます。
ライブ プレビューでは、ホバー時に書式設定オプションを適用した結果が表示されます。
拡張されたツールヒント。 これらは、関連するコマンドを簡潔に説明し、ショートカット キーを与えます。 また、グラフィックスやヘルプへの参照も含まれる場合があります (ただし、コマンド関連のヘルプの必要性は大幅に排除されます)。
拡張ツールヒントでは、関連するコマンドについて簡潔に説明します。
リボンはすべてのプログラムに適しているわけではありませんが、すべてのプログラムが豊富なコマンドの恩恵を受ける可能性があります。
リボンには常に [アプリケーション] ボタンとクイック アクセス ツール バーがあります
アプリケーション ボタンとクイック アクセス ツール バーには、任意のコンテキストで役立つコマンドが用意されているため、タブを変更する必要が減ります。 これら 3 つのコンポーネントは論理的に独立していますが、リボンには常に [アプリケーション] ボタンと [クイック アクセス ツール バー] が必要です。 コマンドがリボンまたは [アプリケーション] ボタンのどちらに配置できるかを考えると、コマンドを配置する場所が疑問に思われる場合があります。 選択は任意ではありません。
[アプリケーション] ボタンを使用すると、ファイルの作成、開き、保存、文書の印刷、送信、発行を行うために従来は [ファイル] メニューに表示されるコマンドなど、ファイルとの間で何かを行うコマンドのメニューが表示されます。
これに対し、リボン自体は、ウィンドウの内容に影響を与えるコマンド用です。 たとえば、コンテンツの読み取り、変更、または使用、またはビューの変更に使用されるコマンドが含まれます。
リボンを使用する場合は、プログラムにドキュメントやファイルが含まれていない場合でも、[アプリケーション] ボタンを使用する必要があります。 このような場合は、[アプリケーション] メニューを使用して、プログラムの印刷、プログラム オプション、およびプログラムの終了に関するコマンドを表示します。 間違いなく、アプリケーション ボタンはこのようなプログラムには必要ありませんが、使用すると、プログラム間で一貫性が提供されます。 ユーザーは常に同じ場所にあるため、保存および元に戻すコマンドやプログラム オプションを探す必要はありません。
リボンでタブが 1 つだけ使用されている場合でも、クイック アクセス ツール バーが必要です。繰り返しますが、このようなプログラムにはクイック アクセス ツール バーは必要ありません (すべてのコマンドが既に 1 つのタブに存在するため)、カスタマイズ可能なクイック アクセス ツール バーを使用すると、プログラム間で一貫性が提供されます。 たとえば、ユーザーが [印刷] コマンドをクリックする習慣がある場合は、リボンを使用するすべてのプログラムで行うことができます。
組織と検出可能性
タブとグループを指定することで、リボンを使用してコマンドを整理し、検出を支援できます。 課題は、組織が不適切に実行されると、代わりに検出可能性に大きな損害を与える可能性があるということです。 コマンドと、わかりやすいラベルが付いたタブとグループの間には、明確で明白で一意のマッピングが存在する必要があります。
ユーザーは、しばらく使用した後、リボンのメンタル モデルを形成します。 そのメンタル モデルがユーザーにとって意味をなさない、非効率的な、または正しくない場合は、混乱と欲求不満につながります。 リボンを設計する上で最も重要な目標は、コマンドを迅速かつ確実に見つけることです。 これを行わないと、リボンのデザインは失敗します。 この目標を達成するには、慎重な設計、ユーザー テスト、反復が必要です。 それが簡単になるとは思ってはいけません。
回避する一般的な落とし穴を次に示します。
- 汎用タブ名とグループ名は使用しないでください。 適切なタブ名またはグループ名では、タスクベースの言語と目標ベースの言語を使用して、その特定の内容を正確に記述する必要があります。 一般的なタブ名とグループ名だけでなく、テクノロジベースの名前も避けてください。 たとえば、ドキュメント作成および作成プログラムのほぼすべてのコマンドは、[編集]、[書式]、[ツール]、[オプション]、[詳細設定]、[その他] というラベルのタブに属している可能性があります。 記憶ではなく、特定のわかりやすいラベルに依存します。
- 過度に特定のタブ名とグループ名は避けてください。 タブ名とグループ名を特定する必要がある一方で、ユーザーがコンテンツに驚くほど具体的にすることはできません。 ユーザーは、多くの場合、削除のプロセスを使用して物事を探すので、名前が誤解を招くため、タブやグループを見落とさないようにします。
- 特に、パスが予期しない場合や、コマンドで呼び出すために多くのクリックが必要な場合は、同じコマンドへの複数のパスを避けてください。 複数のパスを使用してコマンドを見つけるのが便利なように思える場合があります。 ただし、ユーザーが探しているものを見つけると、探すのをやめることに注意してください。 ユーザーが見つけた最初のパスが唯一のパスであり、そのパスが非効率的または予期しない場合に重大な問題であると仮定するのは簡単すぎます。 さらに、重複するコマンドを使用すると、ユーザーがスキャン対象の他のコマンドを見つけるのが困難になります。
この例では、[ホーム] タブに直接パスがある場合でも、[ページ罫線] コマンドを使用して段落罫線を変更できます。段落の罫線を探しているユーザーがこの予期しないパスに遭遇した場合、それが唯一のパスであると簡単に思い込む可能性があります。
- 任意のコマンドの配置は避けてください。 タブとグループのデザインは適切だと思いますが、いくつかのコマンドが収まらないことに気が付くとします。 おそらく、タブとグループのデザインは思ったほど適切ではなく、引き続き調整する必要があります。 これらのコマンドが属していない場所に配置することで、この問題を解決しないでください。 その場合、ユーザーはタブを見つけるためにすべてのタブを検査し、すぐにそれらがどこにあるかを忘れる必要があります。
- マーケティングベースの配置は避けてください。 プログラムの新しいバージョンがあり、マーケティング チームが新しい機能を昇格したいと考えているとします。 [ホーム] タブに配置するのは魅力的かもしれませんが、全体的な検出可能性を損なう場合は、コストのかかる間違いです。 製品の将来のバージョンと、絶え間なく変化する組織のフラストレーションの原因を検討してください。
タブ
最初に、 標準のリボン タブを確認することをお勧めします。 プログラムのコマンドが標準タブに自然にマップされる場合は、これらの標準に基づいてタブ編成を作成します。 一方、プログラムのコマンドが自然にマップされない場合は、強制的に実行しないでください。 より自然な構造を決定し、多くのユーザー テストを実行して、正しいことを確認してください。
標準以外のタブの場合は、次の問題を考慮してください。
- 各タブ名は、その内容を記述する必要があります。 特定の意味のある名前を選択しますが、あまり具体的ではありません。 ユーザーがコンテンツに驚くことはありません。
- 各タブ名は、その目的を反映している必要があります。 コマンドに関連付けられている目標またはタスクを検討してください。
- 各タブ名は、他のすべてのタブ名とは明確に区別する必要があります。
[ホーム] タブは、これらの考慮事項の例外です。 ホーム タブは必要ありませんが、ほとんどのプログラムは必要です。 [ホーム] タブは最初のタブで、最もよく使用されるコマンドが含まれています。 他のタブに収まらないコマンドを頻繁に使用している場合は、[ホーム] タブが適切な場所です。
意味のあるわかりやすいタブ名を特定できない場合は、タブが適切に設計されていない可能性があります。 リボン組織が機能していない場合は、タブのデザインを再検討してください。
グループ
コマンドをグループに分割すると、コマンドは関連するセットに構成されます。 グループ ラベルは、そのコマンドの一般的な目的を説明します。
グループとそのプレゼンテーションを決定する際に考慮すべきさまざまな要因があります。
- 標準のグループ化。 プログラム間でコマンドに大きな違いがありますが、多くのプログラムで共通する 標準グループ があります。 これらのコマンドを同じ名前と同じ場所に表示すると、検出可能性が大幅に向上します。
| 正解 | 不正解 |
|---|---|
 編集コマンド グループにはすべての編集コマンドが含まれますが、Zoom コマンドは含まれません。 |
 Zoom コマンドは編集コマンドではありませんが、編集グループ内にあります。 |
- Granularity。 いくつかの構造は良いですが、あまりにも多くの構造は、コマンドを見つけるのが難しくなります。 グループ名が汎用の場合は、十分な粒度が得られない可能性があります。 各コマンドが 1 つまたは 2 つのグループしかない場合は、多すぎる可能性があります (ただし、グループ内に他のコマンドを含まないリボン内ギャラリーを持つことは許容されます)。
| 正解 | 不正解 |
|---|---|
編集コマンド グループには、すべての編集コマンドが含まれています |
 編集コマンド グループは、細かいセクションに分割されています。 1 つまたは 2 つのコマンドのみを含むグループは避けてください。 |
- 名前。 適切なグループ名は、コマンドの目的を説明します。 グループ名が表示されない場合は、名前またはグループ化を再検討してください。 意味のあるわかりやすい名前を特定できない場合は、グループが適切に設計されていないためと考えられます。
| 正解 | 不正解 |
|---|---|
 グループに含まれるコマンドを記述するのに十分な固有のグループ名を使用します。 |
 このグループ名はあいまいすぎて役に立ちません。 より良い方法は、これらのコマンドをより具体的なグループに再編成することです。 |
- 順序。 人々は左から右の順序で読むので(西洋の文化では)、左端のグループが最も顕著であると思うかもしれません。 ただし、強調表示されたタブ名とウィンドウコンテンツは 焦点として機能する傾向があるため、通常、タブの中央にあるグループは左端のグループよりも注目を集めます。 最もよく使用されるグループを最も目立つ場所に配置し、タブ全体にグループの論理フローがあることを確認します。
この例では、[フォント] グループと [段落] グループの方がクリップボード グループよりも目立ちます。これは、ドキュメントから上に移動するときに目が最初に表示されるためです。
この例では、強調表示された [校閲] タブが焦点として機能するため、追跡グループが最も注目を集めます。
- 均一 性。 コマンドプレゼンテーションがすべて同じように見えると、コマンドを認識するのが難しい場合があります。 さまざまな図形と色のアイコン、さまざまな形式のグループ、さまざまなサイズのコマンドを使用すると、ユーザーはコマンド グループを簡単に認識できます。 コマンドのサイズは、リボンのサイズが小さいサイズに縮小された場合にのみ、一様に設定する必要があります。
| 正解 | 不正解 |
|---|---|
 さまざまなアイコン サイズを使用して認識可能性を向上させる |
 これらのコマンドは、すべて同じサイズであるため、互いに似ています。 |
プレビュー
さまざまな種類のプレビューを使用して、コマンドの結果を示すことができます。 役に立つプレビューを使用することで、プログラムの効率を向上させ、試用版とエラーの学習アプローチの必要性を減らすことができます。 ライブ プレビューでは、実験を招待し、創造性を高めます。
使用できるプレビューの種類をいくつか次に示します。
- リアルな静的アイコンとグラフィックス。 コマンドの効果をリアルに示す静的画像。 これらは、ギャラリー、ドロップダウン メニュー、および拡張ツールヒントで使用できます。
この例では、[フォント] ドロップダウン リストに、フォント自体を使用して各フォント名が表示されます。
この例では、リアルなサムネイルを使用してさまざまな透かしを表示します。
- 動的なアイコンとグラフィックス。 現在の状態を反映するように変更されたアイコンとグラフィックス。 このようなアイコンは、ギャラリーだけでなく、最後のアクションと同じになるように既定の効果を変更する分割ボタンに特に便利です。
この例では、Microsoft Wordは現在のスタイルを反映するようにスタイル ギャラリーを変更します。
この例では、[テキストの強調表示の色] コマンドと [フォントの色] コマンドを変更して、現在の効果を示します。
- ライブ プレビュー。 ユーザーが書式設定オプションにカーソルを合わせると、ライブ プレビューでは、その書式設定で結果がどうなるかを示します。 ライブ プレビューは、ユーザーの実際のコンテキストに基づいて、選択をより効率的かつ確実に行うのに役立ちます。
この例では、[Page Color]\(ページの色\) コマンドは、ホバー時のカラー オプションの効果を表示してライブ プレビューを実行します。
ライブ プレビューは、ユーザーの生産性を本当に向上させる強力な機能ですが、単純な静的プレビューでも大きな助けになります。
リボンのスケーリング
ツールバーのスケーリングは簡単です。ウィンドウが狭すぎてツールバーを表示しない場合、ツールバーには適合するものが表示され、オーバーフロー ボタンを介して他のすべてにアクセスできるようになります。 豊富なコマンドの目的は、使用可能な領域を最大限に活用することです。そのため、リボンをスケーリングするには、より多くの設計作業が必要です。 既定のリボン サイズがないため、特定の幅を考慮してリボンをデザインしないでください。 幅広い幅のレイアウトを設計し、そのうちの 1 つがほとんどのユーザーに表示される可能性があることを認識する必要があります。 スケーリングはリボン デザインの基本的な部分であり、最後の手順ではありません。 タブを設計するときは、グループごとに異なるレイアウト (最大 3 つ) と、一緒に使用できる組み合わせを指定します。 リボンには、現在のウィンドウ サイズに合った最大の有効な組み合わせが表示されます。
ツール バーはオーバーフロー ボタンを使用してスケーリングします。
既定のリボン サイズはありません。 最小サイズは、1 つのポップアップ グループ アイコンです。
ガイドライン
全般
- リボンと、ウィンドウ内のメニュー バーとツールバーを組み合わせないでください。 リボンは、メニュー バーとツールバーの代わりに使用する必要があります。 ただし、リボンはパレット ウィンドウやナビゲーション要素 ([戻る] ボタンや [進む] ボタン、アドレス バーなど) と組み合わせることができます。
- リボンと [アプリケーション] ボタンとクイック アクセス ツール バーを常に組み合わせます。
- プログラムの起動時に左端のタブ (通常はホーム) を選択します。 プログラム インスタンス間で最後に選択したタブを保持しないでください。
- プログラムが初めて開始されたときにリボンを通常の状態 (最小化しない) で表示します。 多くの場合、ユーザーは既定の設定を変更せずに、プログラムの開始時にリボンを最小化すると、すべてのコマンドの効率が低下する可能性があります。 また、リボンを最初に最小化して表示すると、見当がつからなされることがあります。
- プログラム インスタンス間でリボンの状態を維持します。 たとえば、ユーザーがリボンを最小化する場合は、次回プログラムを実行する際に最小化されたリボンが表示されます。 ただし、ここでも、最後に選択したタブをこの方法で保持しないでください。
タブの使用
一般に、タブの数を減らした方が良いので、これらの目標を達成するのに役立たないタブを削除します。
- 実用的な場合は常に、標準タブを使用します。 標準タブを使用すると、特にプログラム間で検出可能性が大幅に向上します。 この記事の後半にある 標準のリボン タブ を参照してください。
- 必要に応じて、最初のタブ [ホーム] にラベルを付けます。 [ホーム] タブには、最もよく使用されるコマンドが含まれている必要があります。 他のタブに収まらないコマンドを頻繁に使用している場合は、[ホーム] タブが適切な場所です。
- 次の場合は、新しいタブを追加します。
- そのコマンドは特定のタスクに強く関連しており、タブ ラベルで正確に記述できます。 タブを追加すると、コマンドを簡単に見つけやすくなります。難しくありません。
- そのコマンドは、他のタブのタスクとはほとんど関係ありません。 一般的に実行されるタスクの間にタブを追加する場合、さらにタブを切り替える必要はありません。
- タブには、見る場所が追加されていることを正当化するのに十分なコマンドがあります。 少数のコマンドのみを含むタブはありません。 例外： 特定のタスクに強く関連している場合は、いくつかのコマンドを含むタブを追加することを検討し、タブを追加すると、過度に複雑な [ホーム] タブが大幅に簡略化されます。
- 残りのタブでは、最も頻繁に使用されるタブを最初に配置し、タブ間で論理的な順序を維持します。
- ユーザーが迅速かつ確実にコマンドを検索できるように、タブデザインを最適化します。 その他の考慮事項はすべてセカンダリです。
- [ヘルプ] タブは指定しないでください。 代わりに、プログラム全体のヘルプと拡張ツールヒントを使用してサポートを提供します。
- 最大 7 つのコア タブを使用します。 7 つ以上ある場合、コマンドを持つタブを特定することが困難になります。 多くのコマンドを使用するアプリケーションでは、7 つのコア タブが許容されますが、ほとんどのプログラムでは 4 つ以下のタブを目指す必要があります。
コンテキスト タブ
- コンテキスト タブを使用して、ユーザーが特定のオブジェクトの種類を選択した場合にのみ関連するコマンドのコレクションを表示します。 頻繁に使用されるコマンドが少ない場合は、通常のタブを使用する方が便利で安定し、適用されない場合はコマンドを無効にするだけです。
コンテキスト タブを使用するよりも、Cut や Copy などの一般的なコマンドを無効にすることをお勧めします。- 特定のオブジェクトの種類に固有のコマンドのみを含めます。 ユーザーが最初にオブジェクトを選択せずにコマンドを必要とする場合は、コンテキスト タブにのみコマンドを配置しないでください。
- 特定のオブジェクトの種類を操作するときによく使用されるコマンドを含めます。 よく使用される一般的なコンテキスト コマンドをコンテキスト メニューとミニ ツールバーに配置して、一般的に実行されるタスク中にタブの切り替えを回避します。 または、頻繁なタブ切り替えを回避する場合は、一般的なコマンドをコンテキスト タブに冗長に配置することを検討してください。 ただし、これを実行しないでください。オブジェクトの操作中にユーザーが必要とする可能性のあるすべてのコマンドを含めないでください。
この例では、一般的に実行されるタスク中に頻繁にタブを切り替えないように、[デザイン] タブに [罫線] コマンドが含まれています。- 現在表示されているコンテキスト タブとは異なるコンテキスト タブの色を選択します。 同じタブ セットは、これを実現するために別の色を使用して後で表示できますが、可能な限り呼び出し間で一貫した色の割り当てを使用してください。
- コンテキスト タブを選択すると、検出可能性が自動的に 向上し、安定性の認識が向上し、タブを切り替える必要が減ります。 コンテキスト タブは、次の場合に自動的に選択します。
- ユーザーがオブジェクトを挿入します。 この場合は、セット内の最初のコンテキスト タブを選択します。
- ユーザーがオブジェクトをダブルクリックします。 この場合は、セット内の最初のコンテキスト タブを選択します。
- ユーザーがコンテキスト タブを選択し、オブジェクトをクリックした後、すぐに同じ種類のオブジェクトをクリックしました。 この場合は、前に選択したコンテキスト タブに戻ります。
- アクティブなタブであるコンテキスト タブを削除する場合は、[ホーム] タブまたは最初のタブをアクティブなタブにします。 そうすると、最も安定しているように見えます。
モーダル タブ
- モーダル タブを使用して、特定の一時モードで適用されるコマンドのコレクションを表示し、コア タブは適用しません。 コア タブの一部が適用される場合は、代わりにコンテキスト タブを使用し、適用されないコマンドを無効にします。 モーダル タブは非常に制限されているため、より良い代替手段がない場合にのみ使用する必要があります。
印刷プレビューは、一般的に使用されるモーダル タブです。- モーダル タブを閉じるには、タブの最後のコマンドとして [モードを閉じる<>] コマンドを配置します。コマンドを簡単に見つけるには、[閉じる] アイコンを使用します。 コマンドのモードを指定して、閉じている内容に関する混乱を防ぎます。
この例では、モードで Close コマンドに明示的にラベルを付けると、何が閉じられているのかを疑う必要がなくなります。- モーダル タブを閉じるには、ウィンドウのタイトル バーの [閉じる] ボタンを再定義して、プログラムの代わりにモードを閉じます。 ユーザー テストでは、多くのユーザーがこの動作を期待していることが示されています。
標準リボン タブ
実用的な場合は常に、プログラムのコマンドを標準の外観順に指定された標準タブにマップします。
標準タブ
- ホーム。 最もよく使用されるコマンドが含まれています。 使用する場合は、常に最初のタブになります。
- 挿入。 ドキュメントにコンテンツとオブジェクトを挿入するコマンドが含まれています。 使用する場合は、常に 2 番目のタブになります。
- ページ レイアウト。 テーマ、ページ設定、ページの背景、インデント、間隔、配置など、ページ レイアウトに影響を与えるコマンドが含まれます。 (十分なスペースがある場合は、[ホーム] タブにインデントグループとスペース グループを置くことができます)。使用する場合は、常に 3 番目のタブになります。
- レビュー。 コメントの追加、変更の追跡、バージョンの比較を行うコマンドが含まれています。
- ビュー。 表示モード、表示/非表示オプション、ズーム、ウィンドウ管理、Windowsメニュー カテゴリで従来見つかったコマンドのマクロなど、ドキュメント ビューに影響を与えるコマンドが含まれます。 使用する場合は、[開発者] タブが表示されていない限り、最後の通常のタブになります。
- 開発者。 開発者のみが使用するコマンドが含まれています。 使用すると、既定では非表示になり、最後の標準タブが表示されます。
ほとんどのプログラムでは、[レビュー] タブと [開発者] タブは必要ありません。
標準コンテキスト タブ
- フォーマットします。 選択したオブジェクトの種類の形式の変更に関連するコマンドが含まれています。 通常、オブジェクトの一部に適用されます。
- 設計: 機能要件に基づいて、物理的な設計仕様が作成されます。 選択したオブジェクトの種類にスタイルを適用するコマンドがギャラリー内で多く含まれています。 通常、オブジェクト全体に適用されます。
- レイアウト。 テーブルやグラフなど、複雑なオブジェクトの構造を変更するコマンドが含まれています。
書式、デザイン、レイアウトに関連するコンテキスト コマンドがあるが、複数のタブでは不十分な場合は、[書式] タブを指定するだけです。
標準グループ
- 実用的な場合は常に、標準グループを使用します。 同じ名前と同じ場所に共通のコマンドを表示すると、検出可能性が大幅に向上します。 この記事の後半にある 標準のリボン グループ を参照してください。
- 次の場合に新しいグループを追加 します。
- そのコマンドは強く関連しており、グループ ラベルで正確に記述できます。 グループを追加すると、コマンドの検索が容易になります。難しくありません。
- そのコマンドは、他のグループのコマンドと弱い関係を持ちます。 タブ上のすべてのコマンドは厳密に関連している必要があります。一部のコマンドリレーションシップは他のコマンドよりも強力です。
- グループには、見る場所が追加されていることを正当化するのに十分なコマンドがあります。 ほとんどのグループで 3 ~ 5 個のコマンドを目指します。 1 ~ 2 個のコマンドのみを含むグループは使用しないでください。ただし、グループ内に他のコマンドを含まないリボン 内ギャラリーを使用してもかまいません。 1 つのコマンドを持つグループが多数あると、構造が多すぎるか、コマンドの凝集が不足している可能性があります。
- 必要のないグループを追加して過剰に整理しないでください。
- 次の場合は、グループの分割を検討してください 。
グループには、さまざまなサイズとニーズの組織の多くのコマンドがあります。
グループには、追加のラベルを持つことで大きなメリットを得るコマンドがあります。
- 最も一般的に使用されるグループを最も目立つ場所に配置し、タブ全体のグループの論理的な順序があることを確認します。
- ユーザーが迅速かつ確実にコマンドを見つけられるように、グループの設計を最適化します。 その他の考慮事項はすべてセカンダリです。
- 1 つのボタンを含むグループをポップアップ グループ アイコンにスケールしないでください。 スケールダウンする場合は、1 つのボタンのままにします。
- 最大 7 つのグループを使用します。 グループが 7 つを超える場合は、どのグループにコマンドがあるかを判断することが困難になります。
標準リボン グループ
実用的な場合は常に、プログラムのコマンドをこれらの標準グループにマップします。これらの標準グループは、関連するタブ内で標準の外観順に表示されます。
メイン タブ
- クリップボードのトピック
- フォント
- 段落
- 編集
[挿入] タブ
- テーブル
- 図
[ページ レイアウト] タブ
- テーマ
- ページ設定
- 整列
[校
- Proofing
- コメント
[表示] タブ
- ドキュメント ビュー
- 表示/非表示
- ズーム
- ウィンドウ
コマンド
一般的に使用されるすべてのコマンドを公開することで、リボンの検出可能性とスケーラビリティを活用します。 必要に応じて、頻繁に使用されるコマンドをダイアログ ボックスからリボンに移動します。特に、見つけにくいことがわかっているコマンドに移動します。 理想的には、ユーザーはダイアログ ボックスを使用せずに一般的なタスクを実行できる必要があります。リボンのスケーラビリティを使用して、不要な複雑さを追加することを正当化しないでください。 引き続き拘束を実行しても、できる理由だけでリボンにコマンドが追加されることはありません。 全体的なコマンド エクスペリエンスをシンプルに保ちます。 プレゼンテーションを簡略化する方法を次に示します。
コンテキスト メニューとミニ ツールバーは、インプレースのコンテキスト コマンドに使用します。- ダイアログ ボックスで頻繁に使用されるコマンドを移動 (または保持) します。 これらのコマンドにアクセスするには、ダイアログ ボックス起動ツールを使用します。 ダイアログ ボックスはリボンで引き続き使用できます。 一般的なタスク中に使用する必要性を減らしてみてください。
- 冗長で使用頻度の低い機能を排除します。
プレゼンテーション
各コマンドを 1 つのタブにのみ表示します。同じコマンドへの複数のパスは避けてください。特に、コマンドで多数のクリックを呼び出す必要がある場合。 複数のパスを使用してコマンドを見つけるのが便利なように思える場合があります。 しかし、ユーザーが探しているものを見つけると、探すのをやめることに注意してください。 ユーザーが見つけた最初のパスが唯一のパスであり、そのパスが非効率的な場合に重大な問題であるとユーザーが想定するのは簡単すぎます。 例外： コンテキスト タブを使用すると、一般的なコンテキスト タスクのタブを変更できなくなる場合、コンテキスト タブで [ホーム] タブと [挿入] タブからいくつかのコマンドが重複する可能性があります。
グループ内で、最も頻繁に使用されるコマンドを優先しながら、コマンドを論理的な順序で配置します。 全体として、コマンドには、最も頻繁に使用されるコマンドが最初に表示される一方で、コマンドを見つけやすくするための論理フローが必要です。 一般に、32 x 32 ピクセル のアイコンを持つコマンドは、16 x 16 ピクセル のアイコンを含むコマンドの前に表示され、グループ間のスキャンを支援します。
頻繁に使用されるコマンドの横に破壊的コマンドを配置しないでください。 コマンドの効果が広範囲に及び、簡単に元に戻すことができないか、効果がすぐに顕著でない場合、コマンドは破壊的であると見なされます。
区切り記号を使用して、相互に排他的なオプションのセットなど、強く関連するコマンドを示します。
ラベルを必要としない、強く関連する既知のコマンドのセットには、ツール バー スタイルのグループを使用することを検討してください。 これにより、発見可能性と学習の容易さに影響を与えることなく、コンパクトな空間に多くのコマンドを表示できます。 よく知られているように、このようなコマンドは頻繁に使用され、すぐに認識されるため、[ホーム] タブに表示される傾向があります。最も頻繁に使用される重要なラベル付きコマンドには、32 x 32 ピクセルのアイコンを使用します。 グループをスケールダウンするときは、これらのコマンドを最後に 16 x 16 ピクセル のアイコンに変換します。
任意のコマンドの配置を避けます。 ユーザーが必要なコマンドを見つけるためにすべてのタブの検査に時間を無駄にしないように、タブとグループのデザインについて慎重に検討してください。
マーケティングベースの配置は避けてください。 新機能のプロモーションに関するマーケティング目標は、時間の経過と伴って変化する傾向があります。 製品の将来のバージョンと、絶えず変化する組織がどれだけのフラストレーションを引き起こすかを検討してください。
対話
現在のコンテキストに適用されないコマンド、または直接エラーが発生するコマンドを無効にします。 役立つ場合は、 拡張ツールヒント を使用して、コマンドが無効になっている理由を説明します。 このようなコマンドを非表示にしないでください。これを行うと、リボンレイアウトが変更され、リボンのプレゼンテーションが不安定になる可能性があるためです。
コマンド ラベルを動的に更新しないでください。 この場合も、タブ レイアウトが変更され、外観が不安定になる可能性があります。 代わりに、コマンドを設計して、定数ラベルを使用できるようにします。
正解 不正解 
使用できないときにコマンドを無効にする
使用できない場合でも、コマンドを非表示にしないでください直接コントロールを優先します。 コマンドは、1 回のクリックで呼び出された場合 (つまり、メニュー内を移動せずに) 直接実行されます。 ただし、リボン内ギャラリーを除き、直接コントロールは Live プレビューをサポートしないため、Live プレビューの必要性も要因です。
Live プレビューを使用して 、コマンドが関連する書式設定オプションのセットに含まれている場合にオプションの効果を示します。特に、ユーザーが間違ったオプションを選択する可能性がある場合は、Live プレビューが重要で実用的です。
- コマンドが頻繁に使用される場合は、リボン内ギャラリーを使用して直接表示します。
- コマンドを頻繁に使用しない場合は、ドロップダウン ギャラリーを使用します。
次のコントロールを使用して直接コマンドを次の優先順位で公開する
- コマンド ボタン、チェック ボックス、ラジオ ボタン、インプレース ギャラリー。 これらは常に直接的です。
- 分割ボタン。 最も一般的なコマンドを直接指定しますが、コマンド バリエーションの場合は間接的です。
- メニュー ボタン。 これらは間接的ですが、検索しやすいコマンドが多数存在します。
- テキスト ボックス (スピン コントロール付き)。 通常、テキスト入力には他のコントロール型よりも多くの労力が必要です。
フル サイズで表示されるときにリボンがメニュー ボタンで構成されている場合は、メニュー バーを使用することもできます。即時コマンドを優先します。
コマンドがすぐに有効な場合 (つまり、追加の入力を収集するためのダイアログ ボックスがない場合)、コマンドは即時に実行されます。 コマンドに入力が必要な場合は、分割ボタンを使用し、ボタン部分に即時コマンドを、サブメニューで入力を必要とするコマンドを使用することを検討してください。
ギャラリー
次の場合にギャラリーを使用します。
- ユーザーが通常選択する適切に定義された関連する選択肢があります。 無制限のバリエーションの数が存在する可能性がありますが、多くの場合、選択内容は適切に含まれている必要があります。 選択肢が強く関連していない場合は、個別のギャラリーを使用することを検討してください。
- 選択内容は、書式設定機能など、視覚的に表現するのが最適です。 サムネイルを使用すると、参照、理解、選択が容易になります。 選択肢にはラベルを付けることができますが、選択内容は視覚的に行われ、選択内容を理解するためにテキスト ラベルは必要ありません。
- 選択すると、1 回のクリックですぐに達成される結果が表示されます。 ユーザーの意図をさらに明確にするためのフォローアップ ダイアログ ボックスや、示された結果を達成するための一連の手順は表示されません。 ユーザーが選択を調整したい場合は、後で行います。
次の場合は、リボン内ギャラリーを使用 します。
- 選択肢は頻繁に使用されます。 選択肢にはスペースが必要であり、他のコマンドから取得される可能性のあるスペースの価値があります。
- 一般的な用途では、表示された選択肢をグループ化またはフィルター処理する必要はありません。
- 選択内容は、リボンの高さ (48 ピクセル) 内で効果的に表示できます。
ギャラリー内のサムネイル
ジョブを適切に実行する最小の標準ギャラリーサムネイル サイズを選択します。
- リボン内ギャラリーの場合は、16 x 16、48 x 48、または 64 x 48 ピクセルのサムネイルを使用します。
- ドロップダウン ギャラリーの場合は、16x16、32x32、48x48、64x48、72x96、96x72、96x96、または 128 x 128 ピクセルのサムネイルを使用します。
- すべてのギャラリー 項目のサムネイル サイズは同じである必要があります。
リボン内ギャラリーの場合:
- 少なくとも 3 つの選択肢を表示します。部屋があればもっと。 一般的なウィンドウ サイズに少なくとも 3 つの選択肢を表示するのに十分な領域がない場合は、代わりにドロップダウン ギャラリーを使用します。
- リボン内ギャラリーを展開して、使用可能なスペースを活用します。 追加のスペースを使用して、項目を表示し、1 回のクリックで簡単に選択できるようにします。
ドロップダウン ギャラリーの場合:
- コンボ ボックス、ドロップダウン リスト、分割ボタン、またはメニュー ボタンからギャラリーを表示します。
- ユーザーがメイン ウィンドウをクリックしてドロップダウン ギャラリーを閉じる場合は、メイン ウィンドウの内容を選択または変更せずにギャラリーを閉じます。
- ギャラリーに多くの選択肢があり、一部の選択肢はほとんど使用されない場合は、一般的に使用される選択肢に焦点を当てることで、既定のギャラリーを簡略化します。 残りのコマンドについては、ギャラリーのドロップダウンの下部に適切なコマンドを指定します。
- コマンドに他のバリエーションの一覧が表示される場合は、「その他
singular feature nameのオプション...」という名前を付けます。 - ユーザーが独自のカスタム オプションを作成できるダイアログ ボックスがコマンドに表示される場合は、"Custom
feature name..." という名前を付けます。
- コマンドに他のバリエーションの一覧が表示される場合は、「その他
- 選択内容をグループにまとめると、閲覧がより効率的になります。
ギャラリーに多数の項目がある場合は、ユーザーがより効率的に選択肢を見つけられるようにフィルターを追加することを検討してください。 混乱を避けるために、最初にフィルター処理されていないギャラリーを表示します。 ただし、多くのギャラリーには多くの選択肢がないため、フィルターは必要ありません。グループを使用すれば十分です。
コマンドのプレビュー
- プレビューを使用して、ユーザーが最初にコマンドを実行しなくてもコマンドの効果を表示します。 役に立つプレビューを使用することで、プログラムの効率と学習の容易さを向上させ、試用版とエラーの必要性を減らすことができます。 さまざまな種類のコマンド プレビューについては、この記事の「設計概念」セクションの 「プレビュー 」を参照してください。
- ライブ プレビューの場合は、プレビューを適用でき、現在の状態が 500 ミリ秒以内に復元されることを確認します。 そのためには、書式設定の変更をすばやく中断可能な方法で適用する必要があります。 ライブ プレビューで最大限のメリットを得るために、ユーザーはさまざまなオプションを迅速に評価できる必要があります。
- プレビューではテキストを使用しないでください。 それ以外の場合は、プレビュー イメージをローカライズする必要があります。
アイコン
ドロップダウン リスト、チェック ボックス、ラジオ ボタンを除くすべてのリボン コントロールのアイコンを指定します。 ほとんどのコマンドには、32 x 32 ピクセルと 16 x 16 ピクセルのアイコンの両方が必要です (クイック アクセス ツール バーでは 16 x 16 ピクセルのアイコンのみが使用されます)。 ギャラリーでは通常、16 x 16、48 x 48、または 64 x 48 ピクセルのアイコンが使用されます。一意のアイコンを指定します。 異なるコマンドに同じアイコンを使用しないでください。
リボンアイコンがリボンの背景色に対して明確に表示されていることを確認します。 コンテキストおよびハイ コントラスト モードでは、常にリボン アイコンを評価します。
特に頻繁に使用されるコマンドの場合は、その効果を明確に伝えるアイコン デザインを選択します。 適切に設計されたリボンには、ユーザーがコマンドを効率的に見つけて理解するのに役立つわかりやすいアイコンがあります。
特に最もよく使用されるコマンドの場合は、認識可能で区別できるアイコンを選択します。 アイコンに特徴的な図形と色があることを確認します。 これにより、アイコン 記号を覚えていない場合でも、ユーザーはコマンドをすばやく見つけることができます。
正解 不正解 
図形と色を使用して、区別しやすいアイコンを作成します。
同じ色のアイコンを区別するのが難しい
グループ内の最も目立つコマンドの 16 x 16 ピクセル アイコンを 32 x 32 ピクセルのビジュアル コンテナー内に配置して、ポップアップ グループ アイコンを作成することを検討してください。 ポップアップ グループに異なるアイコンを作成する必要はありません。
便利な場合は、アイコンを変更して現在の状態を反映します。 これは、既定の効果が変更される可能性がある分割ボタンに特に役立ちます。リボン アイコンが Aero スタイルのアイコン ガイドラインに準拠していることを確認します。 ただし、リボン アイコンは、パースペクティブで表示されるのではなく、まっすぐに表示されます。
| 正解 | 不正解 |
|---|---|
 2 次元アイコンを使用します。 |
 3 次元アイコンは使用しないでください。 |
拡張されたツールヒント
すべてのリボン コマンドには、コマンド 名、ショートカット キー、説明、オプションの補足情報を示す拡張ツールヒントが必要です。 ラベルを単に修正するツールヒントは使用しないでください。
正しくない:
この例では、ツールヒントは単にコマンド ラベルを修正します。
実用的な場合は、簡潔な説明を使用してコマンドを完全に記述します。 詳細な説明が本当に必要な場合にのみ、ヘルプへのリンク。
正しくない:
この例では、コマンドにヘルプは必要ありません。
役に立つ場合は、プレビューを使用してコマンドの効果を示します。
この例では、ツールヒントの画像にコマンドの効果が示されています。
ラベル付けのガイドラインについては、「 拡張ツールヒント ラベル」を参照してください。
アクセス キーとキーヒント
キーヒントは、リボンに直接表示されるコマンドのアクセス キーを表示するために使用されるメカニズムです。
ドロップダウン メニュー コマンドのアクセス キーは、下線付きの文字で示されます。 メニュー アクセス キーとは次の点で異なります。
2 つの文字アクセス キーを使用できます。 たとえば、FP を使用して Format ペインター コマンドにアクセスできます。
アクセス キーの割り当ては、下線ではなくヒントを使用して表示されるため、文字の幅と降順は割り当てを行う要因ではありません。
すべてのリボン タブとコマンドにアクセス キーを割り当てます。 考えられる唯一の例外は、従来のアドインからのコマンドです。
アプリケーション ボタンとクイック アクセス ツール バーの場合:
- [アプリケーション] ボタンに F を割り当てます。 この割り当ては、[アプリケーション] ボタンが従来の [ファイル] メニューと類似しているために使用されます。
クイック アクセス ツール バーと最近使用したファイル リストの場合は、アクセス キーを数値で割り当てます。
タブの場合:- H をホームに割り当てます。
- 最もよく使用されるタブから始めて、ラベルの最初の文字を割り当てます。
- 最初の文字に割り当てることができないタブの場合は、ラベル内の固有の子音または母音を選択します。
- メニュー バーをサポートするために使用されるプログラムの場合は、アクセス キーの互換性を最大限に実用的に維持するように努めます。 従来のメニュー カテゴリからキーにアクセスするには、さまざまな意味を割り当てないでください。 たとえば、プログラムの従来のメニュー バー バージョンに [編集] メニューがある場合は、同等のタブに E アクセス キーを使用するように努めます。同等のタブがない場合は、混乱を防ぐために、どのタブにも E アクセス キーを割り当てないでください。
リボン コマンド、メニュー、サブメニューの場合:- タブ内で一意のアクセス キーの組み合わせを割り当てます。アクセス キーの組み合わせをさまざまなタブ内で再利用できます。
- 可能な限り、一般的に使用されるコマンドの標準アクセス キーを割り当てます。 標準の アクセス キー の表を参照してください。
- その他のコマンドの場合:
- 最も頻繁に使用されるコマンドの場合は、ラベルの最初または 2 番目の単語 (できれば最初の文字) の先頭にある文字を選択します。
- 使用頻度の低いコマンドの場合は、"Exit" の "x" など、ラベル内の固有の子音または母音である文字を選択します。
- 最もよく使用されるコマンドとダイアログ ボックスランチャーの場合は、必要に応じて 2 文字を使用します。
- メニューとサブメニューの場合は、1 文字を使用して、完全なコマンドに必要なキーストロークの数を減らします。
- J、Y、または Z で始まるアクセス キーは、コンテキスト タブ、割り当てられていないキーヒント、およびポップアップ グループに使用されるため、使用しないでください。
ポップアップ グループの場合:- Z で始まる 2 文字のアクセス キーを使用します。
- 最もよく使用されるグループから始めて、ラベルの最初の文字に 2 番目のアクセス キー文字を割り当てます。
- 残りのグループの場合は、ラベル内の固有の子音または母音を選択します。
ショートカット キーのガイドラインについては、「 キーボード」を参照してください。
アプリケーション ボタン
[アプリケーション] ボタンを使用して、ファイルとの間で何かを行うコマンドのメニューを表示します。 たとえば、ファイルの作成、開き、保存、印刷、ドキュメントの送信と発行を行うために、従来は [ファイル] メニューに表示されるコマンドが含まれます。
リボンを使用する場合は、常に [アプリケーション] ボタンを指定します。 プログラムがファイルを使用しない場合は、[アプリケーション] ボタンを使用してプログラム オプションと Exit コマンドにアクセスします。 アプリケーション ボタンは常にコマンド メニューを表示し、単なる装飾とは限りません。
必要に応じて、次の標準アプリケーション メニュー コマンドを使用します。
- 新規
- [ファイル]
- 保存
- 名前を付けて保存...
- 印刷...
- クイック印刷
- 印刷プレビュー
- 閉じる
- オプション
- 終了
[アプリケーション] メニューに属するコマンドは、そのメニューに対してのみ予約します。 これらのタブは、どのタブにも冗長に配置しないでください。
メニュー項目ごとに、次の項目を指定します。
- コマンド名を持つラベル。
- 32 x 32 ピクセルのアイコン。
- 簡単な説明。 テキストの最大 2 行を使用して説明を表示できることを確認します。
ツールヒントを使用して、ショートカット キーを文書化します。 通常のメニューとは異なり、アプリケーション メニューでは、ラベルを使用してショートカット キーを文書化しません。
クイック アクセス ツール バー
- クイック アクセス ツール バーを使用して、頻繁に使用されるコマンドにアクセスできます。 コマンドは、[アプリケーション] ボタンまたはリボンから使用できます。
- リボンを使用する場合は、常にクイック アクセス ツール バーを指定します。 リボンに 1 つのタブがある場合でも、この操作を行います。これにより、プログラム間で一貫性が提供されます。
- [アプリケーション] メニューで頻繁に使用されるコマンドを使用して、クイック アクセス ツール バーを事前に設定します。 プログラムでサポートされている場合は [保存] と [元に戻す] を指定し、サポートされていて頻繁に使用される場合は [開く] と [印刷] を指定します。
- [クイック アクセス ツール バーのカスタマイズ] メニューには、最も頻繁に使用される即時コマンドのうち最大 12 個を指定します。 即時コマンドを有効にする前に追加の入力は必要ないため、クイック アクセス ツール バーに適しています。 これらは任意の即時コマンドでもかまいませんが、ユーザーが選択する可能性が高いため、[ホーム] タブにないコマンドを優先します。
- [クイック アクセス ツール バーのカスタマイズ] メニューに関連するコマンドのペアがある場合は、頻度に関係なく両方を指定します。 一般的なペアは、開く/閉じる、戻る/進む、元に戻す/やり直しです。
- [クイック アクセス ツール バーのカスタマイズ] ダイアログで、コマンドを追加する方法を指定します。 最もよく使用されるコマンドを表示する一般的なコマンド フィルターを指定し、既定でこのフィルターを選択します。
ダイアログ ボックス起動ツール
使用頻度の低いコマンドと設定を含む関連するダイアログ ボックスがある場合は、ダイアログ ボックス起動ツールを使用してグループを指定します。 ダイアログ ボックスには、グループ内のすべてのコマンドに加えて、まったく異なる一連のコマンドやグループと同じコマンドが含まれていないものも含まれている必要があります。ダイアログ ボックス起動ツールを使用してコマンドを直接実行しないでください。 ダイアログ ボックス起動ツールは、ダイアログ ボックスを表示する必要があります。
頻繁に使用されるコマンドと設定にアクセスするには、ダイアログ ボックス起動ツールを使用しないでください。 リボン上のコマンドと直接比較すると、ダイアログ ボックスのコマンドと設定は比較的検出できません。
ダイアログ ボックスの名前とグループの名前を一致させます。 完全に一致する必要はありませんが、ユーザーが結果に驚かないように、名前は十分に似ている必要があります。
正しくない:
リマインダーサウンドはリマインダーオプションですが、ダイアログボックスランチャーを使用してリマインダーサウンドを設定することは予期しないものです。
グループに関連するコマンドと設定のみを表示します。 ダイアログ ボックスに他のものが表示される場合、ユーザーは、これらの他のコマンドと設定へのこのパスが唯一のパスであると結論付けることができます。
正しくない:
この例では、[フォント] ダイアログ ボックスに文字間隔の設定が表示されます。この設定は関連付けられているタブとは無関係です。
ラベル
タブ ラベル
- すべてのタブにラベルを付けます。
- 実用的な場合は常 に、標準のリボン タブを使用します。
- 簡潔な 1 つの単語ラベルを優先します。 複数単語のラベルは許容されますが、領域が増え、ローカライズが困難になります。
- 内容を明確かつ正確に説明するわかりやすいタブ名を選択します。 名前は特定の名前にする必要がありますが、過度に具体的ではありません。 ユーザーがコンテンツに驚かないように、タブ名は十分に予測可能である必要があります。 [ホーム] タブは、最も頻繁に使用されるコマンドに使用されるため、一般的に名前が付けられていることに注意してください。
- "Basic" や "Advanced" などのグループ名は使用しないでください。ユーザーは、探しているコマンドが基本か上級かを判断する必要があります。
- 目的を反映したタブ名を選択します。 タブに関連付けられている目標またはタスクを検討してください。
- 他のすべてのタブ名と明確に異なるタブ名を選択します。
- タブには名詞または動詞を使用します。 タブ名は並列フレージングを必要としないため、名詞か動詞かに関係なく最適なラベルを選択します。
- gerund ("-ing" で終わる名前) は使用しないでください。 代わりに、gerund の派生元の動詞を使用します。 (たとえば、"描画" ではなく "描画" を使用します)。
- 最初の文字が同じタブ名、特に隣接するタブは使用しないでください。 リボンを縮小すると、これらのタブ名の切り捨てテキストは同じになります。
- 単数形の名前を優先します。 ただし、単数形の名前がぎこちない場合は、pural 名を使用できます。
- タイトルスタイルの大文字と小文字を使用します。
- 末尾に句点を付けません。
コンテキスト タブとタブ セットのラベル
- "ツール" を使用してコンテキスト タブ セットラベルを終了します。 これを行うと、コンテキスト タブの目的を特定するのに役立ちます。
- タイトルスタイルの大文字と小文字を使用します。
- 末尾に句点を付けません。
グループ ラベル
グループ に 1 つのコマンドがあり、グループラベルとコマンド ラベルが同じでない限り、すべてのグループにラベルを付けます。
標準のリボン グループを使用します。実用的な場合は常に使用します。
簡潔な 1 つの単語ラベルを優先します。 複数単語のラベルは許容されますが、領域が増え、ローカライズが困難になります。
内容を明確かつ正確に記述するわかりやすいグループ名を選択します。 名前は、ジェネリックではなく、特定の名前にする必要があります。
目的を反映するグループ名を選択します。 グループ内のコマンドに関連付けられている目標またはタスクを検討してください。
gerund ( "-ing" で終わる名前) は使用しないでください。 ただし、gerund の派生元の動詞を使用すると混乱を招く可能性があります。 たとえば、"Edit" や "Proof" ではなく "Editing" と "Proofing" を使用します。
タブ名と同じグループ名は使用しないでください。 グループが存在するタブ名を使用しても情報は提供されません。また、別のタブの名前を使用すると混乱します。
単数形の名前を優先します。 ただし、単数形の名前がぎこちない場合は、pural 名を使用できます。
文章スタイルで大文字と小文字を使い分けます。
末尾に句点を付けません。
コマンド ラベル
- すべてのコマンドにラベルを付けます。 明示的なテキスト ラベルを持つことは、ユーザーがコマンドを見つけて理解するのに役立ちます。 例外： アイコンが非常によく知られており、スペースがプレミアムである場合は、コマンドのラベルを付けなくてもかまいません。 ほとんどの場合、ラベル付けされていないコマンドは [ホーム] タブに表示されます。この場合は、Name プロパティを適切なテキスト ラベルに割り当てます。 これにより、スクリーン リーダーなどの支援技術製品は、グラフィックに関する代替情報をユーザーに提供できます。
- コマンド ボタンの場合は、簡潔でわかりやすいラベルを使用します。 可能な場合は 1 つの単語を使用します。最大 4 つの単語。
- ドロップダウン リストの場合、リストに常に値がある場合は、現在の値をラベルとして使用します。
編集可能なドロップダウン リストに値がない場合は、プロンプトを使用します。- 自明ではない、または頻繁に使用されないドロップダウン リストには、明示的なラベルが必要です。 ラベルの末尾にコロンを付けます。
![screen shot of automatically after: [seconds]](images/cmd-ribbons-image69.png)
<Br。>テキスト ボックスには、明示的なラベルを使用します。 ラベルの末尾にコロンを付けます。- 文章スタイルで大文字と小文字を使い分けます。 これを行う方が、Windowsトーンに適しています。
- 命令型動詞を使用してラベルを開始します。 タブやグループ名、または表示、作成、挿入、書式などの一般的な動詞と同じでない限り。
- 末尾に句点を付けません。
- スペースを節約するために、リボン コマンド ラベルに省略記号を付けないでください。 ただし、省略記号は、[アプリケーション] ボタンとドロップダウン メニューのコマンドで使用されます。
強化されたツールヒント ラベル
- タイトルを使用して、コマンド名とそのショートカット キー (該当する場合) を指定します。
- タイトルでは、終了句読点を使用しないでください。
- 動詞で説明を開始します。 説明を使用して、特定の機能が探している機能であるかどうかをユーザーが判断するのに役立ちます。 説明は、"This is the right feature to use if you want to..." という文を完成させるために語句を入力する必要があります。
- 説明は短くしておきます。 ポイントに右取得します。 長いテキストは読み取りを推奨しません。
分割ボタンの場合は、別のツールヒントを使用して、分割ボタン メニューを説明します。- 省略可能な補足説明を使用して、コントロールの使用方法を説明します。 このテキストには、コントロール自体が状態を示していない場合に、コントロールの状態に関する情報 (無効になっている理由を含む) を含めることができます。 このテキストは短くし、詳細な説明についてはヘルプ トピックを使用してください。
説明と補足説明については、句読点を終了する完全な文を使用します。- 文章スタイルで大文字と小文字を使い分けます。
アプリケーション ボタンのラベル
クイック印刷オプションを選択したスクリーンショット
"Quick" を使用して、コマンドの即時バージョンを示します。省略記号を使用して、コマンドにさらに多くの情報が必要であることを示します。
文章スタイルで大文字と小文字を使い分けます。
ドキュメント
リボンを参照する場合:
- リボンとそのコンポーネントをリボン、タブ、グループ、およびコントロールとして参照します。 これらの用語は大文字ではありません。
- 丸いボタンをアプリケーション ボタンとして参照し、そのボタンに含まれるメニューを [アプリケーション] メニューとして参照します。
- クイック アクセス ツール バーとしてツールバーを参照してください。
- ラベルと単語タブでタブを参照します。大文字と小文字を含む正確なラベル テキストを使用します。
- ラベルでコマンドを参照します。 ラベル付けされていないコマンドは、ツールヒントの名前で参照してください。 大文字と小文字を含む正確なラベル テキストを使用しますが、省略記号は含めないでください。 単語ボタンやコマンドは含めないでください。
- ユーザー操作を説明するには、タブとコントロールのクリックを使用します。 編集可能なドロップダウン リストには Enter を使用します。 選択、選択、選択は使用しないでください。
- 使用できないアイテムは、淡色表示、無効化、灰色表示ではなく、使用不可と参照してください。 プログラミング ドキュメントでは、disabled を使用します。
- 可能な場合は、太字のテキストを使用してラベルの書式を設定します。 それ以外の場合は、混乱を防ぐために必要な場合にのみ、ラベルを引用符で囲みます。
例 :
- [ ホーム ] タブの [ 貼り付け] をクリックします。
- [ ホーム ] タブの [ フォント ] ボックスに「Segoe UI」と入力します。
- [ 校閲 ] タブで、[ マークアップの表示] をクリックし、[ 校閲者] をクリックします。
- [ 書式 ] タブの [ 図] ツールの [ 図の圧縮] をクリックします。
フィードバック
以下は間もなく提供いたします。2024 年を通じて、コンテンツのフィードバック メカニズムとして GitHub の issue を段階的に廃止し、新しいフィードバック システムに置き換えます。 詳細については、「https://aka.ms/ContentUserFeedback」を参照してください。
フィードバックの送信と表示