OpenAI Chat APIを利用したアプリのUIとプロンプトの実装

# はじめに

[ChatGPT](https://openai.com/blog/chatgpt)、流行っていますね。

ChatGPTの開発会社である[OpenAI](https://platform.openai.com/)がAPIを提供してくれているおかげで、いろいろなアプリやサービスにAI機能が搭載されはじめています。

この流れに乗り、僕も自社開発しているアプリに**OpenAI Chat API**を使い、AIアシスタント機能を実装しようと思います。

:::note info
本稿では、OpenAI Chat APIの `model` は `gpt-3.5-turbo` を使用しています
:::

# アプリのイメージ

手始めに今、考えている機能は「類義語検索」です。
例えば、Chat APIに「必要」の類義語を問合せると、「必須」、「不可欠」などが回答されることを期待しています。

## UIイメージ

類義語を検索したい単語の入力フィールドと検索ボタンを実装します。

<img width="480" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/73490/6ca9c7b6-ded3-7a40-ce42-a66a5855b975.png"/>

検索ボタン押下で、入力単語をAPIサーバ（後述）へ送信します。Chat APIの回答は、そのままTextViewで表示します。

## 構成図

アプリとOpenAI Chat APIの間に自前のAPIサーバを用意します。APIサーバではプロンプトのテンプレートが定義されており、アプリから送信されてきた単語を埋め込んでChat APIにリクエストします。

<img width="480" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/73490/028e1148-c834-34e9-ab35-97bec54e45b6.png"/>

# プロンプトの作成
## プロンプト 第1案

まず最初に試したプロンプトは以下です。

```
Suggest some synonyms for the following word: ${INPUT_WORD}
```

`${INPUT_WORD}` は入力単語に置換されます。

### Example

**Prompt**

```
Suggest some synonyms for the following word: 必要
```

**Chat APIの回答**

```
必要 (bì yào) is a Chinese word that means "necessary" or "essential". Here are some synonyms in English:

Indispensable
Crucial
Required
Vital
Imperative
Fundamental
Needed
Requisite
Compulsory
Mandatory
```

結果は、中国語と誤認されてしまいました。また、回答は英単語で返ってきました。これはプロンプトが英語で書かれているため、英語で返答されたと考えられます。

## プロンプト 第2案

第1案がうまく機能しなかったため、第2案では入力単語と同じ言語で回答するよう指示を追加します。

```
Suggest some synonyms for the following word. Please answer in the same language as the following word: ${INPUT_WORD}
```

### Example 1

**Prompt**

```
Suggest some synonyms for the following word. Please answer in the same language as the following word: 必要
```

**Chat APIの回答**

```
Sure, here are some synonyms for the word "必要" in Japanese:

必需品 (hitsujin-hin)
不可欠 (fukaketsu)
必須 (hisshu)
必要不可欠 (hitsuyou-fukaketsu)
必要条件 (hitsuyou-jouken)
必要性 (hitsuyou-sei)
要するに (yousuru-ni)
必然的 (hitsuzenteki)
不可避 (fukahi)
必修科目 (hisshuu-kamoku)
I hope this helps!
```

結果は、英語混じりの日本語で回答されました。

### Example 2

**Prompt**

```
Suggest some synonyms for the following word. Please answer in the same language as the following word: 原因
```

**Chat APIの回答**

```
以下是「原因」的一些同义词：

缘由 (yuányóu)
理由 (lǐyóu)
因由 (yīnyóu)
起因 (qǐyīn)
根源 (gēnyuán)
起源 (qǐyuán)
由头 (yóutóu)
起因于 (qǐyīnyú)
```

Example 1と同じプロンプトですが、中国語と誤認されてしまいました。
何個か試しましたが、日本語の単語は、中国語と誤認されることがままありました。

## プロンプト 第3案

第2案のように、Chat APIに単語から言語を推測させるのは難しいことが分かったため、第3案では回答言語を明示的に指定するようにプロンプトを改良します。

```
Suggest some synonyms for the following word. Please answer in ${LANGUAGE}: ${INPUT_WORD}
```

`${LANGUAGE}` は `Japanese` などの指定言語に置換されます。

### UIの修正

言語の指定が必要になったため、UIを修正します。新たに追加したUIは、ユーザに言語をプルダウンで選択してもらいます。日本語、英語など...

<img width="480" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/73490/dd935e07-52cb-ee15-33b7-cd20662a6813.png"/>

検索ボタン押下で、入力単語と言語（実際は `ja`, `en` などの言語コード）をAPIサーバへ送信します。

### Example 1

**Prompt**

```
Suggest some synonyms for the following word. Please answer in Japanese: 原因
```

**Chat APIの回答**

```
原因の同義語をいくつか紹介します。

起因 (きいん)
起因物 (きいんぶつ)
誘因 (ゆういん)
理由 (りゆう)
原点 (げんてん)
根拠 (こんきょ)
証拠 (しょうこ)
理由付け (りゆうづけ)
起訴理由 (きそりゆう)
理由書 (りゆうしょ)
```

明示的に言語を指定することで、やっと望みの形式で回答が得られました。

### Example 2

**Prompt**

```
Suggest some synonyms for the following word. Please answer in 日本語: 原因
```

**Chat APIの回答**

```
原因の類義語をいくつか紹介します。

理由 (りゆう)
要因 (よういん)
由縁 (ゆえん)
背景 (はいけい)
起因 (きいん)
根拠 (こんきょ)
経緯 (けいい)
訳 (わけ)
手掛かり (てがかり)
仕掛け (しかけ)
```

「in 日本語」でも同様に回答してくれました。日本語混じりの英文でもいけるようです。

### Example 3

한국어（韓国語）を指定した場合。

**Prompt**

```
Suggest some synonyms for the following word. Please answer in 한국어: 原因
```

**Chat APIの回答**

```
원인에 대한 유의어 몇 가지를 제시하겠습니다.

이유
원점
근본
원초적인 이유
발단
계기
인과
원인과 결과
원인과 영향
원인과 연관성
```

他言語を指定した場合、その言語に変換されて回答が返ってきました。
これはこれでおもしろい。

### Example 4

**Prompt**

```
Suggest some synonyms for the following word. Please answer in Japanese:  Cause
```

**Chat APIの回答**

```
原因 (げんいん) の類義語をいくつか挙げます。

起因 (きいん)
理由 (りゆう)
誘因 (ゆういん)
きっかけ
要因 (よういん)
原因となるもの (げんいんとなるもの)
原動力 (げんどうりょく)
根拠 (こんきょ)
```

当然、Enlish to 日本語もできます。
奇しくも、類義語検索 + 他言語変換という機能ができました。

# まとめ

ユーザの入力負担を軽減したいため、単語のみを入力するUIにしたかったのですが、プロンプトの調整との兼ね合いで、回答言語も選択してもらうUIに着地しました。
（回答言語は、端末のロケールに設定されている言語をデフォルトにすることで、入力負担を軽減できそうですが...）

それにしても自然言語を入力にできるChat APIは、やはりすごいですね。