​【AI開発】初心者がGeminiでバスケのスコアブックを作った結果

​📝 1. なぜ「バスケのスコアブックアプリ」を作ろうと思ったのか？

先日、会社のバスケサークルで経験者を集めた大会を開催しました。その際、紙の簡易的なスコアブックを用意したのですが、記録に慣れていないメンバーも多く、以下のような問題が発生してしまったのです 😅​

「これなら、誰でもスマホでポチポチ押すだけで、簡単に個人得点やファールを管理できるツールがあれば解決できるのでは？」​そう思い、プログラミング初心者の私がAIの力を借りてアプリ作りに挑戦することにしました！ 🚀

🤖2. Geminiに出したプロンプト（指示文）

​今回は、GoogleのAIであるGeminiを使い、ブラウザで動くWebアプリを作成してもらいました。実際に使用した指示文（プロンプト）はこちらです 💻

あなたは優秀なWeb開発者です 💻HTML/CSS/JavaScriptを1つのファイルにまとめた「バスケットボールの簡易スコアブックWebアプリ」を作成してください 

🏀【目的】
紙のスコアブックでの記録漏れを防ぐため、誰でも直感的に操作できる簡易スコア管理ツールを作りたいです。

【実装したい機能】
1. 👥 チーム・選手登録: チーム名、選手名、背番号の登　　録（スタメンと控えを区別できる機能）
2. ⏱️ ピリオド管理: ピリオド（1Q〜4Qなど）ごとの切り替え機能
3. 🏀 得点記録: 1点・2点・3点ボタンによる個人＆チーム得点の自動集計
4. ⚠️ ファール記録: 個人ファールおよびチームファールのカウントアップ機能
5. ⏳ 出場時間管理: 選手の出場時間が分かる機能
6. 📊 最終結果の出力: 最終スコアや個人成績をわかりや
すく表示し、保存・出力できる機能

【デザイン要件】
スマホの画面でも操作しやすいよう、ボタンは大きく直感的な配置にしてください 📱

📊 3. 作成結果と分かったこと

実際に動かしてみて分かった「AIの凄さ」と「注意すべきポイント」をまとめました💡

⭕ 良かった点

・簡単なプロンプトで 直感的な操作画面が一 発で完成🖌️

・指示していない「減 算(-) ボタン」も気 を利かせて実装

・データ保存機能を頼 むと「削除ボタン」も 自動で追加してくれた🗑️

🛠️ 修正・追加した点

・反応しなかった「ピリオド切り替え」「試合終了」ボタンの修正 🔧

・選手登録機能と、データをブラウザに記憶（保存）する機能を追加 💾

💭 プロンプトの反省点

・一度に多く頼むと「スタメン/控えの区別」など一部の機能が抜ける

→ 2段階に分けて指示を出すとより確実 💡

🏁 4. まとめ・今後挑戦したいこと

プログラミング初心者でも、AI（Gemini）を活用することで、頭の中にあった「バスケの簡易スコアブック」というアイデアを短時間で形にすることができました 🏀

​今回はAIに指示を出すだけでアプリの試作品が作れましたが、同時に「コードの仕組みを知っていれば、もっと自由にカスタマイズしたりエラーを直したりできる」ということも実感しました。​