JavaScript Canvasでフィールドを作ってみる
フィールド(マス目状)を作ってみました。キャンバス上をクリックするとその位置マス目の色塗ることができます。タクティクスゲームやマス目を使ったゲームに利用できそうです。デモはこちらです。index.htmlmain.jsField.jsind...
ゲーム制作に役立ちそうな知識
JavaScript 
JavaScript いろいろな弾
シューティングゲームの弾幕って素敵ですよね。画面いっぱいに広がる弾。どこに行けば避けられるのか、はたまた無理ゲーなのか。デモはこちらです。記事はデモの抜粋なので、コピペだけでは動きません。弾の移動には、デルタタイムを掛けると滑らかに動いて見...
JavaScript 歩行アニメーションを作ってみる
解説っぽくしてみましたが文字にしたら分かりにくくなってしまいました。何度か読み返したり、行ったり来たりして理解を深めてください。もし質問や、何か気になることがあったら、Twitterからお気軽にご質問ください。デモを用意しました。walkA...
JavaScript シーン遷移について
ゲームにおけるシーンってなんぞやというお話です。ただし、個人の見解です。開発現場や開発の仕方によっては異なる場合があります。言語仕様の話があるので、必要がない方は シーン遷移とは のみで大丈夫です。main.jsaddEventListen...
JavaScript キャラクターに向かっていく弾(自機狙い弾)
キャラクターに向かっていく弾(自機狙い弾)Mathオブジェクトソースコード自機狙いとは座標と角度まとめキャラクターに向かっていく弾(自機狙い弾)今回制作したものはこんな感じになります。クリックした位置に赤点が移動し、青点から赤点へ黒点を飛ば...
ゲーム制作に役立ちそうな知識 setIntervalの使い方
setIntervalsetInterval使い方setInterval一定の間隔で何かを実行するよう命令する関数です。途中で解除もできます。使い方window.onload = function() { const w = 500; co...
ゲーム制作に役立ちそうな知識 座標
座標テキストの座標ボールを動かしてみるボールを反射させてみる最後に座標canvasの座標について調べてみましょう。window.onload = () => { const w = 500; const h = 500; // Canvas...
ゲーム制作に役立ちそうな知識 Canvasの使い方
CanvasCanvasについて色を塗ってみる文字を描いてみる最後にCanvasについてJavaScriptでゲームを作るとなると、ほぼほぼ出てくるのがCanvasです。Web API(Web Application Programming...