ChatGPTを頼りにアプリを作ってみる

唐突ですが、筆者は2023年3月現在、SwiftとSwiftUIについて学習中の身です。

JavaScriptに関しては中級レベル以上の自覚がありますが、Swiftに関してはまだまだ初級レベルであり、学習レベルが一定以上に達したらSwiftでコードを書いてアプリを作ってみたいと考えていたところでした。

そこで今回、『ChatGPT(GPT-4)の力を借りたら、Swift初心者でもアプリを作れるか？』というテーマで実験してみることにしました。

※以下、特に記述がなくてもChatGPTのバージョンは全てGPT-4とします。

今回作ってみた（作ってもらった）アプリ

今回は、【Play】ボタンをタップするとルーレットが始まり、ランダムな位置で停止する…というアプリを考えてみました。

ちなみにですが、外食時の注文メニューを決めきれない時とか、旅行の行き先で迷った時とか、そういう場面で使ってもらうことを想定しています。

ルーレットアプリの概要をメモにまとめて、ChatGPTに次のように投げかけてみました。

以下の要件を満たすアプリをSwift UIで作りたいです。

1：「Play」ボタンをタップすると、ランダムで特定の場所を指し示すルーレットが始まる
2：ルーレットの項目はユーザーが任意に追加・削除できる
3：ただし、ルーレットの項目は最大で１０まで
4：ゲーム性（ルーレットがどこで止まるかワクワクする感じ）も出したい

すると、すぐに下のような回答を得ることができました。

SwiftUIを使って、要件に合ったルーレットアプリを作成するには以下の手順があります。

まず、プロジェクトを作成し、必要なファイルを追加します。

Xcodeで新しいSwiftUIプロジェクトを作成してください。
RouletteWheelView.swift、RouletteItem.swift、RouletteViewModel.swiftという3つの新しいSwiftファイルを作成します。
次に、それぞれのファイルで以下のコードを実装します。
・・・
（※コード掲載は省略）

ただし、現時点ではユーザーが任意に項目を追加・削除する機能は実装されていません。次の手順でその機能を追加しましょう。

RouletteEditorView.swift ファイルを作成し、以下のコードを追加します。
・・・
（※コード掲載は省略）

早速、ファイルを作成してChatGPTが生成してくれたコードをコピーして貼り付けてみたところ、なんと本当に一瞬でシンプルなルーレットアプリができてしまいました！

ですが、さすがに一発で大成功！…というわけにはいかず。

ルーレットは機能するし、項目の追加はできるのですが、『項目を削除する』という要件が満たされていないようでした。

Swiftに詳しければ自分で修正した方が早そうですが、筆者はまだその域に達していないので、引き続きChatGPTに頼ることにします。

ということで、次のように投げかけてみました。

項目を削除する機能が有効になっていないようです。修正をお願いします！

すると、下のようにすぐに修正のコードを返答してくれました。

失礼しました。RouletteEditorView.swiftのListビューに.onDeleteを適切に適用するために、ForEachビューをListビューのcontent引数から外してください。以下のように修正します。
・・・
（※コード掲載は省略）

…なのですが、ChatGPTが教えてくれた修正コードに差し替えても、画面上に特に変化なしでした。

エラーが起こっているわけではなかったので、指示の出し方が悪かったのかもしれません。

というわけで、次のように、修正の指示をもう少し具体的に出すことにしてみました。

これでは項目を削除する方法が分かりません。項目を分かりやすく削除できるよう、項目一つ一つに「削除する」ボタンを追加したいです。

それでは、各項目に「削除する」ボタンを追加しましょう。RouletteEditorView.swiftのForEachビュー内で、Text(item)の代わりにHStackを使用して項目名と削除ボタンを表示します。以下のように修正してください。
・・・
（※コード掲載は省略）

これまでと同じようにChatGPTが修正してくれたコードをコピペしていくと、今度はイメージ通り、項目の隣に削除ボタンが実装されて、項目を削除できるようになりました。

これで、当初の要件を満たすアプリの完成です。

とりあえず、『コードの内容がほとんど分からなくても、シンプルなアプリを作ることは間違いなく可能である』ということは、実際に証明できた（できてしまった）かと思います。

一発で要件を満たすものが出来上がったわけではありませんが、最初から100%の出来を求めるのはさすがに無理があると言えるでしょう。

むしろ、たった数回程度のやり取りで当初の要件をきっちり満たすアプリを作れたという事実にしっかり目を向けて、ChatGPT（AI）の能力の高さを認めるべきだと思います。

ただし、この物語にはまだ続きがあります。

次の章では、ChatGPTの弱点・問題点について触れていきます。

POINT!
1. ・ChatGPTが生成するコードをコピペするだけで、本当にアプリが作れた！
2. ・一発で完璧なものができたわけではないが、AIに伝わりやすい指示を与えることで要件を満たせた！
3. ・数回程度のやり取りで素人でもアプリが作れてしまうスゴさは、素直に認めよう！

