このブログエントリは IBM Cloud アドベントカレンダー 2023 に参加しています（西川さん、いつもありがとうございます！）。12/04 ぶんの記事です：
IBM Cloud から提供されている生成 AI のプラットフォーム（および API ）の watsonx.ai を使って英会話練習アプリを作って、公開してみました：
https://github.com/dotnsf/wwx
【使うための準備】
アプリケーションを動かすには以下が必要です（IBM Cloud 上での手続きが必要ですが、フリープランを使って無料枠内で運用するぶんには料金はかかりません）：
・Git および Node.js がインストールされ、インターネットに繋がる PC(Windows, MacOS, Linux, ..）と Chrome ブラウザ
・IBM Cloud のアカウント
・IBM Cloud の API キー
・IBM Cloud 内で Watson Studio および Watson Machine Learning のインスタンスをダラスのデータセンターで有効化
・IBM Watsonx.AI のプロンプトラボを使った時のプロジェクト ID
以前に watsonx.ai の REST API を紹介した記事を書きました。Watson Studio や Watson Machine Learning を有効にする手順や、API キー、プロジェクト ID を取得する手順についてはこの記事内でも紹介しているので必要に応じて参照してください：
https://dotnsf.blog.jp/archives/1082246988.html
【アプリケーションのセットアップ】
では実際に英会話アプリケーションを使うためのセットアップを行います。まずはコマンドプロンプトやターミナルを開いて、git でソースコードをクローン（ダウンロード）します：
ダウンロードしたソースコードの依存ライブラリをインストールします：
テキストエディタで .env ファイルを開き、あらかじめ用意してある API キーとプロジェクト ID の内容をそれぞれ以下の場所に（コピー＆ペーストするなどして）記述し保存します。他の部分は変更不要です。イコール記号の前後や行頭・行末に余計な空白などが含まれてないように注意してください：
最後にアプリケーションを実行します：
"server starting on 8080 ..." と表示されていれば、アプリケーションの実行ができています。
【英会話アプリを実行する】
では実際に英会話アプリを実行してみましょう。Chrome ウェブブラウザ（WebAudio API を使うため、FireFox は NG）を起動し、"http://localhost:8080/" にアクセスしてみましょう：
↑上のような画面が表示されると思います（途中でマイク許可のダイアログが表示されたら「許可」してください）。この画面を使って英会話を練習します：
女性の口の部分がマイクのスイッチになっています（最初は青いボタンです）。ここをクリックするとマイクがオンになるので、マイクオンの状態で英語で話しかけてみてください：
話し終わってある程度の無入力時間が経過すると、それまでに話した内容を WebAudio API が英語で解釈し、その解釈結果が画面に表示されます：
（↑ "Hello. May I have your name, please?" と聞いてみました）
同時に解釈した結果（を英会話向けにプロンプトで加工したもの）を watsonx.ai が読み取り、英会話として続くような内容を返し、最後に WebSpeech API を使って英語で答えてくれます：
（↑ちゃんと名前を教えてくれ、続けて私の名前を聞かれました。ちゃんと英会話として成立しています）
同様にして再度マイクオンにしてからマイクに英語で話しかけると英語で答えてくれる、という作業を繰り返すことができます：
（↑「キムラ」が「キモラ」になってしまいましたが、これは私の英語発音が良すぎたせいで・・・ということにしておきます）
ぼっちでも英会話練習がはかどりますね。
この仕組みの内部的な挙動を少し説明しておきます。watsonx.ai ではいくつかの基盤モデルと呼ばれる大規模言語モデルが提供されているのですが、今回はその中からメタ社が提供している Llama2 という言語モデルを採用しています（後述のプロンプト含めていくつか試してみた上で、自然な英会話を成立させることができそうだ、と判断しました）。
また音声入力のテキスト化と、生成 AI による出力結果であるテキストの音声出力については Chrome ブラウザの WebAudio API を使っています。この部分についてはサーバーサイド型の仕組みを使うとタイムラグが大きくなってしまうため、ブラウザ内で実装できる方法を検討した結果です。とはいえ、聞き取り精度も、話す際の自然さも悪くないと感じています。一方でブラウザ毎の WebAudio API の実装に伴う制約などがあった場合にその制約を受けることにもなります（例えば FireFox では動かない、など）。
ちなみに Chrome WebAudio API 自体は日本語にも対応していて、日本語でも聞き取り＆しゃべりどちらも高い精度でした。別の機会に使えそうでした。
そして肝心のプロンプトです。言葉で発した音声をテキスト化し、それをそのまま生成 AI へ・・・というわけではありません。実は上で .env ファイルを編集した時の４行目にこのような長い一行がありました：
詳しくはソースコード内を参照していただきたいのですが、実はこの４行目がプロンプトの指示部分になっていて、音声入力したテキスト部分に先立って入力されています。その内容を日本語で書くと、このような内容です：
このインストラクションに続いて、実際に喋った内容が英語で続けられたテキストが生成 AI に渡されています。このインストラクション部分がプロンプトに含まれていることで、（比較的初級の）英会話
アプリとして動くようになっています。
つまりこの .env の４行目部分を更にカスタマイズすることで英会話としての挙動を変えることもできると思っています（この部分が長くなる場合は現在 100 で固定している max_token 長も変更の必要があるかもしれません）。まあそのあたりに関しては（プロンプトエンジニアリングの楽しい部分でもあるので）ぜひ皆さんで試してみてください。 ・・といいつつ、実は私もこの辺りは同僚の後輩に手伝ってもらってたりするんですけど（笑）。
IBM Cloud から提供されている生成 AI のプラットフォーム（および API ）の watsonx.ai を使って英会話練習アプリを作って、公開してみました：
https://github.com/dotnsf/wwx
【使うための準備】
アプリケーションを動かすには以下が必要です（IBM Cloud 上での手続きが必要ですが、フリープランを使って無料枠内で運用するぶんには料金はかかりません）：
・Git および Node.js がインストールされ、インターネットに繋がる PC(Windows, MacOS, Linux, ..）と Chrome ブラウザ
・IBM Cloud のアカウント
・IBM Cloud の API キー
・IBM Cloud 内で Watson Studio および Watson Machine Learning のインスタンスをダラスのデータセンターで有効化
・IBM Watsonx.AI のプロンプトラボを使った時のプロジェクト ID
以前に watsonx.ai の REST API を紹介した記事を書きました。Watson Studio や Watson Machine Learning を有効にする手順や、API キー、プロジェクト ID を取得する手順についてはこの記事内でも紹介しているので必要に応じて参照してください：
https://dotnsf.blog.jp/archives/1082246988.html
【アプリケーションのセットアップ】
では実際に英会話アプリケーションを使うためのセットアップを行います。まずはコマンドプロンプトやターミナルを開いて、git でソースコードをクローン（ダウンロード）します：
$ git clone https://github.com/dotnsf/wwx
ダウンロードしたソースコードの依存ライブラリをインストールします：
$ cd wwx $ npm install
テキストエディタで .env ファイルを開き、あらかじめ用意してある API キーとプロジェクト ID の内容をそれぞれ以下の場所に（コピー＆ペーストするなどして）記述し保存します。他の部分は変更不要です。イコール記号の前後や行頭・行末に余計な空白などが含まれてないように注意してください：
WATSONX_API_KEY=（API キーの値） WATSONX_PROJECT_ID=（プロジェクト ID の値） WATSONX_MODEL_ID=meta-llama/llama-2-70b-chat WATSONX_INSTRUCTION=[INST] <<sys>>\n ....（略） WATSONX_PRE_INPUT=[User] WATSONX_POST_INPUT= \n[/User]\n
最後にアプリケーションを実行します：
$ node app
server starting on 8080 ...
"server starting on 8080 ..." と表示されていれば、アプリケーションの実行ができています。
【英会話アプリを実行する】
では実際に英会話アプリを実行してみましょう。Chrome ウェブブラウザ（WebAudio API を使うため、FireFox は NG）を起動し、"http://localhost:8080/" にアクセスしてみましょう：
↑上のような画面が表示されると思います（途中でマイク許可のダイアログが表示されたら「許可」してください）。この画面を使って英会話を練習します：
女性の口の部分がマイクのスイッチになっています（最初は青いボタンです）。ここをクリックするとマイクがオンになるので、マイクオンの状態で英語で話しかけてみてください：
話し終わってある程度の無入力時間が経過すると、それまでに話した内容を WebAudio API が英語で解釈し、その解釈結果が画面に表示されます：
（↑ "Hello. May I have your name, please?" と聞いてみました）
同時に解釈した結果（を英会話向けにプロンプトで加工したもの）を watsonx.ai が読み取り、英会話として続くような内容を返し、最後に WebSpeech API を使って英語で答えてくれます：
（↑ちゃんと名前を教えてくれ、続けて私の名前を聞かれました。ちゃんと英会話として成立しています）
同様にして再度マイクオンにしてからマイクに英語で話しかけると英語で答えてくれる、という作業を繰り返すことができます：
（↑「キムラ」が「キモラ」になってしまいましたが、これは私の英語発音が良すぎたせいで・・・ということにしておきます）
また音声入力のテキスト化と、生成 AI による出力結果であるテキストの音声出力については Chrome ブラウザの WebAudio API を使っています。この部分についてはサーバーサイド型の仕組みを使うとタイムラグが大きくなってしまうため、ブラウザ内で実装できる方法を検討した結果です。とはいえ、聞き取り精度も、話す際の自然さも悪くないと感じています。一方でブラウザ毎の WebAudio API の実装に伴う制約などがあった場合にその制約を受けることにもなります（例えば FireFox では動かない、など）。
ちなみに Chrome WebAudio API 自体は日本語にも対応していて、日本語でも聞き取り＆しゃべりどちらも高い精度でした。別の機会に使えそうでした。
そして肝心のプロンプトです。言葉で発した音声をテキスト化し、それをそのまま生成 AI へ・・・というわけではありません。実は上で .env ファイルを編集した時の４行目にこのような長い一行がありました：
WATSONX_API_KEY=（API キーの値） WATSONX_PROJECT_ID=（プロジェクト ID の値） WATSONX_MODEL_ID=meta-llama/llama-2-70b-chat WATSONX_INSTRUCTION=[INST] <<sys>>\nYou are a friendly, respectful and honest friend. Always answer as friendly as possible, while being safe. Your answers should not include any harmful, unethical, racist, sexist, toxic, dangerous, or illegal content. Please ensure that your responses are socially unbiased and positive in nature. Also try to ask something for me, not try to help me.\n\nIf a question does not make any sense, or is not factually coherent, tell that you don't understand that well. If you don't know the answer to a question, please don't share false information.\n\nYou are an English speaker.\nIf you are asked a question in Japanese, please answer that you don't understand Japanese, and if you are asked a question in English, please answer in English.\n\nThe user is at beginner level of English, so please answer in easy and short English sentence as much as possible. Also you don't speak so much.\n\n<</SYS>>\n[/INST]\n WATSONX_PRE_INPUT=[User] WATSONX_POST_INPUT= \n[/User]\n
詳しくはソースコード内を参照していただきたいのですが、実はこの４行目がプロンプトの指示部分になっていて、音声入力したテキスト部分に先立って入力されています。その内容を日本語で書くと、このような内容です：
あなたは優しく正直な友人です。可能な限りフレンドリーに回答してください。 でも相手を傷つけたり攻撃するような言葉は使わないでください。 ・・（中略）・・ あなたは英語を話します。日本語で質問されても英語で「日本語はわからない」と答えてください。 英語で質問されたら簡単な英語で端的に答えてください。・・
このインストラクションに続いて、実際に喋った内容が英語で続けられたテキストが生成 AI に渡されています。このインストラクション部分がプロンプトに含まれていることで、（比較的初級の）英会話
アプリとして動くようになっています。
つまりこの .env の４行目部分を更にカスタマイズすることで英会話としての挙動を変えることもできると思っています（この部分が長くなる場合は現在 100 で固定している max_token 長も変更の必要があるかもしれません）。まあそのあたりに関しては（プロンプトエンジニアリングの楽しい部分でもあるので）ぜひ皆さんで試してみてください。 ・・といいつつ、実は私もこの辺りは同僚の後輩に手伝ってもらってたりするんですけど（笑）。
