FileMakerエンジニア
AIを活用してグラフを作成する取り組みは、近年さまざまなシステム会社で見かけるようになってきました。
では実際に、どこまで自由に「自分の見たいグラフ」を作成できるのでしょうか。
今回はその可能性を検証するために、数値管理が重要となるコールセンター業務を題材に考えてみます。
目次
想定するユースケース（コールセンター）
コールセンターの現場ではよくこんな要望が出ます。
・担当者別の本日の架電数を見たい
・時間帯別の架電数を見たい
・成約率をグラフで見たい
これらを毎回作り込むのではなく、自然言語で指示するだけでグラフを生成できるかが今回のポイントです。
システム構成
前提として、以下のデータが管理されているとします。
担当者マスタ
顧客情報
架電履歴（日時・担当者・結果など）
① FileMaker（データ管理）
前提で挙げたデータをFileMaker内で管理します。
② AI（処理・生成）
AIの役割は大きく2つです。
1.データ取得用JSONの生成
・「担当者別に本日の架電数」
→ Data API用の検索JSONを生成
2.グラフ用HTML（Chart.js）の生成
・取得データをもとにグラフのHTML（ソースコード）を作成
③ Chart.js（可視化）
AIが生成したHTMLをそのまま使用し、グラフを表示します。
FileMakerではWebビューアを使用することで、そのまま描画が可能です。
処理の流れ
今回の全体の流れは以下の通りです。
① ユーザが自然言語で指示
例：「担当者別に本日の架電数をグラフにして」
↓
② AIがData API用のJSONを生成
↓
③ FileMakerがデータを取得
↓
④ 取得データをAIに渡す
↓
⑤ AIがChart.jsのHTMLを生成
↓
⑥ Webビューアで表示
実際のイメージ
例えば、プロンプトに「担当者別に本日の架電数」と入力するだけで、以下の要素が自動で定義されます。
・X軸：担当者名
・Y軸：架電数
・グラフの種類：棒グラフ
さらに、「時間帯別に変更して」「折れ線グラフにして」といった追加の指示にも柔軟に対応可能です。
この構成のメリット
① 開発コストの削減
従来：グラフごとに設計・実装
今回：AIが都度生成
② 柔軟性の高さ
ユーザの要望に対してその場で対応可能
③ 非エンジニアでも使える
自然言語で操作できるため、現場主導で分析が可能
注意点
この仕組みにはいくつか注意点もあります。
・AIの出力精度に依存する
・データ構造を事前に整理しておく必要がある
・完全自動ではなくチューニングが必要
特に、「どのデータをどう集計するか」のルール設計は重要です。
実際の動作
動作確認
今回は、以下のような簡易的なレイアウトを用意しました。
- 左上：プロンプト入力欄
- 下部：グラフ表示エリア
プロンプトに内容を入力し、
実際にグラフが生成されるかを確認します。
では実際にプロンプトに記載しグラフが作成されるかを確認してみたいと思います。
以下の画像のように担当者別に架電数をグラフ化してみます。
結果以下のようなグラフが表示されました。
また、表示形式もプロンプトに指定することで変更が可能です。
担当者別以外にも架電ステータス別にグラフを表示することも可能です。
件数が本当にあっているかデータを確認してみたいと思います。
架電数が一番多い「山田太郎」の架電数を検索すると51件となり、実際に表示されたグラフと同じ数値になりました。
他の担当者も検索しましたが問題なく件数があっていました。
ロジックについて
今回は、
・データ取得
・グラフ生成
の2段階でAIを使用しました。
ただしこの構成は、API使用量（トークン）が増加するというデメリットがあります。
実際に開発してみて感じたのは、どこまでAIに任せるかを明確にすることが重要という点ですので単にグラフを出したいというのではなくどういったデータのグラフを出したいのかというのが大切になってくると思います。
まとめ
FileMaker × AI × Chart.js の構成により、これまで固定的だったグラフ作成を「その場で作る」体験に変えることが可能になりました。
今回のように、すべてを自動化するのではなく、人が見たいものをAIが補助するという形にすることで、現実的かつ実用的な仕組みになります。
また、株式会社ブリエでは、FileMakerを活用したシステム開発や運用支援を行っています。
業務システムのセキュリティについてのご相談もお気軽にお問い合わせください。
多岐にわたる業種での経験を経て、現在はFileMakerを中心に活躍中のエンジニアです。ローコード開発を得意としながらも、Django、React、Flutterなどの技術にも挑戦し、幅広い開発スキルを習得。常に自分の技術を磨き、より良いソリューションを提供できるよう、継続的にスキルアップを図っています。多彩な技術を駆使して、クライアントのニーズに応える柔軟性と、迅速かつ効果的な開発力が強みです。
