アイコン

アイコンは、動作や概念を視覚的に表現するものです。 多くの場合、コントロールとコマンドに意味を与えるために使用します。 環境内でユーザーが移動するのにサインが役立つのと同じように、リアルなビジュアルや象徴的なビジュアルにより、ユーザーは UI 間を移動できるようになります。 お客様がコントロールを選択するときの動作をすばやく解析できるにように、必要な詳細のみを含む、シンプルで明確なビジュアルにする必要があります。

Office アプリのリボン インターフェイスには、標準のビジュアル スタイルがあります。 これにより、Office アプリとの間で一貫性と親和性を保つことができます。 このガイドラインは、ソリューションの PNG アセットのセットを Office の自然な一部のように設計するのに役立ちます。

多くの HTML コンテナーには、コントロールとアイコン画像が含まれています。 Fabric Core のカスタム フォントを使用して、アドインで Office スタイルのアイコンをレンダリングします。 Fabric Core によって提供されるアイコン フォントには、一般的な Office メタファー用のグリフが多数含まれており、ニーズに合わせてスケーリング、色、スタイルを調整できます。 独自のアイコンのセットで既存のビジュアル言語を使用している場合、HTML キャンバスでも自由に使用できます。 アイコンの標準セットを使用して独自のブランドの継続性を築くことは、すべてのデザイン言語の重要な一部をなしています。 Office メタファーとの競合により、お客様が混乱することのないように注意してください。

アドイン コマンドのアイコンをデザインする

アドイン コマンドは、Office UI にボタン、テキスト、およびアイコンを追加します。 アドイン コマンドのボタンには、ユーザーがコマンドを使うときに、実行しようとするアクションを明確に識別できる、分かりやすいアイコンとラベルをつける必要があります。 次の記事では、Office とシームレスに統合するアイコンを設計するのに役立つスタイルと運用のガイドラインを提供します。

注:

いずれかのスタイルを選択する必要があります。アドインでは、Microsoft 365 または永続的な Office で実行されているかどうかにかかわらず、同じアイコンが使用されます。

関連項目