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
100
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
20251025_LT_catgpt_atlasでわかるOpenAI歴
doradora09
PRO
0
32
20251015_LT_BIのAIがAGI過渡期は流行るのではと思った話
doradora09
PRO
0
9
20251015_第4回_GenAIアナリティクス勉強会at東京_オープニングトーク
doradora09
PRO
0
1
20251011_第75回ChatGPT部_オープニングトーク_v1.00
doradora09
PRO
0
50
20250910_生成AIでスタンドアロンなデータ分析ダッシュボードを作りたい
doradora09
PRO
0
26
20250906_“GPT-5、Cerebras、 あとgpt-oss-120bの話” をしようと思ったら Qwen3-480Bがつよつよだっ た話(テトリスで検証)
doradora09
PRO
0
72
20250901_LT_爆速AI_CerebrasでリアルタイムSVG生成
doradora09
PRO
0
100
20250823_LT_爆速AI_Cerebrasから考える未来
doradora09
PRO
0
49
20250726_DeepResearchで何かしらの情報を調べた後のTips
doradora09
PRO
1
56
Other Decks in Technology
See All in Technology
Kubernetes self-healing of your workload
hwchiu
0
550
ストレージエンジニアの仕事と、近年の計算機について / 第58回 情報科学若手の会
pfn
PRO
3
860
OCIjp_Oracle AI World_Recap
shinpy
1
180
FinOps について (ちょっと) 本気出して考えてみた
skmkzyk
0
220
OPENLOGI Company Profile for engineer
hr01
1
45k
Okta Identity Governanceで実現する最小権限の原則 / Implementing the Principle of Least Privilege with Okta Identity Governance
tatsumin39
0
170
webpack依存からの脱却!快適フロントエンド開発をViteで実現する #vuefes
bengo4com
4
3.5k
ラスベガスの歩き方 2025年版(re:Invent 事前勉強会)
junjikoide
0
250
コンパウンド組織のCRE #cre_meetup
layerx
PRO
1
270
クラウドとリアルの融合により、製造業はどう変わるのか?〜クラスメソッドの製造業への取組と共に〜
hamadakoji
0
440
Behind Postgres 18: The People, the Code, & the Invisible Work | Claire Giordano | PGConfEU 2025
clairegiordano
0
140
Biz職でもDifyでできる! 「触らないAIワークフロー」を実現する方法
igarashikana
7
3.5k
Featured
See All Featured
Making Projects Easy
brettharned
120
6.4k
Scaling GitHub
holman
463
140k
Building Applications with DynamoDB
mza
96
6.7k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
It's Worth the Effort
3n
187
28k
jQuery: Nuts, Bolts and Bling
dougneiner
65
7.9k
Leading Effective Engineering Teams in the AI Era
addyosmani
7
640
Rebuilding a faster, lazier Slack
samanthasiow
84
9.2k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.5k
We Have a Design System, Now What?
morganepeng
53
7.8k
KATA
mclloyd
PRO
32
15k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
140
34k
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..!!