コンソールの Web チャットの設定

メモ

日本語で受講されている方へ
このバッジの Trailhead ハンズオン Challenge は英語で受講していただく必要があります。英語の意味についてはかっこ内の翻訳をご参照ください。必ず英語の値をコピーして貼り付けてから、Trailhead Playground の言語を [English] に、ロケールを [United States] に切り替えてください。こちらの指示に従ってください。

翻訳版の Trailhead を活用する方法については、自分の言語の Trailhead バッジをご覧ください。

Trail Together の動画

エキスパートの説明を見ながらこのステップを進めて行きたい場合は、Trail Together シリーズの一部である、こちらの動画をご覧ください。

(巻き戻して最初から見直したい場合、このクリップは 25:08 分から開始されます。)

アクセシビリティ

この単元ではスクリーンリーダーのユーザー向けに指示が追加されている部分があります。この単元の詳細なスクリーンリーダー版を表示するには、以下のリンクをクリックしてください。

Trailhead スクリーンリーダー版を開く.

はじめに

Ursa Major Solar のカスタマーサービスをもう一段引き上げるために、Ada はそのチームが会社の Web サイトでお客様と直接チャットできるようにしたいと考えています。この要望を実現するために、ガイド付き設定フローを使用してチャットを設定します。チャットはお客様がカスタマーサポートチームに連絡するもう 1 つのチャネルで、すぐその場でお客様の質問に答えたり、問題を解決したりすることができます。 

まずチャットキューを作成して、チャットエージェントを選択し、チャットを Web サイトに追加するための Snap-in コードスニペットを取得するという手順のすべてを 1 つの設定フローで行います。

1. 歯車アイコン をクリックして、[Service Setup (サービスの設定)] を選択します。
2. [Recommended Setup (推奨設定)] で、[View All (すべて表示)] をクリックします。
3. [Chat with Customers (顧客とのチャット)] をクリックします。
4. [Start (開始)] をクリックします。
5. [Queue Name (キュー名)] に、Ursa Major Solar Chat (Ursa Major Solar チャット) と入力します。
6. [Name This Group (このグループに名前を付ける)] に、Chat Agent (チャットエージェント) と入力します。
7. ユーザーのリストの Ada Balewa とあなたの名前の横にあるチェックボックスをクリックして、[Next (次へ)] をクリックします。
8. [Prioritize chats with your other work (他の作業でのチャットの優先度付け)] というページが表示されたら、[Ursa Major Solar Chat (Ursa Major Solar チャット)] キューの横にある [Priority (優先度)] ボックスに1 と入力して、[Next (次へ)] をクリックします。
9. [Work Item Size (作業項目サイズ)] 項目と [Agent Capacity (エージェント業務量)] 項目はデフォルトのままにします。
10. [Next (次へ)] をクリックします。
11. [Website URL (Web サイト URL)] に https://*.force.com と入力します。[Salesforce Site Domain (Salesforce サイトドメイン)] 項目に、your initials + today’s date (MMDDYY) (あなたのイニシャル + 今日の日付 (MM/DD/YY)) を入力します。
    メモ: 別のプロジェクトですでにチャットを設定している場合は、このオプションが表示されず、次のステップに進むことができます。
