ChatGPTを使ってアプリを開発してみる4 - 機能改善編

# はじめに
ChatGPTについて学んでおいたほうがいいよねってことで、ChatGPTを使ってアプリを開発していこうという企画の四つ目の記事です。
今回は、[前回実装した迷路の機能](https://qiita.com/MLLB/items/4fcec676d5a646aa66e1)を改善していこうと思います。

# アプリ作成手順一覧
目指すのは、ChatGPTなどを使ったアプリの高速開発をすることなので、やり方を確立させるべく現状考えている手順を書いていきます。
今回の記事は実装部分を書いていきます。
* アプリの方向性決定
* 要件定義
* 設計
* 実装 ⇦今回の記事
* 単体テスト
* 結合テスト
* システムテスト
* リリース

# アプリ実装に必要なもの
前回の記事にも書きましたが、アプリの実装に必要なもの一覧です。
今回は「各機能の実装」から書いていきます。

```
開発環境のセットアップ

Flutterのインストールと設定
開発用エディタ（例：Visual Studio Code）のインストールと設定
エミュレータや実機でのデバッグ環境の構築
アプリの基本構造の作成

アプリの全体構造を定義するためのコードを作成
各画面の遷移を実装
デザインテーマや共通スタイルの設定
ローカルデータベースの設定

SQLiteを利用したデータベースの構築
ユーザープロファイル、プログレスデータ
データに関するテーブルとスキーマを作成

各機能の実装　⇦ ここから実装していく
画面の作成

テストとデバッグ
各機能のユニットテストを作成
エミュレータや実機でのデバッグとテストを実施
```

# 実装の改善
前回、迷路機能を実装しましたが、スタートとゴールがあり、指でなぞると現在位置に合わせて、青いまるが移動するというもので、迷路ゲームとして全く面白みもユーザビリティも良くない機能が仕上がりました。

![sg.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2475427/269e2d8c-b4cb-4abb-59f5-94bdb7eac815.gif)

これをゲームっぽくしていこうと思います。

## 機能の改善

早速、迷路として面白くするために質問してみました。
```プロンプト.txt
この迷路を面白くするにはどんな機能を追加すればいいでしょうか？
```

```ChatGPT.txt
迷路アプリをより面白くするために、いくつかの機能や要素を追加できます。
以下はその例です。

タイマー: タイマーを設定して、プレイヤーが迷路をどれだけ早く解けるかを競わせましょう。
最速タイムを記録して、自己ベストや他のプレイヤーと比較できるようにすると、
達成感や競争意識が高まります。

複数の難易度: 迷路の難易度をいくつか用意して、プレイヤーが挑戦できるように
しましょう。難易度が上がるごとに、迷路のサイズや複雑さが増えることで、
長期的な遊びの楽しさが維持できます。

アバターやアイテム: プレイヤーが独自のアバターやアイテムを選べるようにして、
ゲーム内で獲得できる報酬やカスタマイズ要素を提供しましょう。

ミッションやクエスト: 一定の条件をクリアすると報酬が得られるミッションや
クエストを設定しましょう。例えば、一定時間以内に迷路をクリアする、
特定のアイテムを集める、連続で複数の迷路を解くなどの条件が考えられます。

ランダム生成迷路: 毎回新しい迷路が生成される機能を追加して、
遊びのバリエーションを増やしましょう。これにより、
プレイヤーは同じ迷路に飽きずに、繰り返し遊べるようになります。

マルチプレイ: オンラインで他のプレイヤーと一緒に遊べる機能を追加しましょう。
協力して迷路を解いたり、対戦して誰が先にゴールにたどり着くか競ったりすることで、
ソーシャル要素が強化されます。

これらの機能や要素を追加することで、迷路アプリがより楽しく、魅力的になるでしょう。プレイヤーの興味を引き続けるためにも、定期的に新しいコンテンツや機能を追加していくことが重要です
```

いい提案をしてくれましたが、迷路をプレイする機能外の追加機能だと思ったので、
以下のような形でアイデアを出してもらいました。

```プロンプト.txt
ありがとうございます。
上記の機能は後で取捨選択し実装していこうと思います。
一旦、迷路ゲームをプレイする上で、フィードバックをユーザーに与えたいと思ってます。
例えば、スタート時にメッセージを出す、ゴール時にメッセージを出すなどです。
こういったフィードバックを考えてください。
```

```ChatGPT.txt
迷路ゲームをプレイする上で、ユーザーに適切なフィードバックを与えることが重要です。
以下は、ユーザーにフィードバックを与えるいくつかの方法です。

スタート時のメッセージ: 
ゲームが始まる際に、スタート地点に関する簡単な説明や目標を示すメッセージを
表示しましょう。これにより、プレイヤーは何をすべきかがわかりやすくなります。

ゴール時のメッセージ: 
ゴールに到達した際に、成功を祝うメッセージや、クリアタイムを表示しましょう。
また、次のステージへの誘導や、自己ベストを更新した場合の特別なメッセージも
用意しておくと、達成感が高まります。

プレイ中の効果音: 
プレイヤーが操作を行った際に、効果音を鳴らすことで、アクションに対する
フィードバックを与えましょう。例えば、移動時に足音が鳴る、
壁にぶつかった際には衝突音が鳴るなどです。

進行状況の表示: 
プレイ中に、現在のステージやクリアタイム、所持アイテムなどの情報を
画面上に表示しましょう。これにより、プレイヤーは自分の進行状況を
把握しやすくなります。

ヒントや助言: 
迷路が難しい場合や、プレイヤーが一定時間以上進めない場合に、
ヒントや助言を表示することができます。これにより、プレイヤーが迷路の解決に向けて
進む助けとなります。

アニメーション: 
プレイヤーのアバターやゲーム内のオブジェクトにアニメーションを追加することで、
操作に対する視覚的なフィードバックを与えましょう。例えば、移動時にアバターが歩く
アニメーションを表示するなどです。

これらのフィードバックを追加することで、ユーザーはゲームプレイに没頭しやすくなり、
遊びの楽しさが向上します。必要に応じて、他の効果音や視覚エフェクトを追加して、
ゲーム体験をより一層向上させることも検討してください。

以下は、追加できるフィードバックや要素の例です。

パワーアップや特別なアビリティ: 
ゲーム内でパワーアップや特別なアビリティを獲得することができるようにし、
それらを使用する際に視覚的なエフェクトや効果音を追加しましょう。
これにより、プレイヤーは自分の操作に対する報酬を感じることができます。

障害物や敵キャラクター: 
迷路内に障害物や敵キャラクターを配置し、それらとのインタラクションに対する
フィードバックを提供しましょう。例えば、敵キャラクターに接触した際には、
衝突音が鳴るか、アバターがダメージを受けるアニメーションが表示されるなどです。

スコアボードやリーダーボード: 
ゲーム内でスコアを表示し、自分の成績や他のプレイヤーとの比較ができるように
しましょう。これにより、競争意識が高まり、プレイヤーはさらなる向上を
目指すことができます。

実績やトロフィー: 
ゲーム内で特定の目標を達成することで、実績やトロフィーが解除されるシステムを
導入しましょう。これにより、プレイヤーは自分の成果を認識しやすくなり、
ゲームの遊びごたえが増します。

これらの追加要素を実装することで、迷路ゲームはさらに魅力的で楽しいものになります。
プレイヤーがゲームにどのように反応するかを観察し、適切なフィードバックや
新しい要素を随時追加していくことで、ゲームの品質を継続的に向上させることができます。
```

まとめると下記となります。
- スタート時のメッセージ
- ゴール時のメッセージ
- プレイ中の効果音（移動時に足音が鳴る、壁にぶつかった際には衝突音など）
- 進行状況の表示（現在のステージやクリアタイムなど）
- ヒントや助言
- アニメーション（移動時にアバターが歩くなど）
- パワーアップや特別なアビリティ
- 障害物や敵キャラクター
- スコアボードやリーダーボード
- 実績やトロフィー

実装できたらかなり面白そうなアプリになりますね。
ただ、今回子供向けなので、アビリティや敵キャラクターとかはなしで、シンプルに実装していきたいと思います。
具体的には下記を実装します。
- スタート時のメッセージ
- ゴール時のメッセージ
- プレイ中の効果音（移動時に足音が鳴る、壁にぶつかった際には衝突音など）
- 進行状況の表示（現在のステージやクリアタイムなど）
- スコアボード（**迷路とは別機能になるので違う記事で実装予定**）
- 実績やトロフィー（**迷路とは別機能になるので違う記事で実装予定**）

順番にサンプルコードを出してもらい、それをコピー・一部修正しつつ、実装していきます。

### スタート時のメッセージ
```プロンプト.txt
スタート時のメッセージのサンプルコードを出してくれますか？
```
出てきたコードを動かしたもの
![maze.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2475427/e5dfae4b-41db-5fe9-7439-49ce50d39893.gif)

### ゴール時のメッセージ
続いて、ゴール時のメッセージを表示したいのでサンプルコードを書いてもらいました。

```プロンプト.txt
ゴール時のメッセージのサンプルコードを出してくれますか？
```

出てきたコードを追加したもの
（ゴール判定のロジックは書いてくれなかったので自前で実装しました）

![goal.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2475427/2c666b11-7c98-40c9-7c14-f87f6e4a8d21.gif)

### プレイ中の効果音
```プロンプト.txt
プレイ中の効果音（移動時に足音が鳴る、壁にぶつかった際には衝突音など）のサンプルコードを出してくれますか？
```
```ChatGPT.txt
効果音を扱うにはaudioplayersパッケージを使うと便利です。
このパッケージは効果音やバックグラウンドミュージックなどのオーディオの再生を支援します。
・・・以下省略
```

パッケージの導入方法や、利用するサンプルコードを書いてくれました。
せっかくなので、効果音自体をどこで取得すればいいか聞いてみました。
```
フリーで効果音を取得できるサイトを教えてください
```
```
フリーの効果音を提供しているウェブサイトはいくつかあります。以下にいくつかの例を挙げてみます。

フリー効果音素材 くらげ工匠
くらげ工匠は、個人でも商用でも無料で利用できる効果音素材を提供しています。
ただし、二次配布は禁止されています。

効果音ラボ
効果音ラボも、個人・商用問わず無料で利用でき、クレジット表記も不要です。
ただし、素材自体の再配布や販売は禁止されています。

ポケットサウンド
ポケットサウンドは、様々なカテゴリの音を提供しており、商用利用も可能です。
ただし、二次配布や販売は禁止されています。

魔王魂
魔王魂は、主にゲームで使用できるBGMや効果音を提供しています。
個人・商用問わず利用可能で、ゲームのみならず映像作品などにも利用できます。
以上のサイトを活用する際には、各サイトの利用規約をよく読んでから音源をダウンロードしてください。
```

### 進行状況の表示（現在のステージやクリアタイムなど）
時間を表示するUIとタイマー処理は出してくれたコードで問題なかったんですが、タイマーの制御はなかなか思った通りになりませんでした。
なので、自前で実装します。

# おわりに
実際の機能を実装してもらうには結構大変ですね。
バグも多かったり、修正を依頼すると断片的なコードを出してきたり、全部のコードを出してもらうこともできますが時間がかかります。