【Salesforce】カスタマーセンター用のトークスクリプトフローを開発してみた

この記事は、[Ateam LifeDesign Advent Calendar 2023](https://qiita.com/advent-calendar/2023/ateam-life-design) の21日目の記事です:christmas_tree:

# はじめに
今回はSalesforceの**フロー機能（画面フロー）・カスタムオブジェクト**を使用した開発をご紹介します。
全体の開発内容はかなり膨大なので、今回はその中でも1番の推しポイントを:point_up_tone1:

# 自己紹介
初めまして！
私はエイチームライフデザインでSalesforce開発を行っています。が、エンジニアではありません。
もとはカスタマー部門で接客を行なっており、エンジニアとは程遠いところにいました。
そんな私ですが、縁あって現部署に異動し、Salesforce未経験ながらも異動後3ヶ月で開発＆リリースをしたのがトークスクリプトフローです。
もうすぐ異動して1年が経ちますが、非エンジニアの私でもここまでの業務システムが作れるようになったんだ...！と、自信を持ち始めている今日この頃です。

# トークスクリプトフローとは
カスタマーセンターにはお客様対応に必要なトークスクリプトが用意されていると思います。
問い合わせごとにまとめられているトークスクリプトでも、お客様の状況や返答によってトークは分岐していくため、オペレーターは瞬時にどのトークをするのか判断しなければいけません。
また、対応履歴の記録や、タスクが発生した場合のToDo作成など、終話後の後処理も多くあります。
トークスクリプトフローとは、カスタマーセンターにおける、
- 接客の質の担保（トーク漏れや誤案内の防止）
- 教育工数の削減
- 業務の効率化

を叶えるために開発した、
トークスクリプトの表示出しわけと、レコード作成に必要なデータ入力を同時に行えるシステムです。

# 今回紹介する推しポイント:point_up_tone1:
- トークスクリプトとして画面に表示するテキストの管理を、現場で行える仕様にした点
    - テキストをフロー内に直置きすると、軽微なテキスト変更であってもフローの修正が必要になってしまうため
- お客様名やスタッフ名などのデータ挿入を可能にした点

# やったこと

### １．画面フローを作成
- トークスクリプトを表示するための画面要素を作成します
    - このテキスト部分を現場管理にできる仕様にしていくよ！
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/e8b8fffe-8480-beb6-cf9c-8a2bd16c4da7.png)

### ２．カスタムオブジェクトを作成
- トークスクリプトを管理するためのカスタムオブジェクトを作成します
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/396a7f8b-8da7-83d3-b1a9-db253325fe9b.png)
- 表示を出し分けたいブロック数分の項目を作成します
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/9fce2ef3-30ff-550f-b975-e4981051cf9e.png)

### ３．レコードを作成
- ②で作成したカスタムオブジェクトでレコードを作成します
    - トークスクリプトを出し分けたいブロックに分けて、作成した各項目に入力します
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/b2dd93cc-c31d-5795-d360-a7ab935e9d7f.png)

### ４．画面要素の表示テキストをカスタムオブジェクトの項目に変更
（ここから画面フローに戻ります）
- ③で作成したレコードを取得します
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/60d30849-198a-772f-a816-7dfaf8610a36.png)
- ①で作成した画面要素の表示テキストコンポーネントを、取得したレコードの項目に差し替えます
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/7b7e0048-2a38-f434-383b-a565988b950a.png)

### ５．デバッグで確認
- 入力したトークスクリプトが表示されていますね！
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/572488bc-14e6-f96a-25a9-e22d7eca3c00.png)
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/d885ebfd-f0fb-059c-70e7-aa898ccfd32a.png)
- しかし、よく見るとスタッフ名やお客様名が反映されていません:cry:
    - これはテキストとして認識されてしまっているため、文字列を置換する必要がありそうです...
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/3ecd6181-a261-5434-5654-b0c91fe5d4ff.png)

### ６．文字列置換の処理を追加
- わかりやすく、トークスクリプトのテキストを変更しておきます
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/546fd073-a7a0-1749-e43d-24ffe9c69528.png)
- 文字列置換の数式リソースを項目数分作成します
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/8fcd56e8-6326-09a2-5645-5f7708674b71.png)
- 作成した数式リソースを各項目に割り当てます
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/35c0289c-77fc-9a65-3238-3a3c8dbb9155.png)

### 7．デバッグで再確認
- 無事、テキストが変換されて、データ挿入ができました:tada:
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/f5a2a8f0-389e-e68a-f9a0-243cae200546.png)
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/2660018a-33a0-92ef-02da-b07f84c7f705.png)
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/27d375c9-c5e7-89bd-d71a-0942b52af45d.png)

### ちなみに...
トークスクリプトは【表示テキスト】コンポーネントを使用しています。
いかにもトークスクリプト用の【コールスクリプト】というコンポーネントがありますが、アイコンが大きくて場所をとるのと、改行ができなかったので、使用しませんでした。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3618356/a3c990ff-3015-d162-55ea-6448dea01d7f.png)



# さいごに
フローでシステム化したはいいけど、変更が多くてメンテナンス工数がかかる...ということはよくあると思います。
ちょっと変わったカスタムオブジェクトの使い方かもしれませんが、こんな使い方もできるんだ！と、どなたかの参考になれば幸いです:santa: