Submit Search
Upload
JS/Canvas Tutorial3
•
0 likes
•
244 views
秀俊 伊藤
Follow
サークル向けゲーム開発講座(第3回)で使用したスライドです。 HTML5 CanvasとJavaScriptを用いたシューティングゲームの作り方を解説します。
Read less
Read more
Technology
Report
Share
Report
Share
1 of 8
Download now
Download to read offline
Recommended
Web based 3D video streaming system “Depstreamer(仮)”
Web based 3D video streaming system “Depstreamer(仮)”
AmadeusSVX
apasec001-kawai
apasec001-kawai
Hidemi Kawai
As rock deskminia300
As rock deskminia300
78tch
Making Editor written in Ruby version 20160611
Making Editor written in Ruby version 20160611
Langur
常識の壁を打ち破れ(VMware ThinApp でWindowsを仮想化)
常識の壁を打ち破れ(VMware ThinApp でWindowsを仮想化)
tunemicky
やってよかったOS作り
やってよかったOS作り
Hidemi Kawai
OS development beginner version 20160611
OS development beginner version 20160611
Langur
マウスを使わないでキーボードで快適に生活する方法(GNU Screen/tmux/byobu/awesome)
マウスを使わないでキーボードで快適に生活する方法(GNU Screen/tmux/byobu/awesome)
Kenichiro MATOHARA
Recommended
Web based 3D video streaming system “Depstreamer(仮)”
Web based 3D video streaming system “Depstreamer(仮)”
AmadeusSVX
apasec001-kawai
apasec001-kawai
Hidemi Kawai
As rock deskminia300
As rock deskminia300
78tch
Making Editor written in Ruby version 20160611
Making Editor written in Ruby version 20160611
Langur
常識の壁を打ち破れ(VMware ThinApp でWindowsを仮想化)
常識の壁を打ち破れ(VMware ThinApp でWindowsを仮想化)
tunemicky
やってよかったOS作り
やってよかったOS作り
Hidemi Kawai
OS development beginner version 20160611
OS development beginner version 20160611
Langur
マウスを使わないでキーボードで快適に生活する方法(GNU Screen/tmux/byobu/awesome)
マウスを使わないでキーボードで快適に生活する方法(GNU Screen/tmux/byobu/awesome)
Kenichiro MATOHARA
LT駆動開発08 - 無限のディスク領域を手に入れよう(妄想編)
LT駆動開発08 - 無限のディスク領域を手に入れよう(妄想編)
Kazuya Matsubara
CPUをちょっと
CPUをちょっと
Tksenda
Prefixから始めるgentoo生活
Prefixから始めるgentoo生活
bontakun
Introduction of mruby & Webruby script example
Introduction of mruby & Webruby script example
kishima7
【らぼ★ろぐ】jPlayerの紹介
【らぼ★ろぐ】jPlayerの紹介
株式会社ランチェスター
BuddyPressの導入からカスタマイズまでの日記
BuddyPressの導入からカスタマイズまでの日記
Shoichi Otomo
gcoreでプロセスメモリダンプ -mysqlプロセスメモリを見てみる-
gcoreでプロセスメモリダンプ -mysqlプロセスメモリを見てみる-
monochrojazz
Gentooサークル新歓コンパのご案内
Gentooサークル新歓コンパのご案内
Takuto Matsuu
Bmd
Bmd
Yuichiro Naito
和牛をおいしく食べるには
和牛をおいしく食べるには
Masayuki Ozawa
74thオンラインテキストブックマーク
74thオンラインテキストブックマーク
74th
SurfaceTextureとシェーダを使って遊んでみる
SurfaceTextureとシェーダを使って遊んでみる
Tatsuya Matsumoto
マイクラ自動化枠第3回資料
マイクラ自動化枠第3回資料
Ryo Fujita
アセンブラ短歌 On web
アセンブラ短歌 On web
Kenji Aiko
やってみましたCMS XOOPS
やってみましたCMS XOOPS
jorurijin
タイル型ウィンドウマネージャのススメ
タイル型ウィンドウマネージャのススメ
Takuto Matsuu
Chefについて数週間勉強してみた
Chefについて数週間勉強してみた
Akira Kaneda
できるBGP! IHANet Meeting 11@うどん県(小豆島)でVyOSでpeerしてみた~初心者向け~
できるBGP! IHANet Meeting 11@うどん県(小豆島)でVyOSでpeerしてみた~初心者向け~
Yoshitake Takata
バージョン管理#01 -Subversion編-
バージョン管理#01 -Subversion編-
hakoika-itwg
よくわかる?KotonoSyncの使い方!
よくわかる?KotonoSyncの使い方!
u Suzumof
TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdf
taisei2219
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
Hiroki Ichikura
More Related Content
What's hot
LT駆動開発08 - 無限のディスク領域を手に入れよう(妄想編)
LT駆動開発08 - 無限のディスク領域を手に入れよう(妄想編)
Kazuya Matsubara
CPUをちょっと
CPUをちょっと
Tksenda
Prefixから始めるgentoo生活
Prefixから始めるgentoo生活
bontakun
Introduction of mruby & Webruby script example
Introduction of mruby & Webruby script example
kishima7
【らぼ★ろぐ】jPlayerの紹介
【らぼ★ろぐ】jPlayerの紹介
株式会社ランチェスター
BuddyPressの導入からカスタマイズまでの日記
BuddyPressの導入からカスタマイズまでの日記
Shoichi Otomo
gcoreでプロセスメモリダンプ -mysqlプロセスメモリを見てみる-
gcoreでプロセスメモリダンプ -mysqlプロセスメモリを見てみる-
monochrojazz
Gentooサークル新歓コンパのご案内
Gentooサークル新歓コンパのご案内
Takuto Matsuu
Bmd
Bmd
Yuichiro Naito
和牛をおいしく食べるには
和牛をおいしく食べるには
Masayuki Ozawa
74thオンラインテキストブックマーク
74thオンラインテキストブックマーク
74th
SurfaceTextureとシェーダを使って遊んでみる
SurfaceTextureとシェーダを使って遊んでみる
Tatsuya Matsumoto
マイクラ自動化枠第3回資料
マイクラ自動化枠第3回資料
Ryo Fujita
アセンブラ短歌 On web
アセンブラ短歌 On web
Kenji Aiko
やってみましたCMS XOOPS
やってみましたCMS XOOPS
jorurijin
タイル型ウィンドウマネージャのススメ
タイル型ウィンドウマネージャのススメ
Takuto Matsuu
Chefについて数週間勉強してみた
Chefについて数週間勉強してみた
Akira Kaneda
できるBGP! IHANet Meeting 11@うどん県(小豆島)でVyOSでpeerしてみた~初心者向け~
できるBGP! IHANet Meeting 11@うどん県(小豆島)でVyOSでpeerしてみた~初心者向け~
Yoshitake Takata
バージョン管理#01 -Subversion編-
バージョン管理#01 -Subversion編-
hakoika-itwg
よくわかる?KotonoSyncの使い方!
よくわかる?KotonoSyncの使い方!
u Suzumof
What's hot
(20)
LT駆動開発08 - 無限のディスク領域を手に入れよう(妄想編)
LT駆動開発08 - 無限のディスク領域を手に入れよう(妄想編)
CPUをちょっと
CPUをちょっと
Prefixから始めるgentoo生活
Prefixから始めるgentoo生活
Introduction of mruby & Webruby script example
Introduction of mruby & Webruby script example
【らぼ★ろぐ】jPlayerの紹介
【らぼ★ろぐ】jPlayerの紹介
BuddyPressの導入からカスタマイズまでの日記
BuddyPressの導入からカスタマイズまでの日記
gcoreでプロセスメモリダンプ -mysqlプロセスメモリを見てみる-
gcoreでプロセスメモリダンプ -mysqlプロセスメモリを見てみる-
Gentooサークル新歓コンパのご案内
Gentooサークル新歓コンパのご案内
Bmd
Bmd
和牛をおいしく食べるには
和牛をおいしく食べるには
74thオンラインテキストブックマーク
74thオンラインテキストブックマーク
SurfaceTextureとシェーダを使って遊んでみる
SurfaceTextureとシェーダを使って遊んでみる
マイクラ自動化枠第3回資料
マイクラ自動化枠第3回資料
アセンブラ短歌 On web
アセンブラ短歌 On web
やってみましたCMS XOOPS
やってみましたCMS XOOPS
タイル型ウィンドウマネージャのススメ
タイル型ウィンドウマネージャのススメ
Chefについて数週間勉強してみた
Chefについて数週間勉強してみた
できるBGP! IHANet Meeting 11@うどん県(小豆島)でVyOSでpeerしてみた~初心者向け~
できるBGP! IHANet Meeting 11@うどん県(小豆島)でVyOSでpeerしてみた~初心者向け~
バージョン管理#01 -Subversion編-
バージョン管理#01 -Subversion編-
よくわかる?KotonoSyncの使い方!
よくわかる?KotonoSyncの使い方!
Recently uploaded
TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdf
taisei2219
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
Hiroki Ichikura
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
FumieNakayama
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
博三 太田
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
akihisamiyanaga1
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
FumieNakayama
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
UEHARA, Tetsutaro
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
Toru Tamaki
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey
Toru Tamaki
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet
Toru Tamaki
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Yuma Ohgami
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
Yuki Kikuchi
SOPを理解する 2024/04/19 の勉強会で発表されたものです
SOPを理解する 2024/04/19 の勉強会で発表されたものです
iPride Co., Ltd.
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
sugiuralab
Recently uploaded
(14)
TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdf
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
SOPを理解する 2024/04/19 の勉強会で発表されたものです
SOPを理解する 2024/04/19 の勉強会で発表されたものです
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
JS/Canvas Tutorial3
1.
MCAゲーム開発講座 JSをいじってJCを扱えるようになろう
2.
講座の準備 > 講座資料 - ここ(https://github.com/tamamu/js_tutorial) >
質問用Slack - ここ(https://mca-dev.slack.com/)
3.
第3回 ガンマンショー ~You and
Me~ MCAゲーム開発講座
4.
音声の扱い > HTML5/JSでの音声の扱い方はブラウザに依存する - ChromeとFirefoxはmp3に対応しているがIEは対応していない -
wavは全てのブラウザで再生出来る > 読み込み/再生 - var foo = new Audio("音声ファイルへのパス"); - foo.play(); > 1つの音声オブジェクトは同時に1度しか再生出来ない - 効果音に使うなら同じファイルから複数のオブジェクトを作らないとい けない
5.
弾の定義 > 弾はプレイヤーと敵で別々に管理する > 弾は1フレームごとに位置が変わる >
弾に当たると爆発、効果音再生 > 弾は画面端まで到達すると消滅 > 弾の動き - プレイヤー弾は画面上端に向かって直進 - 敵弾は縦横無尽に動き回る > 弾の実装に必要な要素 - プレイヤー弾 - X座標, Y座標 - 敵弾 - 発射X座標, 発射Y座標, X変化量, Y変化量, 速度, 移動角度
6.
敵の行動パターン > 敵を一定の行動パターンに基づいて動かす > 行動パターンは複数の単純な動作から成り立つ -
右に5px移動、上に3px移動、静止…など > ある動作を開始して一定フレーム経過すると次の動作に移行する > 全ての動作が終わると最初の動作に戻る => ループ > 今回は動作を順番通りに行っているだけだが、プレイヤーの状態 に合わせて動作を変えることによって簡単なAIを実装することが出 来る。
7.
次回予告 > 今回まででシューティングゲームの基礎は全て実装済み > まだ実装出来ていないところ -
背景のスクロール - 複数の敵 - 残機の管理 - ステージ管理 - スコア - パワーアップ 次回やります
8.
次回 へ続 く
Download now