🍳

LLMのプロンプトを検証するためのツールを作った

2023/10/16に公開

結論

LLMを検証していると、普段はなんの問題もなく動いているプロンプトが、プロンプトに埋め込まれるユーザーの入力値によっては、全然期待した動きをせずびっくりすることがあります(大げさに言えば、悪意のないプロンプトインジェクション的なやつです)。

様々な入力値であっても期待通りに動くプロンプトになっているかを確かめるために、ユーザーの入力値のケースをCSVとかにして簡易スクリプトを書いて回すなどの検証していたのですが、だんだん面倒になり、これって絶対誰かツールを作っているよなと思ってGihubを調べてもそれっぽいのが見つけられなかった(検索力が無いだけの可能性)ので、自分でつくってみました。

UIは以下。OpenAIのPlayGroundをリスペクト。
プロンプトに変数を定義して、変数部分に色々な値に設定して一度に実行したいんじゃ! という方におすすめです。

こちらからお試しいただけます!(OpenAI / Azure OpenAI ServiceのAPIキーが必要です)
ソースコードも見えます。

できること

  • プロンプト内の変数を{{var1}}のように定義できます
  • 変数に別々の値を設定して、複数ケースを一度に実行できます
  • 結果をCSVで一括ダウンロードできます
  • LLMの実行結果が自動的に履歴として保存されます

使い方

  1. 右上の歯車マークからOpenAIもしくはAzure OpenAI ServiceのAPIキーを設定します
  2. 左パネルのPrompt部分にプロンプトを入力します
  • {{}}で囲うと変数として定義できます。以下の例だと{{Text}}の部分が変数になります。
  • 以下は重要なポイントを箇条書きでまとめてくれという内容です
Summarize the text below as a bullet point list of the most important points.

Text: {{Text}}
  1. 必要であればシステムプロンプトを入力します
  • 未入力でも問題ないです
  • プロンプトとシステムプロンプトの使い分けについては野生の勘でお願いします(ググってください)
  • 例えば以下のようなシステムプロンプトを入れておけば、プロンプトや変数部分の言語がなんであれ、京都弁で回答してくれます
日本語の京都弁で回答してください
  1. 右パネルに変数化した部分の値を入力してください
  • 複数ケースを1度に実行したい場合は右パネル下部の「Add Case」ボタンを押すと、入力エリアが増えます
  • 以下の例は、WikipediaでのOpenAI社の歴史に関する部分の抜粋
2015–2018: Non-profit beginnings
In December 2015, Sam Altman, Greg Brockman, Reid Hoffman, Jessica Livingston, Peter Thiel, Elon Musk, Amazon Web Services (AWS), Infosys, and YC Research announced[12] the formation of OpenAI and pledged over $1 billion to the venture. The actually collected total amount of contributions was only 130 million until 2019.[5] The organization stated it would "freely collaborate" with other institutions and researchers by making its patents and research open to the public.[13][14] OpenAI is headquartered at the Pioneer Building in Mission District, San Francisco.[15][16]
...
  1. 右パネルの緑の「Submit」ボタンを押すと、ケースが上から順々に実行されます
  • 並列実行させたかったのですがRateLimitを考慮して並列実行させる元気がなかったのです。お察しください。
  1. 後は、ケースの削除、ケース単体でのリトライ、CSVでの出力など、必要に応じてお試しください

仕組み

  • データはすべてLocalStorage内に持つようになっており、クライアント側で完結するようになっています
  • なので設定したAPI_KEYとかは少なくとも私には見えないのでご安心ください
  • じゃあなんでNext.js使ってるの?とコードを見てくれた方は思うかもしれませんが、環境変数に(API_KEYなど)を設定してデプロイすると、ユーザー側でのAPIキーの設定が不要になり、サーバー側を経由してAPIキーを付与した上でOpenAIなどにリクエストが飛ぶようになります。社内向けのプロンプト検証環境として提供したいという狙いがあり、こういう形になっています。

感想

  • LLMを使った何かをつくるという目標を社内で設定したが、数日で実装でき、かつ実用的なものを何も思いつけなかった。なのでツールで誤魔化した感がある。
  • 感想としてはNext.jsのApp Routerは難しいなということと、Mantineは色々揃っていていいな、ということ。

Discussion