12. [Salesforce Terms of Use (Salesforce 利用規約)] チェックボックスが表示されたら、[I have read and accept the Salesforce site Terms of Use (Salesforce サイト利用規約を読み同意しました)] チェックボックスをオンにして、[Next (次へ)] をクリックします。
13. 表示されない場合は、[Next (次へ)] をクリックします。
14. [What's your type (種別は?)] 画面で、[Service (サービス)] を選択し、[Next (次へ)] をクリックします。
15. [Offline support (オフラインサポート)] をオンにして、ケースレコードと件名項目の横にある [Required (必須)] チェックボックスをオンにし、[Next (次へ)] をクリックします。
16. この [Chat Code Snippet (チャットのコードスニペット)] ボックスからコードをコピーせずに、[Next (次へ)] をクリックしてください。
17. [Done (完了)] をクリックします。

組み込みサービスのコードスニペットのコピー

1. [Service Setup (サービスの設定)] から、[Quick Find (クイック検索)] ボックスに Embedded Service Deployments と入力し、[Embedded Service Deployments (組み込みサービスリリース)] を選択します。
2. [Chat Agent (チャットエージェント)] の横にある下矢印をクリックして、[View (表示)] を選択します。
3. [Embedded Service Code Snippets (組み込みサービスのコードスニペット)] セクションで [Get Code (コードを取得)] をクリックします。
4. [Chat Code Snippet (チャットのコードスニペット)] セクションで、[Copy to Clipboard (クリップボードにコピー)] をクリックして、提供されたコードスニペットをコピーします。どこか安全な場所に貼り付けます。これは後で必要になります。
   ヒント: コードスニペットをプレーンテキストエディターか HTML エディターに貼り付け、後で Visualforce ページに貼り付けるときにすべてが正しい形式のままであることを確認してください。
5. [Embedded Service Code Snippets (組み込みサービスのコードスニペット)] ウィンドウを閉じます。

オムニチャネルユーティリティの追加

オムニチャネルユーティリティを使用すると、Lightning コンソールのユーザーがオムニチャネル経由で転送される作業要求を受信できます。オムニチャネルユーティリティのすべてを設定したら、Ursa Major Solar サービスコンソールに追加して、Ada とそのチームがアクセスできるようにします。

1. [Service Setup (サービスの設定)] が開いていない場合は、歯車アイコン をクリックしてその設定を選択します。
2. [Quick Find (クイック検索)] ボックスに App Manager (アプリケーションマネージャー) と入力し、[App Manager (アプリケーションマネージャー)] を選択します。
3. Ursa Major Solar のサービスコンソールの横にあるドロップダウンをクリックして、[Edit (編集)] を選択します。
4. 画面の左側にあるメニューから、[Utility Items (ユーティリティ項目)] をクリックします。
5. [Add Utility Item (ユーティリティ項目を追加)] ボタンをクリックして、[Omni-Channel (オムニチャネル)] を選択します。
6. [Save (保存)] をクリックして、 をクリックします。
7. アプリケーションランチャー をクリックして、[Ursa Major Solar Service Console (Ursa Major Solar サービスコンソール)] を選択します。
8. コンソールの下部にあるユーティリティバーの [Omni-Channel (オムニチャネル)] をクリックします。
9. [Offline (オフライン)] の横にあるドロップダウンをクリックして、現在の状況として [Available - Chat (対応可能 - チャット)] を選択します。

オムニスーパーバイザーを使用した内部情報の取得

1. 歯車アイコン をクリックして、[Setup (設定)] を選択します。
2. [Quick Find (クイック検索)] ボックスに Supervisor (スーパーバイザー) と入力し、[Supervisor Settings (スーパーバイザー設定)] を選択します。
3. [Conversation Monitoring (会話の監視)] セクションにある、次の 4 つのオプションをすべて有効にします。
   • Conversation monitoring (会話の監視)
   • Agent sneak peek (エージェントプレビュー)
   • Customer sneak peek (顧客プレビュー)
   • Whisper messaging (示唆メッセージ)
4. [Save (保存)] を選択します。
5. アプリケーションランチャー をクリックして、[Ursa Major Solar Service Console (Ursa Major Solar サービスコンソール)] を選択します。
6. コンソールの上部のオブジェクト (取引先、ケースなど) の横にあるドロップダウンをクリックして、[Edit (編集)] をクリックします。
7. [Add More Items (アイテムをさらに追加)] をクリックします。
8. [Omni Supervisor (オムニスーパーバイザー)] の横にあるプラス をクリックして、[Add 1 Nav Item (1 個のナビゲーション項目を追加)] ボタンをクリックします。
9. [Save (保存)] をクリックします。
10. コンソールの [Navigation Items (ナビゲーション項目)] ドロップダウンから [Omni Supervisor (オムニスーパーバイザー)] を選択します。
11. オムニチャネルのサポート情報を表示するときにマネージャーが使用できるすべての機能が、[Agents (エージェント)]、[Queues Backlog (キューのバックログ)]、[Assigned Work (割り当てられた作業)] の 3 つのタブに分類されています。

テストの準備

お疲れさまでした。オムニチャネルに対応するようコンソールを設定しました。Ada の立場や顧客の立場でライブチャットセッションがどのようなものか試してみるという方法で、Web チャットをテストします。

注意: Web チャットをテストする場合は、Visualforce ページと Snap-in コードを使用します。実行する手順は、このプロジェクトのテストフェーズに固有のものであるため、実際の実装では異なることがあります。

1. 歯車アイコン をクリックして、[Service Setup (サービスの設定)] を選択します。
2. [Quick Find (クイック検索)] ボックスに Visualforce と入力し、[Visualforce Pages (Visualforce ページ)] を選択します。
3. [New (新規)] をクリックします。
4. [Label (表示ラベル)] にWeb Chat (Web チャット) と入力します。
5. [Name (名前)] に Web_Chat と入力します。
6. 説明にUrsa Major Solar’s test website for using web chat (Web チャットを使用するための Ursa Major Solar のテスト用 Web サイト) と入力します
7. 既存のコードを次のコードと置換します。
   
   <apex:page>
 <h1>Let’s start chatting...</h1>
 <br />
 Click the button to start a chat.
 <br />
 [PASTE YOUR SNAP-INS CODE SNIPPET HERE]
</apex:page>
   
   
8. [PASTE YOUR SNAP-INS CODE SNIPPET HERE] を、以前に保存した Snap-in コードスニペットと置換します。スニペットの開始位置を覚えておきたい場合は、コードコメントをコードに残しておいて構いません。
9. [Save (保存)] をクリックします。

コードスニペットをどこかでなくしてしまっても、心配はいりません。Snap-in 設定で見つけることができます。[Quick Find (クイック検索)] ボックスに「Embedded Service」(組み込みサービス) と入力し、[Embedded Service (組み込みサービス)] を選択します。次に、リリースを表示して、[Get Code (コードを取得)] をクリックします。

Visualforce ページ URL の許可リストへの追加

Visualforce ページの URL を許可リストに追加しておくと、Web ブラウザーが独自のオリジン以外からもリソースにアクセスできます。こうすれば、お客様が簡単に Snap-in チャットにアクセスできるようになります。CORS を使用して、Ursa Major Solar のページにこの機能を設定します。

1. [Quick Find (クイック検索)] ボックスに CORS と入力し、[CORS] を選択します。
2. [New (新規)] ボタンをクリックします。
3. https://*.visualforce.com と入力します。
4. [Save (保存)] をクリックします。

テスト、テスト、テスト!

1. アプリケーションランチャー をクリックして、[Ursa Major Solar Service Console (Ursa Major Solar サービスコンソール)] を選択します。
2. 歯車アイコン をクリックして、[Service Setup (Service 設定)] を選択すると、新しいブラウザータブが開きます。
3. [Quick Find (クイック検索)] ボックスに Visualforce と入力し、[Visualforce Pages (Visualforce ページ)] を選択します。
4. [Web Chat (Web チャット)] ページの横にある をクリックして、新しいタブまたはウィンドウにチャットを開きます。
5. ページの下部にある Snap-in ボタン (チャットボタン) をクリックして、チャットを要求します。
6. [First Name (名)] 項目に Jack と入力します。
7. [Last Name (姓)] 項目に Rogers と入力します。
8. [Start Chatting (チャットを開始)] をクリックします。
9. Ursa Major Solar サービスコンソールを表示している別のタブ/ウィンドウに移動します。
10. オムニチャネルユーティリティで、チェックマークをクリックしてチャット要求を受け入れます。
11. チャットをやり取りしてテストします。
12. エージェントまたはお客様のチャットウィンドウからチャットを終了します。

お疲れさまでした。Ada Balewa とそのチームがケース管理の業務を最適化できるように、Ursa Major Solar のサービスコンソールを設定しました。Ursa Major Solar のサービスコンソールを作成してカスタマイズし、ユーティリティ項目を追加して、Ada とそのチームのアクセスを有効にしました。これでチームが、どのチャネルから届いたケースにも対応することができます。

リソース

• Salesforce ヘルプ: Live Agent の設定
• Salesforce ヘルプ: Live Agent を使用した Web サイトでのチャット
• Salesforce ヘルプ: チャットのオムニチャネルルーティングの設定
• Salesforce ヘルプ: Omni-Channel Supervisor