非プログラマにコードを１行も書かずにゲームプログラミングを説明する試み

## はじめに

この記事を見てくれた人はもしかしたら「これからゲームを作るぞ！！！」と意気込んで`Unity`をインストールしてる人かもしれない。ゲームの素材を作ったことがあるがコードは書いたことがない人かもしれない。「ゲームプログラミング初心者のための本」を読んだがソースコードを読むのが難しくて挫折した人かもしれない。大学の授業でしょうがなくゲームを作らなくちゃいけない人かもしれない。今後コードを書く予定はないが教養として知っておきたい人かもしれない。

巷にある「ゲームプログラミング入門」の本や記事を読んでどう思っただろうか？おそらく、「なんかプログラミングって面倒くさそうだなぁ」や「一つ一つの処理ばかり書いてあって全体像が見えない」と思っただろう。筆者（現在大学３年~~大学辞めたい~~）も大学１年の４月に生まれてはじめてゲーム制作というものを始めたが、環境構築やソースコードの難しさで挫折してしまったような人間だ。

しかしながらゲームを作るというのはとても創造的で楽しいことだ！オブジェクト指向もゲームライブラリもゲーム制作を便利にするために存在しているのであって、初心者を遠ざける理由になってはいけないと思うんだ。たかだかそんなつまらない理由で辞めるのはもったいないし、全体像をきちんとイメージ出来たらゲームに対してのイメージも変わるだろうし、きっと色々なところで役に立つんじゃないかなと思いこの記事を書いた。気楽に読んで「なんだ簡単じゃん！」だということを実感していただければとても嬉しい。

## 今回説明に使うゲーム

僕が去年大学祭に出した2日で作ったゲーム「二輪無双」だ。
走って撃って走りまくる旧感覚アクションゲーム！タイトル画面をクリック後、Zボタンで敵を倒してポイントを稼げ！といったクソゲーである。

![title.png](https://qiita-image-store.s3.amazonaws.com/0/125325/2e2958ca-ffac-a71b-402b-686ce71d1219.png)


ここ([リンク](https://github.com/takeokunn/bikeMatchless))にソースコードを載せてるので遊びたかったらダウンロードして`index.html`を開けば遊べる。

2Dゲームだが、3Dゲームでも基本的な考え方や処理や全体像は一緒だと思うので気にせず読んでください（3D開発やったことないからわからないけど）

## そもそも「これはゲームだ」と言える基準って何だろうか

これは人によって基準は違うから一概には言えないのだが、前にどっかの偉い人が「タイトル画面と、ゲーム画面と、リザルト画面が存在すればゲームだと言える」と言ってた気がする。（出展はない）
とりあえずゲームのシーンについて説明していこうと思う。

## ゲームはシーンを遷移させることによって場面を切り替えている

下図のように「タイトル」→「ゲーム画面」→「リザルト画面」→「タイトル画面」→(以下繰り返し)のように画面が遷移する。
(図が雑なのはご愛嬌）

![Blank Flowchart - New Page (2).png](https://qiita-image-store.s3.amazonaws.com/0/125325/34da114e-62f8-3245-c959-9fb306cb82d4.png)

これらのシーンはある動作やある条件を満たした時に遷移するようになってる。（例えばタイトル画面でクリックしたらゲーム画面に遷移するみたいな感じ）
条件ごとに遷移先を変えるといったこともよくやる。（例：失敗時や成功時のリザルト画面の遷移など）

今回例に出しているゲームは単純明快なのだが、実際に規模の大きなゲームになるとたくさんのシーンが必要になってくる。

## キャラクターや障害物や背景すべてに設計図がある
シーンについて喋ったし、次はキャラクターや背景など「物体」について説明しようと思う。「物体」はゲームプログラミングにおいて「オブジェクト」と呼ばれるんだ。それぞれのオブジェクトには「設計図」があって、その設計図を元に物体を生成するんだ。

このキャラはどのくらいの大きさなのか、画像は何か、最初どこに表示するのか、といったことを設計図に書き込むと、実際に物体として生成した時にその通りになるんだ。また、設計図にそのキャラクターはどういった動きをするのかなども書いてある。

## 背景やキャラクターをゲーム画面に表示する

実際にゲーム画面に表示するには、さっき書いた設計図を元にそれぞれの物体を生成する必要が有る。それぞれの物体は生成された順番にレイヤーを重ねていくんだ。

レイヤーとは以下のようなものである

![](http://blog-imgs-17.fc2.com/k/u/m/kumacrow/blog_gimplayer_03.gif)

参考サイト→[レイヤーとは？](http://kumacrow.blog111.fc2.com/blog-entry-153.html)

実際のゲームでは物体を生成しては破棄しての繰り返しで表示しているんだ。

## キャラクターや背景はどうやって動いているの？

このことを説明するにはまず`FPS(Frame Per Second)`という用語を理解しなければ始まらない。`FPS`とは文字通り「１秒あたりのフレーム数」だ。ゲームの特定の処理がフレーム単位で制御されている。例えば60FPSだった場合、1/60秒に1度特定の処理が行われていることになる。

さて、本題のキャラクターなどがどうやって動いているかについて見ていこう。ざっくり説明すると、それぞれの物体の設計図の部分に1フレームごとにどう変化するかという処理を書くんだ。具体的に説明すると、例えばキャラクターを上ボタンを押した時にジャンプさせたいとする。そういう時はキャラクターの設計図のところに「もしこの上ボタンが押されていたら⚪︎⚪︎という座標の変化をさせる、ということを１フレームごとに確認実行する」といったことを書けばその通りに動いてくれる。

## これでゲーム制作についての基本的な知識は終了

今説明した内容で大体のゲームプログラミングの全体像をしゃべれたかな。説明し忘れてたところがあったら追記しときます。また、わからないところ、間違えているところ、誤字脱字、批判があった場合はコメントください。

## 最後に

何かを創り出すということはとても素晴らしいことだと僕は思う。良い作品とは開発者もユーザーもワクワクドキドキするものだと僕は思っている

テクニックだとかデザインパターンだとか技術的なことももちろん大事だ。でももっと大事なことってあると思う。それは情熱だったり願いだったりするものだ。そういったものは技術とは関係ない。技術は後からついてくるのではないだろうか。「誰かを喜ばせたい」とか「ワクワクドキドキしたい」という気持ちが何よりも大事だと僕は信じています。

## 追記
「今のでゲームプログラミングがどういったものかなんとなくわかった。じゃあ何から始めればいい？」と疑問に思う人も出てくるだろうから自分の考えを書いておきます。

僕がお勧めするのは[enchant.js](http://enchantjs.com/ja/)です。なぜかというと、`VisualStudio`や`Unity`のような環境構築は必要なく、「メモ帳」で開発してブラウザで動かせるので手軽に始めることができる。また、日本語リファレンスが充実しており、日本語の参考サイトも豊富です。とりあえず[ドットインストール](http://dotinstall.com/lessons/basic_enchant_js_v2)から始めるのがいいと思います。