カラーテーマ

Learning Manager でのカラーテーマとブランディング

Learning Manager では、組織のブランディング要件に合わせてアプリケーションの見た目を変更できます。

ユーザーインターフェイスのカスタマイズ

このトレーニングでは、インターフェイスの外観をカスタマイズして、組織のブランディング要件に合わせる方法について説明します。

ボタン

トレーニングを起動できない場合は、almacademy@adobe.comに書き込んでください。

ブランディング branding

左ペインで​ ブランディング ​をクリックして、組織名の更新、サブドメイン、ロゴスタイル、テーマの変更を行います。 各トピックの横にある「編集」をクリックして、コンテンツを変更します。

ロゴのスタイル logostyling

「編集」 ​をクリックして、Learning Managerアプリケーションに表示されるロゴと会社名の見た目を設定します。

新しいロゴをアップロード」をクリックし、ロゴをコンピューターから選択してアップロードします。 ロゴと組織名の見た目は下でプレビューできます。 任意のヘッダースタイルを選択し、[保存]をクリックします。

テーマ themes

カラーテーマの変更をアプリケーションに適用する前に、変更をプレビューする 5 枚の参考画像が提供されます。 画像の左側と右側にある < and > 記号をクリックして、一連のプレビュー画像を閲覧します。 または、画像の下部にあるナビゲーション用の円をクリックして、一連のプレビュースナップショットを閲覧することもできます。

テーマを選択

このセクションの下にある​ ヒントを表示 ​をクリックすると、以下のようにヒントが画像に表示されます。

テーマのヒントの表示

Learning Managerアプリケーションには、5つのカラーテーマオプションが用意されています。

  • Prime デフォルト
  • ペブル
  • カーニバル
  • オータム
  • ウィンタースカイ
  • ビビッド
NOTE
ビビッドテーマはアクセシビリティに準拠しています。

テーマの色をカスタマイズする

トップバーの色、アクセントの色(左ペインのアイコンの色など)、プライマリカラー、テーマのサイドバーの明るさ(Prime デフォルトのテーマを除く)をカスタマイズできます。

メインカラー ​ピッカーでは、没入型UIで使用する色を選択できます。

カスタマイズするには、左ペインでテーマの種類を選択し、ブランドカラーとサイドバーアイコンの色の隣の四角をクリックします。 サイドバーの明るさのサイドバーをクリックし、前後にドラッグして明るさを調整します。 これらのオプションを変更する際は、上の画像のプレビューを見ながら行ってください。

[テーマのリセット] ​をクリックして、テーマの元の設定を復元します。 変更が完了したら、[保存] ​をクリックします。

ライブプレビュー

「テーマ」セクションの左下隅にある「ライブプレビュー」をクリックします。 次のようなポップアップが表示されます。

ライブプレビューポップアップ

ドロップダウンリストから任意のテーマを選択し、設定を調整して「プレビュー」をクリックすると、アプリケーションで変更がライブ表示されます。 これで、アプリケーションのすべての機能を確認し、変更を確認できます。 ライブプレビュー中に役割を変更することもできます。 変更に問題がなければ、ライブテーマのプレビューポップアップ機能に戻り、「テーマを適用」をクリックします。

変更をライブでプレビューしている間も、ライブテーマプレビューのポップアップは画面の下部に引き続き表示されます。 ポップアップを最小化することもできます。

複数のブランド multiple-branding

複数のブランディングを実装する方法は次のとおりです。

  1. 管理アプリの左側のペインで「ブランディング」を選択します。
  2. 「複数のブランディング」セクションで「編集」を選択します。
  3. トグルボタンを選択して有効にします。

社内ユーザー

  1. ドロップダウンからアクティブフィールドを選択します。
  2. 選択内容に基づいて、組織の名前を変更し、ユーザー用に新しいロゴをアップロードできます。

社外ユーザー

  1. ドロップダウンからアクティブフィールドを選択します。
  2. 選択内容に基づいて、組織の名前を変更し、ユーザー用に新しいロゴをアップロードできます。
NOTE
内部ユーザーは、外部ユーザーのようにアクティブフィールドを持つことができます(例えば、管理者はアクティブフィールド値を個別に選択することで、内部ユーザーと外部ユーザーのマルチブランディングを個別に追加する必要があります)。
INFO
詳細については、このブログを参照してください。

