chatGPTのプロンプトエンジニアリングしてたときに面倒だったことを解決するために、ChatGPTと協力しつつ数時間でプロンプトエンジニアリングの補助ツールを作成しました
解決したかった問題
chatGPTのAPIを使ったサービスを作ろうというときに、何かしらのタスクに最適化しようと考えると、systemメッセージのprompt engineeringが必要になってきます。
最近はそれすら汎用プロンプトで解決しようとしたり、AutoGPTなどで解決を図ったりしていますが、開発者としてはそれで使用トークン数が増えていくのは避けたかったりします（一般の人の一部もそう思うようになるかも？）
そこで質のいい出力ができる指示を書きたいのですが、コツはあれどなかなか一発で満足がいくものはできないもので、試行錯誤が必要です。
google colaboratoryとか開いてやっていたわけですが、、、
「いちいち入力考えるのめんどくさ！！！！」
「レスポンスコピペしていくのも面倒！！！！」
となってくるわけです。
そこで
「じゃあユーザーの入力も仮でchatGPTに作ってもらえばいいんじゃね？」
と思い、フロントエンドなのでUIも作ってしまうことにしました。
機能
- API keyを入力することで使えるようになります。
- main system messageを入力します
- こっちがテストしたい、assistantの出力を生成するためのプロンプトです
- sub system messageを入力します
- これがユーザーの入力を生成するためのプロンプトになります
- 最初のメッセージを入力します
- これはuserでもassistantでも構いません
- あとはgenerateボタンを使って交互に生成できます
こんな感じで指示を出しておけば勝手に会話してくれます
対話がユーザー体験のキーとなるようなサービスを作ろうとしているときに、いちいち入力を自分で考えなくてもよくなるのがうれしいところかと思います
送信するメッセージ数に上限を付ける機能も付いているので、実際にAPIを使ってサービス化するときに近い状態での開発が気軽にできるでしょう。
技術的な面について
Next.js & Vercel の楽々コンビでパパっと作りました。
とりあえずってところで独自ドメインも取ってないです。
一応、先日Next.jsのversion 13.3がリリースされたということで、最新バージョンでの開発をしてみています。
とはいえ今のところ13.3の恩恵はあまり受けていないですけどね、、、
（最初に作ったときにlayoutやpageの記述がちょっと変わってて、おおって思ったくらい。meta情報はすごく書きやすくなっています。機会があればルーティングの機能も使いたいですね）
そういえばcreate-next-appしたときに、tailwind使うかを聞かれるようになったのですが、これも13.3からなのかな？
tailwindはよく使うので、デフォルトで設定がサポートされるようになったのはすごく楽でありがたいですね
いや1ページのツールにNext.jsはオーバースペックすぎるだろとのご指摘、ごもっともです。
ChatGPTとの協業について
今回、開発をブーストさせるためにChatGPTもそれなりに使いました。
tailwind使ってるよっていうだけで、良い感じのclassNameを付けてくれるのがありがたいところでしたね。
どんな感じにするか迷うところなので、とりあえずでこんな感じでどう？って出してくれるChatGPTは開発時間の短縮に貢献してくれるありがたい存在でした。
今後もっと開発を任せられる存在にしていきたいですね。仕事減っちゃうけど。
でもそういう方向に進んでく、進んでいるのは明確なので、早いとこ適応しよう、先駆者になっていこうというところです。
最後に
ChatGPT APIを使った開発の際にはぜひ使ってみてください！
ご意見・ご要望等もお気軽に！