クォータービューのJavascriptゲームっぽいインターフェイスにTRY

Pocket
LINEで送る
GREE にシェア
LinkedIn にシェア

Canvasを使って開発されるゲームは数多くありますが、HTMLエレメント主体でのゲームってそんなに存在しないようです。
 

今回は、Javascriptだけを使って、ローカル環境でも動くクォータービューのゲームを作ってみました。
 

ゲームと言っても、実際にRPGのストーリーが楽しめるのではなく、そうしたゲームの基盤になりえるライブラリを作ってみたという事です。
 

でもさらに言ってしまうと、一昔まえに作ったライブラリなので、作り直さないとイケないのですが、今回はこういうのもアリ?という観点でご紹介します。

リンクと動かし方

ココを押すと、別ウィンドウが立ち上がります。
 

スクリーンショット 2018-03-04 8.29.26
 

こんな画面が立ち上がります。
 

PCのブラウザで表示した場合は、カーソルキーを押すと、中心のキャラクターが動かせます。
 

スマホで表示している場合は、画面右下に見えているコントローラをグリグリすると、キャラクターが移動します。
 

スクリーンショット 2018-03-04 22.05.33
 

このプログラムの特徴

今回は、プログラム掲載はしていないのですが、Javascriptだけで作っているので、ブラウザのソースを読むと全てのソースコードは取得できます。
 

興味のある人は、自分のローカル環境にDLすると、ネットにつながっていなくても動きます。
 

このプログラムの特徴は、HTMLタグで構成されているという点と、JSのみで動作しているという点なのですが、
 

キャラクターがmapを移動する時に、木や建物の前後判定が出来ている事に気がつくと思います。
 

あと、マス目ビューのコリジョン判定も行っており、障害物をキャラクターが突き抜けないようにもなっています。
 

このプログラムのこの先

このプログラムを発展させると、簡単なRPGぐらいは作れると思うんですが・・・
 

足りていない要素としては、音楽と、効果音ですかね。
 

あとは、戦闘シーンなどは、これとは全く別のエンジンにしなければいけないでしょう。
 

もちろん、シナリオなども重要で、会話や、進行に関する説明文、イベントなどなどを組み込む必要がありますが、そこは非常に開発としては楽しめるポイントでしょう。
 

なにより、アプリではなく、WEBブラウザで手軽に遊ぶことができる点を考えると、こうしたゲームを作り込んでいくのもPWA推奨の僕としては、非常に意義のある事なのです。
 

とりあえず、今回はモックアップだけなのですが、近い将来、このエンジン(バージョンアップをした)でゲームをお披露目する日も近いかもしれませんね。
 

要望、命令、お待ちしています。

Leave a Reply

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です