臨機応変な修正・機能の追加には弱い？

その後、出来上がったルーレットアプリをさらに改良したいと思い、次のようなアイデアをChatGPTに投げかけてみました。

ルーレットが項目の上で停止した際、停止した項目が分かりやすいよう、何か工夫が欲しいです。

例えば、
「結果は…『項目名』でした！」
といったメッセージを表示させるなどはどうでしょうか？

すると、下のようにChatGPTがコードを生成してくれたので、早速コピペしてみたのですが…

そのアイデアは素晴らしいですね！停止した項目を分かりやすく表示するために、RouletteViewModel.swiftに選択された項目を追跡するための新しいプロパティselectedItemを追加し、spinWheel()メソッドで選択された項目を更新するようにしましょう。また、RouletteWheelView.swiftに結果を表示するためのテキストビューを追加します。
・・・
（※コード掲載は省略）

ここで、ついに大きなエラーが発生してしまいました。

この記事はSwiftに関する解説記事ではないので、コードの部分はバッサリ省略していますが、RouletteViewが定義されていないことによりエラーが起きている様子です。

これまでにChatGPTからRouletteView.swiftを作成せよとの指示はなく、いきなりRouletteView( )が出てきたので、さすがにSwift初心者の筆者でもエラーになるであろうことは予想できました。

引き続き、エラーが起きてしまったことをChatGPTに報告して、AIになんとかしてもらうことにします。

コードを貼り付けたのですが、
Cannot find 'RouletteView' in scope
というエラーが起こっています。どうしたら良いでしょうか？

失礼しました。「RouletteView」というビューは前の回答で言及されていませんでした。RouletteView.swiftを新たに作成して、以下のコードを追加してください。
・・・
（※コード掲載は省略）

『よしよし、ChatGPTにちゃんと伝わったみたいだし、今度こそ大丈夫だろう。』…と思ったのも束の間。

ChatGPTの指示通りにファイルを作成してコードを貼り付けても、今度はまた別のエラーが発生してしまいました。

しかも、厄介なことに複数のファイルにまたがって複数のエラーが発生してしまっており、状況はむしろ悪化しています。

これまでChatGPTの指示通りにファイルを作成し、コードを貼り付けてきたつもりですが、どこかでコードを貼り付ける場所を間違えてしまったのかもしれません。

そこで、一旦これまでの状況を整理してすべてのファイルのコードを改めて出力してもらい、再度コードを貼り付け直した方が良さそうだと判断。

ということで、次のような指示をChatGPTに与えてみました。

該当のエラーは無くなったのですが、代わりに各ファイルにエラーが増えてしまいました…💦

一度、これまでの情報を整理し直して、新しく各ファイルのコードを提示してもらえますか？

すると、下のように返答してくれたのですが、これまでの過程で作成するように指示されたファイル（RouletteEditorView.swift）が返答から抜けてしまっています。

申し訳ありません。お手数をおかけしてしまいました。ここで、これまでのコードを整理し、各ファイルごとにコードを提示します。

RouletteViewModel.swift - ビューモデル:
・・・

RouletteView.swift - ルーレットの表示:
・・・

RouletteWheelView.swift - ルーレットホイールとコントロール:
・・・
（※コード掲載は省略）

なので、抜け落ちたファイルのことを指摘します。

RouletteEditorViewがなくなっていますが

すると、謝罪とともに抜け落ちたファイルのコードも提示してくれました。

すみません、RouletteEditorViewの言及を見落としていました。RouletteEditorViewは、項目の追加・削除を行うためのビューです。以下に、RouletteEditorView.swiftのコードを追加します。

RouletteEditorView.swift - 項目の追加・削除のビュー:
・・・
（※コード掲載は省略）

ChatGPTは、チャットのやり取りが増えていくと前のことを忘れがちになる…という情報は聞いていましたが、こういう感じなんですね。本当、人間みたいです。笑

何はともあれ、これでごちゃごちゃになってきた状況を整理できるはず。そう思って、再びコードをコピーして貼り付けてテストしてみました。

が、やっぱりエラーは解決できずでした。

この時点でなんだか面倒くさくなってきてしまい（笑）、ChatGPTにアプリを作ってもらう実験はここで終了となりました。

エラーメッセージを的確に読み解き、ChatGPTに適切な解決法を求め続ければ解決に至るかもしれませんが、そのためには、結局のところSwiftとSwiftUIのことをちゃんと知っておかなければ難しいでしょう。

今回の実験を通して、『プログラムコードが分からなくてもChatGPTでアプリを作ることは可能だが、臨機応変な修正・機能の追加が重なると、初心者では対応できなくなってくる可能性が高い』ということが言えるのではないかと感じました。

もちろん、今回の実験においてはChatGPTの能力が足りないのではなく、筆者の指示の出し方が悪かった部分もあったと思います。

しかし、ある程度プログラミングの仕組みや基本を理解している筆者でも、AIに的確に指示を与えることは簡単ではなかったのですから、プログラミングのことがほとんどわからない方にとってはなおさらではないでしょうか。

