【Javascript】簡単アクションゲームの作り方。アニメーションさせてキャラを動かそう。初心者でもわかるJavascriptゲームプログラミング入門 | ジャバスクリプト初心者 | ゲーム開発

キャラクターを動かして簡単なアクションゲームをJavascriptで作ります。Javascriptの基本的な文法しか使わないので初心者でも十分取り組める内容です。ゲーム開発は結構難しい部分もあるんですが、ゲームライブラリkontra.jsを使うことでそのへんを簡単に書けるようになっています。

kontra.jsを使っている理由は、簡単なゲームを作ることを目的としているライブラリーだからです。複雑なゲームも作れるとそれはそれでカッコいいのですが、そのぶんライブラリーを扱うことが難しいというデメリットがあります。kontra.jsはできることを最小限に抑えているおかげで学習コストが低いというメリットがあります。この利点は初心者に向いています。

実際の業務でkontra.jsを用いてゲーム開発するケースは稀です。しかしこのような簡単なゲーム制作を通して学べることは多いです。基本的なプログラミングの書き方はもちろんですし、何よりプログラミングをするハードルが下がります。まず実際に何か作って完成させるという経験がプログラミング能力を上げてくれます。

●もくじ
0:00 イントロ
0:27 動画全体の流れの説明
1:36 シンプルな図形を動かす
5:46 キャラクターを動かす
10:28 キャラクターをジャンプさせる
14:42 ジャンプした時のアニメーションを変更

15:57 障害物との衝突判定
16:26 距離、操作方法を表示
22:09 障害物を変則的に動かす

●スポンサー:TechAcademy
https://bit.ly/2ZIN2LM

●ゲームで遊んでみたい方はこちら
https://coding-youtuber.github.io/running-game/build

●動画で使ったコードはこちら
https://github.com/coding-youtuber/running-game

・kontra.js
https://straker.github.io/kontra/

・画像素材
http://ceilfire.com/m/585fb1f58651e091241e3bb9

●Instagram
DMで質問・相談を受け付けています。
https://www.instagram.com/naoya_tech

●公式LINEアカウント
質問・相談を受け付けています。
https://lin.ee/aqGoTvy

====================
おすすめの副業を紹介するnote
====================
【副業】HTMLとCSS、jQueryだけで時給7900円の仕事をする方法【収益公開】
https://note.com/naoya_tech/n/nc4dfff5cb88c

●「Webサービス開発入門」の動画はこちら
https://www.youtube.com/playlist?list=PLH5ho_48ZmTZ7vjyS1YDGP3nL5zKWuKiq

●Instagram
https://www.instagram.com/naoya_tech

●Twitter
https://twitter.com/naoyashiga

●経歴
2014.3 同志社大学理工学部情報システムデザイン学科卒業
2014.4 – 2017.2 ヤフー株式会社 フロントエンドエンジニア、iOSアプリエンジニア
2017.2- 株式会社わたしは クリエイティブ開発

現在は大喜利人工知能を開発する”株式会社わたしは”にてクリエイティブ開発者として勤務。

●個人事務所
http://zhiye-studio.com/

#プログラミング #エンジニア