1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

ChatGPTを使用してWeb埋め込みのゲーム(ブロック崩し)を作ろうとした話

Last updated at Posted at 2024-10-10

初めに

ポートフォリオサイトを作成したものの、制作物がまだなく寂しい状態でした。
そこで、ChatGPTを使用して一度制作物を仕上げ、その過程やレビューを行うことにしました。
これを通じて、自分のスキルを向上させるとともに、ポートフォリオサイトにコンテンツを追加していきたいと考えています。

目的

プログラミングの知識がほとんどない状態から、ゼロからの制作や模倣サイト・アプリの作成、YouTubeを参考にした制作方法も考えました。
しかし、具体的に作りたいアイデアがあったため、それを形にした後にその過程を紐解いていく方法を選ぶことにしました。

作成したものについては探せばありふれたものかもしれません。その点についてはご了承ください。

作ってみた感想

CodeCopilotが良いという情報を見つけたため、そちらを使用しました。
また、無課金プランでは機能に制限があることが分かったため、今後も使用することを考慮し、ChatGPTに課金することにしました。

制作物

ポートフォリオサイトの下記ページに作成しました。

デスクトップでゲームを作成し、投稿サイトにアップロードした後、そのリンクを貼る形でも良かったのですが、ポートフォリオサイトとしてStudioを使用していました。
そのため、ファイルを1つにまとめたいという意思をGPTに伝えたところ、HTML内で完結する形にできました。その結果、そのままこちらに載せることにしました。
このやり方が正しいかはわかりませんが・・・

難しかったところと今後の勉強に生かしたいところ

  • 画面サイズの設定
    大/中/小の画面でプレイできるようにしたかったが、HOMEに戻るボタンが押せなくなったため、画面を1つにまとめた。
    →コードが読めるようになれば何が原因でどう修正すればいいか分かる様になるはず。
  • リトライボタンの問題
    リトライボタンが押せず、画面が進まない状態になった。
    →上と同じ
  • 玉の速度リセットの不具合
    操作板に玉が当たるごとに加速する条件を設定したが、リトライ時に玉の速度がリセットされない問題が発生した。
    →上)(ry
  • 難易度緩和の情報リセット
    クリア後に難易度緩和(操作板の幅)の情報がリセットされない問題があった。
    →(

終わりに

出力されたコードが何を示しているのか分からないと、結局は一切理解できていないということに気づきました。
当たり前ですね。完全にブラックボックスで作業している状態でした。

ただ、このブロック崩しゲームを0から手書きで模索しながら作成していたとしたら、1か月、いやもっと時間がかかっていたと思います。

手打ちでの作成が経験的には良さそうなので、やはりGPTに生成したもらったコードのコピペではなく、自分でコードを見て理解した上で作業を進めていこうと考えています。

また、SNSでは自分は見る専でしたが、自身の振り返りにもなるため、発信することの重要性を身に染みて感じています。

この経験を通じて、まずはステップバイステップで進むこと、そしてとりあえず1歩踏み出すことが大事だと改めて痛感しました。
できないことを恥じない姿勢を持つことで、わからなくてもチャレンジする勇気が生まれ、新たな学びや成長につながると実感しています。これからも、自分の限界を広げるために積極的に挑戦していきたいと思います。

いずれはUnityを用いて作品を作成し、アップロードしたサイトのリンクを載せられればと思っています。
また、この経験が誰かの後押しになればいいなとも思っています。

現状として

結局今のところは作られたものの中身なんもわからん。
1日でサクッと作れるこの時代に感謝。

今回のと関係ありませんが、記事を書いていればマークダウンも徐々に覚えきますね。必要なものだけですがw
ちなみに、文章力に自信がないため、この記事を含めてずっとAIに添削してもらっています。
それでも変な文章になっていたら、ご了承ください。

参考

今回はChatGPTに全て投げて作成したため参考にしたものはございません。

1
0
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?