『泥棒バスター』を改造する

ニコ生ゲームの作成には、原則としてプログラミングの知識が必要になります。 一方公式のゲームの一部は、サンプルとしてソースコードや利用素材が公開されています。 素材を差し替えるなどサンプルの改造でプログラミングなしに遊ぶことができます。

ここでは、公式サンプル『泥棒バスター』と『スピードジグソー』(次頁)の改造方法をご紹介します。

この文書は、 https://dwango.github.io/niconico/jikken-housou/akashic-content1/ で公開されていた記事を調整して転載したものです。 文体などは他のページと異なることがあります。

# 環境の用意

直接プログラミングをしないとはいえ、動作確認のためには開発用ツールが必要です。 インストール を参照して、 Akashic Engine の開発用ツール akashic-sandbox, akashic-cli をインストールしてください。

# ソースの用意

次に元ネタを持ってきましょう。今回のテーマは「改造」ですので、元ネタが必要です。

今回利用するゲームは『泥棒バスター』というゲームです。

  • 画面をタップすると攻撃と移動の両方を行います
  • 3 種類の敵がいて、それぞれ特徴があり、敵を倒すと得点が入ります
  • 敵がドアまで到達すると減点になります
  • ドアに到達する前に倒し続ければコンボボーナスが入ります
  • 途中で武器が現れることがあり、武器を攻撃するとパワーアップできます

・・といったゲームですね。

大体ゲーム内容がわかったところで、このゲームのソースコードをダウンロードしましょう!  GitHub というところに登録されています。

https://github.com/akashic-contents/thiefBuster

今回は完全なソースコードは不要なので、ゲームのバイナリだけダウンロードしたいと思います。画面右の方に release というリンクがあるので、こちらを選択してください。

GitHubのrelease

release のページに移ったら、次に最新のリリースに含まれる game.zip というファイルを選択してください。

game.zipのダウンロード

この手順の通りにやると最新版の game.zip をダウンロードできますが、本記事時点の最新版でよければこちらのリンクからダウンロードすることもできます。

https://github.com/akashic-contents/thiefBuster/releases/download/v0.0.2/game.zip

ZIP ファイルの解凍方法がわかる方は、ダウンロードしたファイルを解凍してください。Windows ユーザの方は、エクスプローラ等からファイルを右クリックし、そこで出てくるすべて展開というメニューで解凍できます。

泥棒バスターの解凍

こういったダイアログが出てくると思うので、展開というボタンを押せば展開されます。

泥棒バスターの解凍

まずはダウンロードしたものを実行してみましょう。

インストール で利用した CUI ツールを起動して、以下のようなコマンドを実行してください。

cd C:\Users\toyokazu_tsugehara\Downloads\game\game

cd の後は環境によって違います。「ダウンロードした場所\game\game」という感じのものです。

本文章上は場所の区切りを示す記号が \(バックスラッシュ)に見えていますが、多くの環境では (円記号)のような表示になっていると思います。

これは日本語キーボードの キー、英語キーボードの \ キーを押下すると、環境に応じて表示が変わる文字として扱われるもので、どちらも正常です。以後、 に見える環境では \ に読み替えてください。

「cd 」と、cd の後の半角スペースまで入力してから、エクスプローラからドラッグすると間違えなくて済みます。

エクスプローラからコマンドプロンプトにドラッグ

ドラッグ&ドロップに成功するとこのような表示になります。

ドラッグ&ドロップの成功

これで Enter キーを押すと、表示がこのように変わります。

cdの成功

これで、ゲームをダウンロードした場所で作業している事になるので、以下のコマンドを実行してください。

akashic-sandbox

実行すると下図の表示が出ています。「localhost の 3000 番ポートでこのゲーム用のサーバを起動したので、 http://localhost:3000 にブラウザでアクセスしてください」という趣旨のメッセージが表示されています。

Akashic Sandboxの起動

http://localhost:3000 を Chrome 等のブラウザで開いてみると、無事、ゲームが実行されている様子を見る事ができます。

akashic-sandbox はゲームを実行するためのサーバを起動するためのコマンドで、このコマンドを CUI ツールで実行する事で、みなさんの PC 上でゲームを実行できます。

その前に実行した cd というコマンドは、作業場所を移すコマンドで、この cd を使う事でゲームを切り替える事ができます。

CUI ツールの操作は少し難易度が高いですが、どのゲームを作るのにも行う作業になるので、cd でゲームを切り替えて akashic-sandbox で実行、という使い方は覚えておく事をオススメします。

akashic-sandbox を実行した CUI ツールと、http://localhost:3000 で開いたブラウザは、以下でも使うのでそのままにしておいてください。

# ゲームの改造

長くなってしまいましたが、準備が整ったので、いよいよゲームを改造していきたいと思います。今回は画像の改造だけで、ゲームの見た目を変えるという事をやりたいと思います。

泥棒バスターを解凍したフォルダの中に、game というフォルダがあります。この中に、ゲームに必要なリソースが一式入っています。

その中の、asapj というフォルダの中に色々なリソースファイルが入っています。この辺りの画像をいじれば、ゲーム中の画像も変わります。

asapj フォルダの中にある stg_player というフォルダを覗いてみると、stg_player.png というファイルがあります。

stg_player.png

これを改造すればプレイヤーが変わりそうな気配があります。ゲームの仕組みはよくわかりませんが、まずは変えてみましょう。以下辺りが怪しいですね!

変えればプレイヤーが変わりそうな場所

これは、明らかに「1」が通常時の手、「2」が攻撃をした時の手、「3」がキャラクターの画像でしょう。

なんとなく差し替えてみようと思います。こちらの手元ではこうなりました。みなさんも是非、記事を読むだけでなく、実際に改造してみてください。

画像を実際に変えた様子

ここで、先ほど開いているままのブラウザのリロードをしてください。私の手元ではこのような画面になりました。

泥棒バスターの画像が変わった様子

もうちょっといじってみましょうか。 せっかくゲームを改造したので、タイトル画像も変えちゃいましょう。 asapj の下の nw_title の下の、title_logo.png という画像が怪しいです。

title_log.png

これを変えてみましょう。私の手元ではこうなりました。

タイトル画像を変えた様子

またブラウザをリロードすると、タイトルが変わっているのが確認できると思います。

# 投稿

このように、ゲームの改造は、環境を作るまでが少し大変ですが、一度作ってしまばえゲームによっては割と簡単にできます。

既に公開しているニコ生ゲームの内、いくつかのゲームのソースコードが公開されていますので、是非改造してみてください。

ここでは画像を変更しましたが、BGM や、プログラミングの知識のある方はソースコード自体も自由に改造いただけます。

作成したゲームは ニコ生ゲームを投稿しよう を参考にぜひ投稿してみてください。