よって、『誰でもChatGPTで簡単にアプリが作れる時代が来た』というのは、2023年3月時点において言えば時期尚早かと思います。

また、今回はシンプルなルーレットアプリなので良いところまでいけましたが、これがもっと複雑なものになると、ChatGPTが生成するコードだけではどうしても無理が出てきそうです。

とは言え、ChatGPTの成長はGPT-4が限界というわけではなく、今後さらに急速に発展していくことでしょう。

それに伴い、これまでのように人間が一からすべてコードを書く必要がなくなることも間違いなさそうです。

次の章では、AI活用時代におけるプログラミングスキルの必要性について考えてみたいと思います。

POINT!
1. ・ChatGPTはコードの修正やエラーの対応もしてくれるが、バシッと解決できないこともある！
2. ・修正や機能の追加が重なるとエラーが起こる確率も高くなり、コードがごちゃごちゃになってしまうことも！
3. ・2023年３月時点において言えば、ChatGPTで誰でも簡単にアプリが作れるとは言い難い！

AI活用時代のプログラミングスキル

これまでお伝えしてきたように、ChatGPTには弱点（発展途上なところ）もあるものの、シンプルなアプリのコードを一瞬で生成できてしまうなど、極めて高い能力を持っています。

正直、筆者はコーディング作業自体が好きなので、この作業をAIに取って代わられたくはないという思いがあるのですが、エンジニアとしてはプログラミングにAIを活用しない手はないと言えるでしょう。

これからの時代は、基本的なコードを書くのはAIに任せるようになり、エンジニアはそのコードを元に改良を加えたり、AIが生成したコードにバグや抜けがないかチェックしたり…といった役割が主になっていくのではないかと、筆者は予想します。

そうなると、素早くコーディングできるとか、キレイなコードが書ける…といったスキルはあまり必要ではなくなるでしょう。

コーディングの早さで人間が機械（AI）に勝つことはできませんし、汚い（読みづらい）コードしか書けなくても、後でAIに修正してもらえば良いだけの話ですからね。

一方、AIが生成したコードを正確にチェックするには、プログラミングに対する基本的な知識や理解（配列やプロパティ、メソッド、引数、戻り値など）が欠かせません。

メソッドなどを覚えたりする必要はない（それもAIに聞けばいい）ですが、AIの回答を読んで理解するためにも、プログラミングの基礎知識はこれからも必要とされると思います。

また、AIが出力したコードの一部をちょこっと修正する程度であれば、人間がやった方が早いという場面は今後いくらでも起こり得ると思います。

なので、コーディングのスキルが全く必要なくなるとも考えづらく、ある程度のコーディングスキルは保っておいた方が良いということも言えるのではないでしょうか。

また、AIに伝わりやすい適切な指示を出せるスキル（文章構成力、論理的思考力）が必要となるのは、もはや言うまでもないでしょう。

大切なのは、時代に合わせて磨き上げるスキルを柔軟に選択することだと思います。

とは言え、筆者としては何かを学ぶということ自体に価値があるとも思うので、あまり将来のことを悪いように考えすぎず、まずは学ぶことを楽しむようにするのも良いかもしれませんね！

POINT!
1. ・素早くコーディングできたり、キレイなコードが書けたりするというだけでは、今後厳しくなるかも？！
2. ・AIが生成したコードを理解してチェックするためにも、プログラミングの基本的な知識はこれからも必要そう！
3. ・あまり将来のことを考えすぎず、とりあえず何かを学ぶこと自体を楽しむのも全然あり！

まとめ

今回の記事の内容を簡単にまとめました。

ChatGPTの実力と弱点

• ・プログラミングのコードが分からなくても、ChatGPTだけでシンプルなアプリを作れてしまうのは本当
• ・ただし、現時点では臨機応変な修正や機能の追加に弱く、エラーを起こしてしまうこともある
• ・エラーの解決をChatGPTに依頼しても解決に至らないこともあり、初心者でも気軽にアプリを作れるようになったとまでは言い難い

これからの時代におけるプログラミングスキル

• ・今後、エンジニアがコードを書く機会は減っていくと思われる
• ・よって、素早くコードを書けるといったスキルは必要なくなるかもしれない
• ・ただし、AIが生成したコードを理解するためにも、プログラミングの基礎知識はこれからも必要

以上は筆者の個人的な主観・予想に基づくところも大きいので、あくまで参考にとどめて頂ければと思います。

ただ、AI技術の活用は世界的に急速に広がっており、この流れは止まらないことは確信を持って言えます。

まだChatGPTのようなAI技術を試したことがない方は、この波に乗り遅れないように、少しずつでも日々の生活にAI技術を取り入れてみてはどうでしょうか？

AIを敵視したり過度に恐れたりするのではなく、AIを味方につけてより高度なことにチャレンジしてみるように心がけてみると、見えてくる景色が変わるかもしれません。