こんにちは、CCCMKホールディングスTECH LABの三浦です。
最近目の疲れが気になってきたので、夜寝る前に目の周りをマッサージしたり温めたりしてケアするようにし始めました。あと、寝る15分前はスマートフォンやタブレットを見ないようにする習慣も付けるようにしました。そしたら少し、これまでよりも体の調子が良くなってきたような気がしています。今まであまり気にしていなかったのですが、目の疲れって結構体の色々なところに影響していたのかも・・・と考えるようになりました。
前回LLMを使用した開発向けのフレームワーク"LangChain"をご紹介しました。
LangChainを使用することでGPT-3をはじめとする色々なLLMを組み込んだアプリケーションを開発することが出来ることが分かりました。今度はこのアプリケーションにGUIを設けてもっと気軽に扱えるようにしたい、と考えるようになりました。
普段機械学習寄りの業務をしていると、なかなかフロント開発(Webアプリケーション開発など)に携わることが少なく、"GUIどうやって開発しよう・・・"はいつも悩みの種になります。こういう時、PythonのWebアプリケーションフレームワーク"Streamlit"を利用する方法があります。
今回は少し方法を変えて、最近Azure OpenAI Serviceで利用できるようになった"GPT-4"を利用してWebアプリケーションの開発が出来るのか、試してみようと考えました。Chatエンジンは私(人間)が開発し、それを組み込んだWebアプリケーションはAI(GPT-4)が担当するという、人間とAIの共同作業による開発の試みです。
やること
今回作りたいのは、LangChainで開発したLLM(GPT-3)を利用したエンジンを組み込んだChat風Webアプリケーションです。とりあえず作らないといけないのは以下になりそう、という当たりまでは付いていたのでまずリストアップしてみました。
- Webアプリケーションの画面になるHTML/Javascript/CSS
- サーバーサイドの動作を決めるflaskを使用したPythonプログラム
- LangChainで開発したChatエンジン
このうち3は私が開発し、1, 2をGPT-4が開発します。
GPT-4
2023年3月22日のMicrosoftのブログでOpenAIの最新のLLM、GPT-4がAzure OpenAI Serviceでプレビューで利用可能になったとのアナウンスがありました。GPT-4はChatGPTのように会話用途に最適化されているそうですが、GPT-3のようなテキストを生成するタスクでも動作することが出来ます。
現在GPT-4としてAzure OpenAI Serviceではgpt-4, gpt-4-32kの2つのモデルが提供されています。それぞれ扱えるトークンの長さに違いがあり、gpt-4は最大,8192トークン、gpt-4-32kでは最大32,768トークン扱うことが出来、料金も異なります。GPT-4を利用するためにはMicrosoftの申請フォームを記入し、waiting listに登録してしばらく待つ必要があります。
私が開発したコード
こちらが私が作った、LLM(GPT-3)と会話をするためのエンジンになるPythonモジュールです。Chatクラスのオブジェクトを生成する際に話し相手になるAIの特性をsystem_textで決められるようにしています。ユーザーとの会話は10ターン分保持して会話生成時に使用します。
from langchain.llms import AzureOpenAI from langchain.memory import ConversationBufferWindowMemory from langchain.chains import LLMChain from langchain.prompts import PromptTemplate # 接続情報設定 os.environ["OPENAI_API_KEY"] = "..." os.environ["OPENAI_API_BASE"] = "..." os.environ["OPENAI_API_VERSION"] = "..." os.environ["OPENAI_API_TYPE"] = "..." class Chat(): """ Chat向けのLLMChainを管理し、Chat機能を提供するClass """ def __init__(self,system_text): #Prompt Template template = """ {system_text} {chat_history} Human:{human_input} AI: """ chat_prompt = PromptTemplate( input_variables=["chat_history","human_input","system_text"], template=template ) #直近10回分のやり取りを保存させる memory = ConversationBufferWindowMemory( k=10,memory_key='chat_history' ) llm = AzureOpenAI( deployment_name='text-davinci-003', temperature=0.7, max_tokens=1024 ) self.chain = LLMChain( llm=llm, prompt=chat_prompt.partial(system_text=system_text), memory=memory ) def talk(self,input): return self.chain.run(input) if __name__=='__main__': """ 動作テスト用 """ system_txt = "あなたは明るいAIです。ユーザーと会話をしてください。" chat = Chat(system_txt) while True: input_text = input("テキストを入力してください：") print(chat.talk(input_text))
GPT-4の開発
では先ほどのエンジンを組み込むWebアプリケーションの開発を、GPT-4に指示してみます。Azure OpenAI ServiceではAzure OpenAI StudioのPlaygroundのChatでGPT-4を使用することが出来ます。GPT-4のモデルgpt-4-32kを使用しました。
まずAIの性格を決めるシステムメッセージとして、
あなたはフロントエンド開発エンジニアです。
と入力してみました。そして指示として
AIと会話が出来るChat風Webアプリケーションを開発します。 フロントはHTMLとJavascriptを使用し、AIとユーザーの会話が左右に交互に表示されるようにしてください。 サーバーサイドはPythonのFlaskを使用し、AIの会話の生成はopenaiライブラリを使用してください。
と入力しました。"AIの会話の生成"は私が用意したエンジンを使用するのですが、ここでは一旦openaiを使用して作ってもらい、後で自分で修正しようと考えました。
するとPlaygroundに以下の様に回答が生成されていきました。
あとは表示されたHTMLのコードをindex.htmlに保存、Pythonのサーバのコードをapp.pyに保存、それぞれ適切な位置に配置した後、app.pyの使用するエンジン部分を少し手直しすることで以下のようなGUIのWebアプリケーションを作ることが出来ました。
これでも十分機能するのですが、タイトルを付けたり入力用のテキストボックスを改行対応したり細かい部分を引き続きGPT-4に指示を出して修正し、最終的には以下のような画面のWebアプリケーションに仕上がりました。
まとめ
ということで、今回はChat風Webアプリケーションの開発をGPT-4と一緒に行ってみた話をご紹介しました。本当はGPT-4とのやり取りでもっと試行錯誤が発生するんじゃないか・・・と想定していたのですが、想像以上に的確に回答を得られることが出来、その心配も杞憂に終わりました。
GPT-4は、gpt-3.5-turboよりも回答に回りくどさが無いというか、必要なことをより明確に伝えてくれる感じがし、かなり性能が向上しているような印象を受けました。これだけシンプルなPromptでもほぼ意図したとおりの画面を作ることが出来たので、これからはシステムを利用するユーザー自身が自分が使いやすい画面を自分自身で作ることが出来る、そんなシステムが実現できるかもしれません。今回は色々と考えさせられる体験となりました。
