スマホだけで簡単に始めるゲームの作り方｜初心者向け完全ガイド

Spck Editorは、モバイルデバイス向けの高機能なコードエディターで、特にウェブ開発に適しています。
軽量で直感的なインターフェースを持ち、さまざまなプログラミング言語をサポートしています。

Spck Editorは、HTML、CSS、JavaScript、Python、PHP、Java、C、C++など、さまざまなプログラミング言語に対応しています。
ウェブ開発からスクリプト作成まで幅広く利用できます。

コードの入力を効率化するためのオートコンプリート機能があります。
よく使うコードや変数名を自動的に補完してくれます。

ウェブ開発に便利なライブプレビュー機能を備えており、ブラウザでリアルタイムに変更を確認できます。

実際にスマートフォン一台でゲームを作る方法を解説します。

スマートフォン一台でゲームを作る方法は、2つあります。

一つ目は、SpringinやEpic Game Maker: Sandbox Craftなど、ノーコードでゲーム制作ができるアプリを使用する方法です。

二つ目は、コードエディターを用いて、ゲームを制作する方法です。

以下に、スマートフォン一台でゲームを作る際のメリットとデメリットを表にまとめました。

本記事で紹介するのは、コードエディターを使用して、ゲームを作る方法です。

筆者がゲーム制作に使用した環境は、iPhone（第三世代）と、スマートフォン用のコードエディターであるSpck Editorです。

プログラミング言語は、JavaScriptを使用します。

Spck Editorは、iOSとAndroidともに、以下のリンクからインストールできます。

アプリをインストールして、起動すると以下の画面が表れます。

右上の×が書かれたアイコンをタップすると、game.jsファイルが開きます。

このファイルは、テンプレートとして、最初からプリインストールされているスネークゲームのコードです。
今回作るブロック崩しゲームには使用しません。

左上にある三本の線が引かれたアイコンをタップして、サイドバーを開きます。

次に、紙飛行機のアイコンをタップします。

そして、ワークスペースを開きます。
 

ワークスペースの右上にあるプラスボタンをタップして、テンプレートの中から、No Frameworkを開きます。

制作するゲームは、ブロック崩しゲームのため、プロジェクト名を「Block-breaking game」として、作成アイコンをタップします。

以下の画面が表示されたら、設定は完了です。

Spck Editorを使用したブロック崩しゲームの作り方を解説します。

左上の三本線のアイコンをタップして、＋マークが書かれたファイルアイコンをタップします。

ファイルパスと書かれた欄に、それぞれ「index.html」「script.js」「style.css」と入力し、確認ボタンをタップします。

以下のようなディレクトリの構造で、ファイルが作成されていれば準備完了です。