「プログラミングを独学してゲームを作ってみたいけど、出来るのかな?」
「独学プログラミングでゲームを作る方法が知りたい!」
この記事では、プログラミング初心者でも独学でゲームを作る手順について解説します。実際の簡単なサンプルコードもあるので、手を動かしながら制作してみてくださいね!
それでは早速見ていきましょう!
プログラミング初心者がゲームを作る前の確認事項
プログラミング初心者がゲームを作る前の確認事項について解説します。
- ゲーム制作向けプログラミング言語
- ゲーム制作用ツール
それでは一つずつ見ていきましょう。
確認事項①:ゲーム制作向けプログラミング言語
本格的なゲーム制作を行うのであれば、C#やC++がおすすめですが、プログラミング初心者にとっては難易度が高いためおすすめできません。
初心者でしたら、JavaScriptで簡単なゲームを作ってみることをおすすめします。JavaScriptは学習サイトやネットにもたくさんサンプルコードが載っているので学ぶ環境が整っています。
また比較的難易度も低く、初心者向けのプログラミング言語と言われています。JavaScriptについては参考記事も見てくださいね。
確認事項②:ゲーム制作用ツール
全世界でゲーム開発に利用されるツールとして最も有名なのが、「Unity」ですが、知識やスキルもなくいきなりUnityを使った本格的なゲームを作ろうとすると挫折してしまう可能性が高いためおすすめできません。
それでもUnityでゲームを作りたい人は、Udemyで丁寧に説明している講座を購入して学習しましょう!
先ほどおすすめしたプログラミング言語である、JavaScriptを動かすのであれば「Visual Studio Code」という統合開発環境を用意しましょう。こちらのツールでは、コードの記述から実行までプログラミングに必要な作業をひと通り行うことができます。
プログラミング初心者が独学でゲームを作る時の注意点
プログラミング初心者が独学でゲームを作る時の注意点は以下の通りです。
- こだわりすぎない
- バグやエラーはすぐに解決する
- 著作権に注意
それでは一つずつ見ていきましょう。
注意点①:こだわりすぎない
はじめのうちは、あれやこれやと複雑なゲームを作りたいと思うでしょう。
しかし、それではいつまでたってもゲームは完成しません。はじめからハイクオリティのゲームを作成しようとするのではなく、フレームワークや言語の特徴を知るために簡単なゲームから作成するようにしましょう。
また、細部までこだわりすぎてもゲームは一向に完成しません。初心者は挫折しないようにプログラミングを習得することが何よりも大事です。
注意点②:バグやエラーはすぐに解決する
独学でプログラミングを始めるとバグやエラーの連続に、嫌気がさすこともあるでしょう。そのような時には、無料の質問サイト「teratail」を使って、疑問やエラーをすぐに解決するように心がけましょう。
そうすることで、挫折することなくスムーズにゲームを作成することができます。
注意点③:著作権に注意
著作権にも注意しましょう。ゲーム制作にあたり、キャラクターやサウンドなどをフリー素材サイトなどを利用する場合があると思います。
無断で使用をすることを禁止しているサイトもあるので注意が必要となります。
特に、商用利用を考えている場合は、事前にサイトの利用規約などを確認しましょう。
【プログラミング初心者向け】ゲーム制作の手順解説
本題のゲーム制作の手順について解説します。
- どんなゲームを作るか決める
- ゲームの簡単な仕様書を作る
- プログラミングを行う
- テストプレイを行う
それでは一つずつ見ていきましょう。
手順①:どんなゲームを作るか決める
まず、プログラミングを使って作りたいゲームを決めましょう。
エンジニアのポートフォリオを参考にしても良いですし、やってみた系の記事を参考にしても良いでしょう。少しアレンジを加えるだけでも初めは十分なので、初心者向けのゲームから取り組みましょう!
手順②:ゲームの簡単な仕様書を作る
次に、ゲームの簡単な仕様書を作りましょう。ゲームの設計図にあたるものなので、なるべく詳細に設定することが大事です。例えば、BGMであったり背面、キャラクターなどが挙げられます。
自分の理想とするゲームの構想を考えましょう。
手順③:プログラミングを行う
いよいよ、仕様書に従ってプログラムを記述していきましょう。ここで、JavaScriptで出来る簡単なルーレットゲームを紹介します(参考URL)。
まず、ルーレットのパネル部分は以下のように実装します。
- /**
- * 初期化処理
- */
- init: function () {
- // ルーレットのパネル配置を調整
- var $panels = $(‘.panel’);
- var deg = 360.0 / $panels.length;
- var red = (deg * Math.PI / 180.0);
- var r = $panels.width() / 2;
- var adjustY = ($panels.width() / 2) – ($panels.height() / 2);
- $panels.each(function (i, elem) {
- var tmp = i – ($panels.length / 4);
- var x = Math.cos(red * tmp) * r + r;
- var y = Math.sin(red * tmp) * r + r + adjustY;
- var t = tmp * deg;
- $(elem).css({
- ‘left’: x,
- ‘top’ : y,
- ‘transform’: ‘rotate(‘ + t + ‘deg)’
- });
- });
- // ルーレットのパネル数を代入
- panelNum = $panels.length;
- },
- 次に、ルーレットの見た目を調整しましょう。ここは自分でアレンジしてみると面白い部分です。
- body {
- text-align: center;
- padding: 0;
- margin: 0;
- }
- ul {
- list-style: none;
- }
- .roulette {
- width: 90%;
- height: 500px;
- margin: auto;
- position: relative;
- border : solid 1px #333 ;
- }
- .panels {
- position: relative;
- margin: 0 auto;
- width: 400px;
- height: 400px;
- }
- .panel {
- width: 200px;
- position: absolute;
- }
- .panel img {
- vertical-align: bottom;
- }
最後にJavaScriptでルーレットの回転アニメーションを実装すれば完成です。
- /**
- * ルーレットの回転アニメーション
- */
- animation: function () {
- $(‘.panels’).animate({
- deg: -((360 / panelNum) * loopCount)
- },{
- duration: sec,
- step: function (now) {
- $(‘.panels’).css({
- transform: ‘rotate(‘ + now + ‘deg)’
- });
- },
- complete: function () {
- if (stopFlag) {
- return ;
- }
- loopCount++;
- Roulette.animation();
- }
- });
- }
手順④:テストプレイを行う
仕様書通りにプログラミングが完了したら、テストを行います。
ゲームを最初から最後までプレイしてみて、エラーや挙動がおかしい部分がないか1つずつデバッグしていきましょう。バグが見つかれば順次修正していきます。テストプレイを繰り返し、正常な動作ができれば完成です!
まとめ
今回、プログラミング初心者向けに独学で行うゲーム制作の手順について解説しました。
- どんなゲームを作るか決める
- ゲームの簡単な仕様書を作る
- プログラミングを行う
- テストプレイを行う
注意点や確認事項を参考に簡単なゲームから作成してみてくださいね!