chatGPTに作らせた大画面でできるブラウザAIM練習ゲーム

今時AIM練習するツールなんていくらでもあるんだけど、

・ブラウザで動く(OWのマッチングの合間とかにぱぱっとやりたい)

・割と大画面でやりたい(既存のものはゲーム画面サイズが固定で小さいのが多い)

・広告とかうざい(維持費かかるから仕方ないけど)

なければ作ればいいんだよ!精神で作ってみた

打つやつ

↑で公開中

スポンサーリンク

作成備忘録

ルールは15秒で何回ターゲットをクリックできるかってだけ

隙間時間にぱぱっとやりたいだけなので余計なカウントダウンとかアニメーションはなし

タイムカウントとスコアだけ表示されて淡々とクリックに没頭できるようにした

こだわりポイントはブラウザのサイズを自由に変更できるところ

画面サイズが変更できるのは意外と他に存在しなくてだいたいどこも画面サイズが固定で小さい範囲でしかターゲットが出ない

モニターとか関係なく自分の好きなサイズでプレイできるようにした

あとついでにスマホも同様に画面の範囲内でターゲットが出るようになってる(何気に縦横どっちもいける)

技術的なメモ

コード生成:chatGPT-4(無料版)

言語:html、css、javascript

アプリ公開:github pages

作成時間:全体2時間弱(ゲーム部分1時間、素材探し10分、githubへのアップロード30分)

最終的には1文字もコードに手を触れることなくGPTへの指示だけで公開しているレベルまで持っていけた

指示のコツはやりたいことを如何に言語化できるかであって、

ある程度ふわっとした内容でもGPTに渡すといい感じで返ってくるのでそれこそ会話しながらやりたいことを詰めていく感じ

(設計段階での思考能力はたぶん有料版使うともっと効率的なんだろうなと思う)

あとは長いコードになってくると今まで実装していたものを省いたりするのでちゃんと指摘すること

GPTに書かせたものをアップロードして○○足して、って指示の仕方も悪くない

雑記