Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
20241221_第2回ポチポチゲームの会_シューティングゲームの巻
Search
NobuakiOshiro
PRO
December 20, 2024
Technology
1
87
20241221_第2回ポチポチゲームの会_シューティングゲームの巻
https://genai-pochi-games.connpass.com/event/339022/
NobuakiOshiro
PRO
December 20, 2024
Tweet
Share
More Decks by NobuakiOshiro
See All by NobuakiOshiro
20250709_MacStudioとLlama-4Maverickでローカル画像認識
doradora09
PRO
0
23
20250709_第3回_GenAIアナリティクス勉強会at東京_オープニングトーク
doradora09
PRO
0
45
20250625_生成 AI 活用2年目の壁を突破せよ_(60min版)
doradora09
PRO
0
49
20250628_生成AIおすすめyoutube共有会_ChatGPT部第69回
doradora09
PRO
0
55
20250607_AIから始めるロボット勉強会_HuggingFaceについて
doradora09
PRO
0
22
20250604_ビール片手に生成AIデモ
doradora09
PRO
0
19
20250524_ChatGPT部第67回_オープニングトーク
doradora09
PRO
0
11
20250503_第1回AIロボット勉強会_自動生成サマリ(ファクトチェック前)
doradora09
PRO
0
17
20250503_第1回aiロボット勉強会
doradora09
PRO
0
24
Other Decks in Technology
See All in Technology
Zero Data Loss Autonomous Recovery Service サービス概要
oracle4engineer
PRO
2
7.8k
Operating Operator
shhnjk
1
590
20250705 Headlamp: 專注可擴展性的 Kubernetes 用戶界面
pichuang
0
270
生まれ変わった AWS Security Hub (Preview) を紹介 #reInforce_osaka / reInforce New Security Hub
masahirokawahara
0
470
DatabricksにOLTPデータベース『Lakebase』がやってきた!
inoutk
0
110
AI専用のリンターを作る #yumemi_patch
bengo4com
5
4.3k
React開発にStorybookとCopilotを導入して、爆速でUIを編集・確認する方法
yu_kod
1
280
20250707-AI活用の個人差を埋めるチームづくり
shnjtk
4
3.9k
Geminiとv0による高速プロトタイピング
shinya337
1
270
Getting to Know Your Legacy (System) with AI-Driven Software Archeology (WeAreDevelopers World Congress 2025)
feststelltaste
1
130
LLM時代の検索
shibuiwilliam
2
170
OPENLOGI Company Profile
hr01
0
67k
Featured
See All Featured
Typedesign – Prime Four
hannesfritz
42
2.7k
Gamification - CAS2011
davidbonilla
81
5.4k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Building Adaptive Systems
keathley
43
2.7k
The Straight Up "How To Draw Better" Workshop
denniskardys
234
140k
Building Applications with DynamoDB
mza
95
6.5k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
29
9.6k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
A better future with KSS
kneath
238
17k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
970
Done Done
chrislema
184
16k
Transcript
第2回 ポチポチゲームを 作ろうの会 〜 シューティング ゲームを作ろう︕ の巻 〜 2024/12/21 @doradora09
⾃⼰紹介 @doradora09こと⼤城、出⾝は沖縄、東京 で就職して今は福岡に移住。 本業は昔数年Webエンジニア->データサイエ ンス関係。 ⽣成AI使えば昔やりたかったゲーム開発ができ るのでは︖ということでこの勉強会を⽴ち上げ ました。
この会の趣旨 • ないなら作る、でワイワイやる • 極⼒、ノーコーディング • ぜひみなさんの作品も いつかプレイさせてください・・︕
この会でよく使ってる⽣成AIや素材等 ChatGPT Plus / Pro コード生成とゲームロジッ クの設計に活用。20$程度の 課金 Suno.AI ゲーム用BGMの作曲に使用。
これも確か商用利用は要課金。 DALL-E ゲームグラフィックスの生成 に利用。ChatGPT経由で利用。 SE音のフリー音源 効果音ラボ様より。無料。 https://soundeffect- lab.info/sound/battle/ HTMLの動くブラウザ PC環境推奨(ファイルを開いた りするので)。なお、プレイだ けならiPadやスマホでもOK GitHub ゲームを一般公開する際の Webサーバ代わりに利用。
前回と、今回のテーマ • 前回は「ドラゴンスレイヤー」 という名前で コマンド選択式のポチポチゲー ムを作ってました。 • 今⽇は横スクロールなシュー ティングゲームを1時間で作り ます(少⼈数ならハンズオン)
https://doradora09.github.io/chatgames_ 20241019v2_dragon/
完成版の例 • (BGM注意) https://doradora09.github.io /20241221_chatgames_shooting_starrimlegion /
ゲーム開発ハンズオン
ChatGPT Proをお貸しします (後でパスワード変更しておきます) • チャット欄にアカウント・パスワードをお送りしますので OpenAIのサイトからChatGPTにアクセスしてみてください • https://openai.com/index/chatgpt/ • ちなみに複数名で同時利⽤する場合はタブが乱⽴しますので、
ニックネームとか⽬印をタブの名前につけておくと良いかも です [注意] ID / Passの 外部公開は 禁⽌
参考︓ IDを⼊れて、 続けるをクリック。 次にパスワードを ⼊れる ChatGPTの画⾯ o1-miniのモデルは早い ので切り替えおすすめ ( 好きなモードでOK
)
ChatGPT活⽤上の注意点 • 右上のアイコン->設定->デー タコントロール->「すべての ⼈のためにモデルを改善する」 をOFFにしてご利⽤ください • ⼤原則、個⼈情報⼊れないこと ( 今回はゲーム開発なので⼤丈
夫だと思いますが、念の為 ) ここがオフなのを確認
ゲーム開発のヒント
ゲーム開発のヒント • ストーリーの⾻⼦を⽣成AIに作らせる • それをhtml/css/jsの1ファイルでゲーム化 • 必要に応じてupdate & デバッグ •
画像と⾳楽とSE⾳の追加 • 完成版のGitHub Pagesでの公開
シューティングゲームの要素例 • 横スクロール︖縦スクロール︖ • 敵の強さ / 弾幕 / ボス戦 •
武器のパワーアップ / シールド • ボムの実装 (敵の球も消す) • エンディング
Chat先⽣作のコードの実⾏⽅法と補⾜ • htmlファイルの場合、テキストエディタなどにソースコード をコピペして、ファイルの拡張⼦を「.html」にすれば、ダブ ルクリックするだけでブラウザにて動きます • ちなみに、ChatGPT-4o、またはo1、o1-proであればファイ ル⾃体のアップロードも可能ですが、個⼈的にはo1-miniが チョッパやなので、ソースコードをコピペしてChat先⽣に指 ⽰だしすることが多いです。
ファイル管理 • 最初はhtmlファイル1つに全ての処理をまとめた⽅がChat先 ⽣とのやりとりは楽です(ただ、1000⾏を超えるとちょっと怪 しい) • ある程度バージョンアップしたら、ファイル名を変えて世代管 理するとよいです(動かなくなることがあるので) • 最初はフォルダに全ての要素を平置き、そのうちBGMやSE⾳、
画像が増えてきたら素材⽤のフォルダを作ってそのファイルパ スを指定してもよいでしょう(例︓se/shot.mp3、など)
開発時のデバッグ⽅法 • 基本は「こういう問題が起きている」とChat先⽣に連携 • ⾔葉で書きにくいものはスクリーンショットを撮って共有も 有効 • 画⾯がうんともすんとも⾔わない時はブラウザの「開発者 モード」でエラーログが出ていないかをチェック
• Chormeブラウザの場合は右上の3点 リーダー -> その他のツールà デベ ロッパーツールで、「Console」タブを クリックするとエラーログが⾒れます 画⾯参考︓ ここに⾊々出てきます
( 問題がなければ何も出ません )
• Githubのアカウントが必要です https://github.co.jp/ • ゲーム開始のファイルをindex.htmlとして保存して、 Githubにリポジトリ登録&ファイル保存、Github Pagesで公開 設定をして数分まてば全世界からプレイできるようになります ゲームの公開 これで今⽇からあなたもポチポチゲームクリエイター・・︕︕
Enjoy..!!