注意事項

  • 管理者は、このアクティブフィールド値にマルチレベルブランディングを追加できます。外部ユーザーは、異なるメカニズム(SSOシングル(Okta、Mini orange)、ソーシャルログイン)でログインし、マルチブランディングが適用されるかどうかを確認できます。
  • 外部ユーザーには、内部ユーザーのようにアクティブフィールドとアクティブフィールドの値があります。共有する場合でも、管理者がマルチブランディングで個別に指定する必要があります。 適用されると、外部ユーザーは異なるメカニズム(SSOシングル(Okta、Mini orange)、ソーシャルログイン)でログインし、マルチブランディングが適用されるかどうかを確認できます。
  • プロファイル間で外部ユーザーを移動:外部ユーザーをプロファイル間で移動しても、管理者または外部ユーザーがログインまたは登録時にアクティブフィールドの値を編集/削除しない限り、ユーザーのアクティブフィールドの値には影響しません
NOTE
社内ユーザーと社外ユーザーの両方に対して、同じアクティブフィールド名、同じアクティブフィールド値、異なる設定で複数のブランディングが設定されている場合。 この場合、お客様には、不一致を避けるために、同じ構成設定(ロゴ、テーマ、組織名)を使用することをお勧めします。

アカウントのカスタマイズ customize

Adobe Learning Manager を使用すると、アカウントをカスタマイズしてユーザーエクスペリエンスを強化できます。

カスタマイズ可能なコンポーネントを次のリストにまとめました。 アカウントをカスタマイズするには、Learning Manager サポートにお問い合わせください。

カスタマイズ
推奨事項
トレーニングカードの色のカスタマイズ
  • 最大 12 色のカスタムカラーのみ。
  • すべての学習目標に色が適用されます。 カラーはすべての学習目標(トレーニング)に順に適用され、すべてのカラーで16進数のカラーコード(例:#ffffff)が必要な形式になります。
  • カラーが 1 つだけ提供されている場合は、そのカラーがすべての学習目標に適用されます。
マウスカーソルの画像

カスタム画像は、ユーザーが任意の学習目標にカーソルを合わせたときに表示されます。

  • ユーザーがLearning ManagerのWebページにカーソルを置くと、適用済みのカスタム画像が表示されます。
  • 推奨サイズ – 16 x 16または24 x 24 px
  • 推奨される画像形式 – PNG、JPG
進行状況アイコンの画像

ページを移動しているときに表示されます。 進捗状況を示す「4正方形」のGIFが表示される場所に表示されます。

  • 推奨サイズ – 32x32 px以下
  • 推奨される画像形式 – GIF、PNG、JPG
Fonts

フォントを適用するには、CDN が必要です。 適用するフォントファミリーを共有することも必要になります。

注意: フォントファミリーは、すべてのブラウザーに対応していることが必要です。

背景画像

背景画像が表示されるのは、学習者の役割のみです。

学習者の背景に適用する画像が必要です。

  • 推奨される画像形式: PNG、JPG、JPEG
  • 推奨サイズ: 1400 x 908 px

推奨設定の構成 configurerecommendationsettings

ブランディング > 全般 ​で、社内外の学習者の推奨範囲を設定し、学習者ホームページで学習者がスキルを選択できるようにすることができます。

全般 ​ページには、次のオプションがあります。

学習者ホームページ
「クラシック」 または 「没入型」 のいずれかを選択します。 「没入型」を選択すると、他のオプションが表示されます。
トレーニングの種類
「カスタム」 または 「業界に適合」 のいずれかを選択します。 学習者が 1000 人未満の場合、アカウント全体が 1 つの範囲とみなされます。 この推奨事項は、すべての学習者に基づいています。
推奨の範囲設定
1 つ以上のアクティブフィールドを選択します。 「カスタム」 の場合は、1 つのアクティブフィールドしか選択できません。 業界に適合 の場合、最大5つのアクティブなフィールドを選択できます。
関心のある分野を学習者が検索できるようにする
クラシック環境のみ。 はい を選択するか、いいえ を選択してください。
関心のある分野(スキル)を選択するようにユーザーを促す
没入型環境のみ。 「はい」または「いいえ」を選択します。
recommendation-more-help
d5e5961a-141b-4c77-820e-8453ddef913d