Difyでシステムデザイン面接対策用のAIチャットシステムを作ってみた
IT 系の技術職において、中途面接でよく聞かれるのがシステムデザインに関する問題である。
これに関しての勉強や対策を行いたかったのだが、練習問題がそんなにあるわけでもない、問題に対して明確な正解がない、回答を評価してくれる人が身近にいないというのが課題であり、なかなか対策が行えずにいた。
それなら、AI に任せてしまえばよいのでは？と考え、今回は中途採用の面接で頻出するシステムデザイン問題に備えるため、問題を考えてもらって出題・それに対するこちらからの回答を受け取って 100 点満点で評価してもらう自作の AI チャットシステムを構築しました。
作成にあたり、細かいプログラミングが不要で AI アプリケーションを作成できるプラットフォーム「Dify」を利用してみたので、そちらについても記載する。
Dify とは何か？
Dify1は、オープンソースの AI アプリ開発プラットフォームです。Backend as Service（BaaS）と LLMOps（Large Language Model Operations）の理念を融合し、開発者だけでなく、プログラミングが得意でない人でも直感的に AI アプリケーションを構築できるツールです。
簡単に言うと、「ノーコードで ChatGPT のような AI アプリを作れるツール」と考えてください。
特徴としては以下のようなものがあります。
- ノーコード・ローコード開発
- 豊富な AI モデル対応
- 強力な RAG 機能
- ワークフロー機能
- エージェント機能
- 豊富な連携機能
今回の記事では詳細な機能説明は省きますが、詳しく知りたい方は公式サイトや他の解説記事をご覧ください。
Dify で AI チャットシステムを作ってみる
それでは今回の主旨である、システムデザイン対策用の AI チャットシステムを作成してみます。
アカウント作成
- Dify 公式サイトにアクセス
- 「始める」をクリック
- メールアドレスとパスワードを設定してアカウント作成し、ログインする
最初のアプリケーション作成
- ダッシュボードで「新しいアプリを作成」をクリック
- アプリケーションのタイプを選択
アプリケーションのタイプには、以下があります。
- ワークフロー: 複雑な処理フロー
- チャットフロー:処理フローを組み込んだチャットボット
- チャットボット: 対話型の AI アシスタント
- エージェント: 自律的な AI エージェント
- テキスト生成: 入力に基づくテキスト生成
今回は「チャットフロー」を選択し、アプリ名を入力して作成するを押下します。
フロー作成
具体的なフローを作成します。
最初に載せておきますが、最終的なフローは以下の図のようなものになります。
最初のフロー作成時には開始、LLM、応答の３ブロックがあると思いますが、そこから処理ブロックを加えていき上記のようにしていきます。
以下に、一つずつノードについて説明していきます。
変数定義
まずは、事前にこのチャットシステム上で利用する変数を定義しておきます。
問題文を保存しておく変数 problem と、こちらの回答を保存しておく answer という変数を定義しておきます。
画面右上のボタンから会話変数を定義できるので、ここで problem,answer という名前の変数を定義して下さい。（どちらも String）
この変数は後ほど利用します。
開始ノード
今回のチャットフローの開始地点となるノードです。
最初からあるものですが、ここは今回は特に変更不要です。
条件分岐ノード
その次に IF/ELSE ブロックにより、条件分岐のフローを設けます。
ここでは、問題を出題するか、回答を受け取って採点するフローに行かせるかに分岐します。
条件には、先ほど定義した変数 problem に値が入っているかいないかで分岐します。
以下の図のように設定して下さい。
変数 problem に値が入っていない場合は問題出題のフローへ、入っている場合は採点のフローへと行きます。
具体的にこの変数 problem に値を入れる動作については後ほど定義します。
問題生成ノード
最初に問題出題のフローについてを書きます。
まずは、LLM ノードを使って問題文を生成するノードを作ります。
先ほどの条件分岐で変数が空の場合の後の処理として、以下の図のように設定して下さい。
ここでは問題文を生成するプロンプトを図のように定義します。別のプロンプトにしたい、および別の AI モデルを使用したい場合はそちらを利用して構いません。
ポイントとしては、生成した問題文を後続のフローに流すために、出力変数を設定する事です。
問題文保存ノード
次にその問題を保存するノードについてを設定します。
前の問題生成ノードから生成した問題文を受け取って、それを変数に格納します。
ノードを以下の図のように設定して下さい。
前ノードで出力変数をオンにしておくと、生成した内容が変数 text に入るので、その内容を problem という変数に格納します。
問題出題ノード
次にその問題をチャットシステム上で表示・出題するノードについてを設定します。
変数 problem にある問題文を使って、チャット上に表示します。
ノードを以下の図のように設定して下さい。応答文は変えてもらっても大丈夫です。
これによりチャット上で、システムデザインの問題が出題されるようになります。
問題出題のフローについてはここまでです。
回答保存ノード
ここからは、採点のフローについてを書いていきます。
まずは回答を保存するノードについてを設定します。
ユーザーが入力した内容を問題への回答と扱い、それを回答保存用の変数 answer に格納します。
ノードを以下の図のように設定して下さい。
チャットで入力した内容は sys.query という変数に入るので、その内容を answer に保存します。
採点ノード
次に、実際に採点をするノードについてを書いていきます。
変数 problem と answer から問題文、回答を取り出し、採点を行います。
以下の図のように設定して下さい。
このノードでは、問題文と回答に対して、各観点から１００点満点で採点を行います。
プロンプトは以下のように設定していますが、観点や採点方法など変えたい場合は各自で適宜置き換えて設定して下さい。
その後、採点結果を後続のノードに渡すために、ここも同じく出力変数をオンにしておきます。
採点結果表示ノード
次に、採点結果をチャットに表示するノードについてを書いていきます。
先ほどの採点ノードでの結果を、チャットシステム上に表示します。
以下のように設定して下さい。
ここでも前ノードで出力変数をオンにしておくと、生成した内容が変数 text に入るので、その内容をここで表示させます。
これにより採点結果がチャット上に表示されます。
変数クリアノード
最後に、両変数をクリアする処理を行います。
先ほどの採点結果表示ノードの後に、以下のようなノードを設定します。
ここでは、変数 problem と answer の中身をクリアする処理を行います。
これにより、次に実行する時は再度問題出題が行われるようになります。
テストとデバッグ
ここまで実装ができたら、プレビュー機能を使ってテストをしてみましょう。
画面上部にある「プレビュー」ボタンを押して下さい。
すると、チャット用のウィンドウが表示されて、入力できるようになります。
何かしら入力して送信すると、システムデザインの問題が出題されるはずです。
出題されたら、それに対して以下のような回答文を入力して返信してみます。
その後、その回答を問題文と照らし合わせて、採点結果を返してくれるはずです。
もっとこうしたい、またはこのような観点でみてほしい、などあれば、ノードに設定しているプロンプトなどを適宜調整してみて下さい。
公開・利用
テストをして満足のいく場合は、「公開する」ボタンから「更新を公開」を押して公開しましょう。
すると最新版が公開されます。
公開した後は上記の「アプリを実行」からでも実行できますし、「サイトに埋め込む」から自身の Web ページなどに埋め込んで利用させることも可能です。
また共有用の URL が発行されるので、画面左部からそれを取得できます。
以後は、その URL からチャットシステムを表示、実行できます。
今回は Dify を使って個人的なシステムデザイン対策用 AI チャットシステムを作ってみました。システムデザインの対策で利用し、適宜調整しながら良いものにしていきたいですね。
また別にシステムデザイン対策に限らず、他の用途に対してのシステムも作成可能なので、各自やってみたいことに対してのチャットシステムを応用して作ってもらえたらと思います。