仮想エージェントボットのブランディングを設定

  • リリースバージョン: Xanadu
  • 更新日 2024年08月01日
  • 所要時間:14分
  • インスタンスを使用するさまざまな組織に対して、さまざまな 仮想エージェント ブランディング構成を作成します。これらの構成は、Web ベースのチャットおよびモバイルクライアントにのみ適用されます。

    始める前に

    ServiceNow® モバイル を使用している場合は、モバイルチャットに 仮想エージェント を設定してください。詳細については、「ServiceNow モバイルアプリケーションの仮想エージェントの構成」を参照してください。

    ServiceNow Store上の Omni-Experience Standard Feature Set アプリケーションの更新と改善を確認します。

    注:
    Microsoft Teams との対話型統合 のボットのブランディングは、Microsoft Teams アプリのカスタマイズ機能で利用できます。詳細については、Now Community の「MS Teams branding for the conversational integration」を参照してください。Slack のボットのブランディングも利用できます。詳細については、「Slack での仮想エージェントボットのブランディングの構成」を参照してください。

    必要なロール:virtual_agent_admin または admin

    手順

    1. 移動先 すべて > 対話型インターフェース > 設定.
    2. [表示オプション] セクションで、[ブランディング] の横にある [すべて表示]を選択します。
    3. [新規]を選択してブランディング構成を作成するか、更新するブランディング設定レコードを選択します。
    4. フォームのフィールドに入力します。
      ラベル 説明
      ブランド名 自社用カスタム設定構成の名前。
      新しいブランディング構成を作成するか、利用可能な選択肢の 1 つを選択します。Xanadu リリースの場合、選択肢は次のとおりです。
      • Polaris-Dark
      • Polaris-Light
      チャットヘッダー チャットウィンドウで会社または組織を識別するテキスト文字列です。例:Acme サポート。
      ボットメッセージ間の最小値 (ms) ボット応答間に発生する最小遅延 (ミリ秒単位 (ms)) です。デフォルトの待機時間は 500 ms です。
      入力アニメーションを表示する前の最小遅延 (ミリ秒) ボットがユーザー入力を処理中であることを示すアニメーション省略記号を表示する前に発生する最小遅延 (ミリ秒単位 (ms)) です。
      メニュータイトル サポートメニューの名前。デフォルトタイトルは [サポートへの連絡] です。
      ブランディングキー 入力した [ブランディング名] が反映された構成の読み込み専用 sys_id。キーは小文字で、スペースはアンダースコア文字に置き換えられます。
      ボタン選択テキスト [ 上に新規メッセージ ] または [ 下に新規メッセージ ] ボタンのフォント色。
      ボットプロファイル [ライブプロフィール] フォームを開いて、ボット画像 (アバター) が含まれる、新しいボットユーザープロファイルを選択または作成するリスト。
      • 仮想エージェントボットプロファイルを確認および編集するには、[情報] アイコンをクリックします。
        • 仮想エージェントボットの写真または説明を変更するには、ページ上部のメッセージで [レコードを編集] をクリックします。
        • ライブプロファイルフォームで、フィールドを変更して [更新] をクリックします。
      • 構成のボットを選択または変更するには、検索アイコンを選択して [ボットプロファイル] フィールドをクリックします。前のステップで作成したボットプロファイルを選択します。
      チャットヘッダーロゴ チャットヘッダーに表示されるロゴ画像。ライブチャットがブラウザウィンドウで実行されている場合、ロゴはブラウザタブにも表示されます。チャットヘッダーのロゴは 42 x 42 ピクセルに設定され、チャットメッセージのロゴは 24 x 24 ピクセルに設定されます。これらのサイズよりも小さいアップロード画像は、引き伸ばされて表示されます。大きな画像は縮小されます。
      • ロゴを追加するには、[イメージを添付] を選択し、ファイルファインダーを使用してイメージを選択します。
      • ロゴを変更するには、[画像を表示] を選択します。ファイルファインダーから、新しいロゴファイルを選択し [OK] をクリックします。更新したロゴが、このフィールドの下に表示されます。
      • ロゴを削除するには、ごみ箱アイコンを選択します。ファイルがすぐに削除されます。
      「以下に新規メッセージ」または「以下に新規メッセージ」通知の表示を有効にする チャットの現在のビューの下または上に新しいメッセージの通知を表示するには、このオプションを選択します。
    5. [保存] を選択します。
      ここから、チャットクライアントの色、アイコン、フォントのタイプとサイズをブランドに合わせて調整できます。たとえば、次のことができます。
    6. チャットウィンドウのアイテムの色を変更するには、[色] タブを選択します。
      チャットウィンドウとチャットメッセージの色が表示されている [チャットのブランディングカラー (Chat branding colors)] タブ。
      アイテムを選択し、そのアイテムに使用する 16 進数または赤青緑アルファ (RGBA) カラーを指定します。これを行うと、サンプルチャットウィンドウに変更内容のプレビューが表示されます。
      表 : 1. 各アイテムの色をカスタマイズ
      ラベル 説明
      チャットウィンドウ
      チャットヘッダーバックグラウンド チャットヘッダーの背景色です。
      チャット バックグラウンド チャットウィンドウの背景色です。
      メニューアイコン 会話を終了するかカスタマーサポートに連絡するというユーザーオプションを提供する、メニューアイコンの色です。
      チャットヘッダーフォント チャットヘッダー内のテキストのフォント色です。
      入力バックグラウンド ユーザー入力バーの背景色です。
      チャットメッセージ
      ユーザー バブル バックグラウンド ユーザーチャットバブルの背景色です。
      エージェントバブルバックグラウンド ライブエージェントチャットバブルの背景色です。
      ボットバブルバックグラウンド ボットチャットバブルの背景色です。
      「リンク」 会話に表示されるリンクの色です。
      ボタンバックグラウンド 会話で使用されるボタンの背景色です。
      通知バックグラウンド Web チャットクライアントで配信される仮想エージェント通知の背景色。
      ユーザー バブル フォント ユーザーチャットバブル内のテキストのフォント色です。
      エージェントバブルフォント ライブエージェントチャットバブル内のテキストのフォント色です。
      ボットバブルフォント ボットチャットバブル内のテキストのフォント色です。
      リンクがオフ 会話での無効リンクの色です。
      通知テキスト Web チャットクライアントで配信される仮想エージェント通知のフォント色。
      その他
      システムメッセージ 会話に表示される一般的なシステムメッセージの色です。
      カテゴリバックグラウンド トピックのリストの上にある見出しの背景色です。
      セパレーター [プレビュー] ウィンドウで各会話を区切る破線の色です。
      タイムスタンプ 作成中のレコードなど、会話中に重要なアクティビティが発生したときに表示されるタイムスタンプの色です。
      カテゴリフォント カテゴリ見出しのテキストのフォント色です。
      アニメーションをロード中 システムが情報を処理していることを示すアニメーションドットの色です。
    7. チャットウィンドウのチャットアイコンをカスタマイズするには、[アイコン] タブを選択します。
      メインチャットウィンドウとすべてのトピックウィンドウのアイコンが表示されている [チャットのブランディングアイコン (Chat branding Icons)] タブ。
      メインチャット画面、すべてのトピック画面、サポートメニュー、および会話の終了画面の 4 つのチャット画面のアイコンをカスタマイズできます。このタブを使用して、次の操作を行います。
      • カスタムアイコンを追加する:アイコンの [追加] を選択し、[イメージを添付] を選択します。画像ファイルを選択したら、[適用] を選択します。
      • カスタムアイコンを置換する:アイコンの [置換] を選択します。ゴミ箱アイコンを選択して現在の画像を削除し、新しい画像をアップロードします。
      • システムのデフォルトアイコンに戻す:アイコンの [削除] を選択します。
        注:
        システムのデフォルトのアイコンは削除できません。
      構成中にアイコンを指定すると、サンプルのチャットウィンドウに、変更内容のプレビューが表示されます。
      注:
      ブランディングページの他の設定とは異なり、[適用] を選択するとすぐに Web クライアントでアイコンの変更が有効になります。他の変更は、ページの上部にある [保存] を選択するまで有効になりません。

      有効なファイル形式は、.jpg、.png、.bmp、.gif、.jpeg、.ico、.svg です。

    8. オプション: フォントタイプとフォントサイズをカスタマイズします。

      利用可能なブランディング構成 (Polaris-Light や Polaris-Dark など) はここにあります。

      注:
      この機能は、ServiceNow® Store から Omni-Experience Standard Feature Set をインストールして最新バージョンに更新した後にのみ表示されます。
      チャットに表示されるフォントをカスタマイズするには、[フォント] タブを選択します。

      フォントタイプを変更するには、次のいずれかの方法を選択します。

      1. 使用するフォントを選択します。
        [チャットヘッダーテキスト] ドロップダウンリストから、ヘッダーに使用するフォントを選択します。

        チャット本文のテキストについても同じ操作を行います。

        新しいフォントの例が表示されます。
      2. URL からフォントをダウンロードします。
        [カスタムフォントを追加] ドロップダウンリストから、[URL から] を選択し、URL を指定して変更を適用します。
      3. 添付ファイルから追加するフォントをアップロードします。
        [カスタムフォントを追加] ドロップダウンリストから、[フォントをアップロード] を選択し、添付するファイルへのパスを指定して変更を適用します。

      チャットのヘッダーとチャット本文のフォントサイズを変更するには、次の操作を行います。

      1. [Font body size (本文のフォントサイズ)] ドロップダウンから、[標準]、[大]、または [特大] のフォントサイズを選択します。
      2. [Font header size (ヘッダーのフォントサイズ)] ドロップダウンから、[標準]、[大]、または [特大] のフォントサイズを選択します。
        注:
        これらの変更は、チャットウィジェットに追加したカスタムコントロールには適用されません。カスタムコントロールは個別に更新する必要があります。
      3. ポータルまたは Web サイトのチャットウィンドウで変更をプレビューします。
    9. [サポートへの連絡] メニューを更新するには、[メニューアイテム] セクションまで下にスクロールします。
      チャット、メール、および電話連絡先アイテムが表示されている、チャットのブランディングメニューアイテムセクション。

      [メール]、[チャット]、および [電話] メニューアイテムのアイコン、ラベル、可視化、および表示順序を変更できます。メニューにカスタムオプションを追加することもできます。

      1. [メニューアイテム] セクションで、次のいずれかの操作を行います。
        • メニューアイテムを編集するには、[レコード] アイコンを選択します。
        • 新しいメニューアイテムを追加するには、[新規] を選択します。
        • メニューアイテムを削除するには、[レコード] アイコンを選択します。レコードで、[その他のアクション] アイコン [ その他のアクション] アイコンを選択し、[ 削除] を選択します。

        各メニューエントリのフィールドに入力します。

        フィールド 説明
        ラベル メニュータイプを説明するテキスト文字列。
        グローバルアプリケーションスコープのデフォルトのメニュータイプのラベルは、次のとおりです。
        • メール:デフォルトのメールを開くオプション。デフォルトラベル: カスタマーサポートにメールを送信
        • チャット:ライブエージェントとチャットするためのオプション。デフォルトラベル:チャットタイプの連絡先ライブエージェント
        • 電話:電話サポートが利用可能であることを示すオプション。デフォルトラベル:コールサポート:(毎日午前 5 時~午後 11 時)
        ラベルテキストの長さは最大 75 文字です。
        タイプ メニューアイテムのタイプ。たとえば、ヘルプページなどの特定の情報へのリンクであるメニューアイテムを追加する場合は、[リンク] タイプを選択します。
        メニューアイテムのタイプは次のとおりです。
        • メール:メールでサポートに連絡するオプション。
        • リンク:Web ページへのリンクのオプション
        • チャット:チャットを通じてライブエージェントに連絡するオプション。
        • テキスト:テキスト文字列を設定するオプション
        • 電話:電話でサポートに連絡するオプション
        メニュータイプの値。たとえば、メールの [値] は、サポートグループのメールアドレスです。
        デフォルトのメニュータイプの値は次のとおりです。
        • メール:サポートグループのメールアドレス。例:support@example.com
        • 電話:電話サポート組織の電話番号。
        • メール:サポート組織のメールアドレス。
        注:
        チャットメニュータイプに値はありません。
        表示

        アイテムを [サポートへの連絡] メニューに表示するオプション。

        メニューアイテムを非表示にするには、このオプションをオフにします。

        デフォルト表示アイコン アイテムのデフォルトアイコンを示すオプションは、メニューに表示されます。

        メニューアイコンを追加、変更、または削除するには、このオプションをオフにします。

        • 新しいメニューアイテムのアイコンを追加するには、[画像を表示] を選択します。ファイルファインダーから、アイコンファイルを選択し、[OK] を選択します。アップロードされたアイコンは、[アイコン] フィールドの下に表示されます。
        • アイコンを変更するには、[アイコン ] フィールドで [更新] を選択します。ファイルファインダーから、新しいロゴファイルを選択し [OK] をクリックします。更新したアイコンが、このフィールドの下に表示されます。
        • アイコンを削除するには、[ごみ箱] アイコンを選択します。ファイルがすぐに削除されます。
        順序 [サポートへの連絡] メニューにアイテムが表示される順序を識別する番号。数字の 1 は、アイテムがメニューに表示される最初のオプションであることを示します。
        アプリケーション グローバル。
      2. メニュータイプの [メニューアイテム] セクションを完了したら、[保存] を選択します。
    10. ブランディング構成を適用するには、次のいずれかを実行します。
      • ブランド構成を宛先ページに適用します。Web クライアントの URL のブランディングキーを使用して、システムパラメーター「sysparm_branding_key」を入力します。例:

        https://<インスタンス名>service-now.com/$sn-va-web-client-app.do?sysparm_branding_key=acme

        この例では、acme は使用するブランディング構成のキーです。

      • 埋め込み Web クライアントにブランディング構成を適用します。埋め込み Web クライアントの URL のブランディングキーを使用して、システムパラメーター「sysparm_branding_key」を入力します。例:

        https://<インスタンス名>service-now.com/$sn-va-web-client-app_embed.do?sysparm_branding_key=acme

        この例では、acme は使用するブランディング構成のキーです。

      • サービスポータル エージェントチャット 構成にブランディング構成を適用します。ページとウィジェットデータをエージェントチャット (仮想エージェントまたはライブエージェント) の会話に渡すサーバースクリプトで、使用するブランディングキーを指定します。このスクリプトによって渡されたアイテムは、ポータル内のすべてのページで使用できます。サービスポータル エージェントチャット の設定の詳細については、「」を参照してください。ボットをポータルに追加します。

        たとえば、ナレッジポータルに対する次の サービスポータル エージェントチャット の構成は、チャットブランディングキー、custom_1 を使用します。

        サービスポータルエージェントチャット構成レコードの例。
        注:
        ポータルの [エージェントチャット] ボタンのカスタマイズなど、構成可能な他の サービスポータル エージェントチャット機能があります。サービスポータル でのエージェントチャットウィジェットのカスタマイズの詳細については、「サービスポータル のエージェントチャットの構成」を参照してください。
    11. オプション: ブランドボットと一緒に対話オートパイロットを使用している場合は、次のようにシステムプロパティを変更することで、オートパイロットセッション中にチャットウィンドウに表示されるブランドボット名を指定できます。
      1. 移動先 すべて > 対話型インターフェース > 設定.
      2. [システムアクション] セクションで、[システムメッセージ] の横にある [すべて表示]を選択します。
      3. com.glide.cs.autopilot.client_initiated_header システムのプロパティの [値] フィールドを変更して、チャットウィンドウのヘッダーに表示される仮想エージェントボット名の代わりに、ブランドボット名を指定します。
        図 : 1. チャットウィンドウのオートパイロットヘッダー
        対話オートパイロットセッション中にチャットウィンドウのヘッダーで強調表示されたボット名。
      4. com.glide.cs.autopilot.client_initiated_message システムプロパティを更新して、会話中に要求者に表示されるブランドボット名を指定します。
        図 : 2. 会話中のオートパイロットメッセージ
        エージェントがタスクの完了を支援するために 仮想エージェント を有効にしたことをユーザーに通知する、チャットウィンドウに表示されるメッセージ。