ファンタシースター ダンジョンシミュレーター ver 0.1 on JavaScript

ファンタシースター ダンジョンシミュレーター ver 0.1 on JavaScript





初めに

気分転換の為に作り始めた、ファンタシースターのダンジョンシミュレーターの公開にチャレンジしてみます。
「公開にチャレンジ」とは、

・BGMは流していないので公開可能な気がする
・ココのブログのシステム上、画像を簡単に取り扱えない

の二点について、チャレンジしています。
実際にウチのローカルで動かしてる動画はコチラ


前進後退しか出来ない初期版



方向転換可能になったver0.1






画像のプリロード

前回作った覇邪の封印シミュレーターや、先日公開した動画では、
0ピクセルのサイズで描画しておいた各パーツ達です。
今回は全部出してみます。
前回の覇邪の封印の公開後にツイートしたと思いますが、
何もせずにコードを書くと、いざ描画となった時に読み込みを始める為に、
アニメーションの際にラグが出来てしまいます。
それを回避し描画命令の際に即座に表示させる為に、予め描画させておきます。

最初の7個の画像は、画面の1/4（左上部分）のみです。
それぞれ左右反転・上下反転・上下左右反転させて描画して画面を構成しています。
その下の画像は、左右キーを押して回転する時に使っています。
こちらは1/2（上部分）なので、上下反転で画面を構成します。
右回転時、左回転時、目の前がストレート、目の前が壁など、
色々なパターンで左右反転させたり逆順で描画させたりします。

















ダンジョンシミュレーター ver 0.1

この画面をスクロールさせて、最下部に表示されているかもしれません。
FireFoxなら、動くかもしれません。

操作は、十字キーかWASDキーで前後左右に動きます。
左右は方向転換です。
Zキーかマイナスキーでウェイトを少なくして、アニメーションを高速化します。
Xキーかプラスキーでウェイトを多くして、アニメーションを低速化します。
Cキーを押すと、スクロールの固定/解除をします。
上下キーでの操作ですので、操作時に画面がスクロールしてしまわないように、公開版用で新たに追加した機能です。

ウチの環境だと何故かド真ん中にヨコの黒い帯が表示されてます。
チャレンジ失敗ですかね。



終わりに

非常に感情的になって、三十時間程、食事が喉を通らない状態でした。
立腹とは良く言った物だな、等と考えていましたが、夏場ですし食事を抜き続けるのも体に良くないですし、困り始めていました。
何かの作業に没頭するのが気分転換に一番良いと思い、作り始めたのがコレです。
コレだけの物ですが確か四時間程度は掛かってると思います。

ローカル版のソースにはあちこちに覇邪の封印シミュレーターからの流用の痕跡があります。
半角数字を全角数字に変換するメソッドが残っていたり、
濁点・半濁点判別のメソッドが残っていたり、
プリロード用のjsファイル（公開版では削除されています）にある文字列の配列は、0番はファンタシースター用、1番以降は覇邪の封印用になってたり、いかにもやっつけ仕事といった様相です。
ツイッターにも書いたかと思いますが、とりあえず動けば良いか的な仕様で作りました。
ですので、十字路やT字路、ドア、落とし穴等を今後に追加するとしたら、一旦ゼロから作り直すと思います。




御質問・御意見・御感想は@m_o_p_u までお気軽にどうぞ






 << 前の記事 次の記事>> 
イメージ  ケータイのパーツ交換 ランドストーカー ウォーキングシミュレーター on JavaScript 作成リポート  イメージ



コメント

コメントを投稿

このブログの人気の投稿

Ys IVのデバッグモードと未使用ボス

イメージ
Ys IVのデバッグモードと未使用ボス   Je ne connais pas le français. Je suis désolé, veuillez utiliser un site de traduction. 初めに  先日の投稿（ チートの話 ）  にてセーブデータを使ったチートに触れたが、その掘り下げをしてみたい。 題材は PC-Engine の SuperCD-ROM² 対応ソフト Ys IV - The Dawn of Ys だ。 今でも持ってるCD-ROM²ソフトで、昔アホみたいに何度もやった。大好きだ。 現在は公式設定からは外れてしまっていて外伝的扱いらしいが、そこは気にしない。 今回はこのソフトのセーブデータ改造によってデバッグモードを使える様にしてみよう。 イースI・IIから見ると、魔法とリングの両装備、斜め移動等、豪華な変更がなされているが、意外な変更点として挙げられるのは、セーブデータの非パスワード化だ。 セーブはバックアップRAMのみ、と言うことだが、これは即ち前々作であるイースI・IIや前作イースIIIに有った「パスワード入力によるデバッグモードの発動」が出来ないと言う事だ。 ではどうするのか。 セーブデータを直接弄る事でデバッグモードが発動、デバッグメニューの使用とデバッグ版のYs4開発室（以下デバッグルーム）へ入る事が出来るようになる。 Ys4開発室 そもそもYs4開発室とは、一回でもクリアした状態であれば、セーブデータのロード画面でIIボタンを押すと出てくるメニューに追加される、オマケ機能だ。 選択すると、全ての装備と全てのアイテムを所持し最高レベルの状態で、（プロマロック～アリエダ間にあるような）ロムンの砦風の内装の建物内部からスタートする。 五階層の各フロアに散らばったキャラ（開発チームのメンバー）に話しかけると、プレイヤーへのメッセージを喋る。 サウンドルームにはサウンドテストをしてくれる滝本氏が隠れていたり（ブラックポーションは実際に使用せずとも、「使いますか？」さえ出せば登場する）、 ビジュアルルームの黒真珠ではビジュアルシーン再生や家の中、顔アップが見られるオマケ要
続きを読む

ランドストーカー　～皇帝の財宝～

イメージ
ランドストーカー ～皇帝の財宝～ 初めに ランドストーカーとは、セガ製のハード、 メガドライブ向けに1992年に発売された A・RPG だ。    メガドライブの開発コードはMarkVでMarkIIIの次の次だ。つまりマスターシステムはMarkIVだった（ 基盤に刻印が有る ）。ちなみにMarkIIはSC-3000ではなくSG-1000IIの事と思われる。 製作が CLIMAX 、発売は SEGA 。 本作の擬似3Dのゲーム性を実現する為に作られた DDS-520 というシステム云々・・・は置いておく。 この記事はランドストーカーを知ってるヒト、やった事が有るヒト、大好きだったヒト向けに書かれている。 気力や力技や裏技やバグ技、改造を使ってゲーム内のレアなシーン等を紹介する記事になっている。 以下がこの記事のお品書きだ。 ・ 超大作！メルカトルの町マップ 2021年版 ・ 本当に紫スライムは「 ゆうぎけん 」を落とすのか？ ・ 「 イフリートソード 」ドロップに関する考察 ・ 冒険開始直後の攻略率は？ ・ イベントアイテムに意味は無い？ ・ 初回の山頂の洞窟で「 めいきゅうのカギ 」を使ってみた ・ グミの村の高速ニワトリに乗ってみた お分かりいただけただろうか。 このお品書きを良く見てみると、投稿者のランドストーカーに対する異常なまでの執着を感じ取ることが出来る。 それはメルカトルの地下墓地に埋葬されている刑死した者達の怨念がそうさせている、とでも、言うのだろうか。 超大作！メルカトルの町マップ 2021年版   城の門番は和解した仲良し兄弟　ミルと公爵 町の正門は愉快な三人組に任せましょう カーラは怒って鞭を振るっています ゼッドはカジノに向かい　ドンメルはピンクパレスへ ロリア姫はお立ち台が気に入った様子 何故かカーラが池で入浴　モリオとモラリスが覗いてます 犬小屋の付近ではモズ
続きを読む

ランドストーカー on JavaScript作成記（4）

イメージ
ランドストーカー on JavaScript作成記（4） 初めに 前項の作成記（3） の最後で持上げ状態での移動モーションを作りました。 次は、置きモーションの仕上げと投げモーションです。 その前に背景オブジェクトの重ね合わせをどうにかすべく、 背景オブジェクトをNPC等と同じくスプライトに 変えようと作り変えを開始します。 試行錯誤を続けているうちに、スプライト描画が正しく行われるのが2x2までだった、という驚愕の事実が判明しました。 描画関連を全面改修するのが面倒になり、 移動可能オブジェクトを含むNPCにも重力を持たせる方向へと舵を切ります。 相変わらず進行方向が定まってませんが、フラフラと進んで行きます。 NPC/オブジェクトに重力処理を追加 置きモーションの仕上げと、その次の投げモーションに絶対に必要に成る重力の処理を作ります。 前項の作成記（3） に記述した通り、オブジェクトを置く動作とは ライルの前方の高さ三段目の位置に設置する事です。 通常であれば自由落下開始し、下に何かあればそこに乗るわけです。 落下する為には、重力の処理が必要ですね。 基本的にはライルの重力処理を流用すれば良いでしょう。 置きモーションの仕上げは、重力処理を書けば完了します。 持上げ可能オブジェクトは、全てNPCと同じ扱いにしてあります。 スプライト描画用のimageファイルを分ける都合で、 NpcClass初期化時に渡される種別パラメータが1000未満 の場合は人物や動物等の通常NPC、 種別パラメータが1000以上2000未満の場合はアイテム等のオブジェクト、 という感じで分けてます。 つまりNpcClassに重力の処理を書けば、NPCとオブジェクトの全てに重力が追加されます。 ほぼRyleClassからコピーしただけですが、書いてみたコードがコチラです。 いま読み返してみると、このコードはライルを考慮に入れてませんね。 NPCやオブジェクトが上から降ってくる場合には、ライルに突き刺さるでしょう。 そしてこのコードでどう変わったか、教会で試してみます。 本物っぽいですね。 上に乗ってる物が少し遅れて落ちる所なんか、まさに本物っぽいですね。 そして、NpcClassに書いたという事は通常のNPCにも重力が出来たはずですので、試してみます。 ベルが階段をトント
続きを読む

ランドストーカー ウォーキングシミュレーター on JavaScript 作成リポート

イメージ
ランドストーカー ウォーキングシミュレーター on JavaScript 作成リポート 以下の記事は、旧版となります。 今ではCanvasを使った方法に変えてゼロから作り直しましたが、作成の経緯・変遷として残します。 新版の記事はコチラ になります。 覇邪の封印シミュレーター や ファンタシースター ダンジョンシミュレーター の記事も合わせてお読み頂くと、 コマ切れにしたImageをTableで配置してゲームグラフィック描画に挑むという狂気の世界 を垣間見る事が出来ます。 また新版を作成するにあたり、 プログラミング講座のサイト及びyoutube動画の作成者　あきちょん氏 に深く感謝します。 一方的に勝手にお世話に成りました。ありがとうございます。 シューティング編のみですが、全部観ました。 初めに メガドライブの大好きなタイトル、スーパーハイドライド（ハイドライド3の移植版）のシミュレーターを作るべくアレコレやっていて 気付いたらランドストーカーの主人公・ライルをキャプチャーしていました。 発売から29年も経ちますが、今でも色褪せないで私を魅了し続けている稀有なソフトです。 詳しくは そんな偏愛をぶつけた記事 を参照してください。 そんなこんなでカーソルキーでライルを歩かせてみる方向へと舵をきり、とりあえず作り始めてみることにします。 相変わらず方向性が定まりませんので、どうなることやら。 まずは素材 他のシミュレーターの時もそうですが、いきなり html や JavaScript を書き始めずに、まずは画像の用意から始めます。 理由は コードで描画する技術力が無い というだけなので、良い子はマネしないで下さい。 最初は動かして動画で撮影します。 次にその動画をコマ送りして、パターンを数えます。 その後は画像にて保存し、順番をキチンと並べればOKです。 今回の対象・ライルは4方向に動きますので、静止時は4パ
続きを読む

An intruder has penetrated our force field.

イメージ
An intruder has penetrated our force field .   このポスト を書いてる時に発掘した動画をアップしてみる。 基本的に全て安全地帯（以下、安地）の動画だ。 沙羅曼蛇・4面       朝イチ等で4面未クリア時には有用なので、単なる大道芸になっている以下のグラII動画とは違う。 まぁコアを速攻で潰すのが正規パターンだろうが。  最初の動画では五連ハッチの一つを逃している所が悲しい。 グラディウスII・3面 後の作品にも登場する人気ボス、クリスタルコア。 テトランにも匹敵するくらい人気だろう。 この安地は超有名、と言うか見て気付く。     グラディウスII・5面 デカモアイ。 グラIIIのヴァイフでも似たような事ができるが、グラIIIの場合は真面目に戦闘すると理不尽な死が訪れるので、安地頼みの方が良い。     グラディウスII・7面
続きを読む

イース4のデバッグモードを実機で

イメージ
  イース4のデバッグモードを実機で Je ne connais pas le français. Je suis désolé, veuillez utiliser un site de traduction. Je suis désolé que la vidéo ne soit sous-titrée qu'en japonais. 初めに 意外と旧システムカードのエディットモードが知られて無いらしく、 前項 「  Ys IVのデバッグモードと未使用ボス  」を書いてから3件程の問い合わせが有りました。 問い合わせ件数が少ないので、別に個別に答えていても良いのでしょうけど、 まぁ今後消えてゆく裏技だろうし記事にしますか、と言うコトで、 システムカードVer.1.00のエディットモードを使ったバックアップメモリーの書き換え方法の解説を作りました。 エディットモード解説 写真を何度も貼るのが面倒なので、動画にしました。 （ 解説字幕を作る方が大変なコトに後で気付きました ） バックアップメモリーのセーブ状況を動画と同じにするのがベストだと思いますが、 それが無理なら上から二つが ・YS4.DAT.01 ・YS4.ENV の並びになっていて、本当に初期状態（ 動画ではゲームスタート直後のミネアの街でセーブ ）であれば、 動画と全く同じ手順で実現可能かと思います。 エディットモードの入り方や書き換えの手順さえ理解すれば、該当するファイルや書き換え箇所の探し方や書き換える数値は  前項  に記載された通りなので、問題は無いでしょう。 入力方法をおぼえた上でアドレス0xC000以降のデータを紙やPC上に記録しておけば、強力なバックアップになります。 デバッグメニューの付け足し解説 コレじゃ記事として少し物足りないので、前項のイース4のデバッグメニュ
続きを読む

ランドストーカー on JavaScript作成記（3）

イメージ
ランドストーカー on JavaScript作成記（3） 初めに 前項の作成記（2） の最後に書いた稀有な経験の興奮からやっと醒め、 作成を続けます。 ツイートでは、NPC・BG切り替え・Z方向の当たり判定と言ってますが、 天啓でも有って突然レベルが上がったりしない限り、 いきなりそんなモノを作れるワケも無いです。 さて、どうしましょうか。 影を試す 内藤さんにRTされて以降、 色々なランドストーカーに詳しい方にフォローされました。 それに触発されて再びゲーム自体を調べ始め、 かつてのゲームレビューや感想を検索で読んでみたりした所、 当時もちょっと気に成った「影問題」に当たりました。 影問題とは、ライルや他のスプライトに影が無く、 位置関係の把握が困難という意見です。 個人的には影が無い事は全く気に成らなかったのですが、 物は試しと言う事で作ってみます。 元々のゲームの中にはスプライトやオブジェクトの影が一切無いので、 何となく適当に作ってみました。 ライルのモーションの画像の中に仕込んでみました。 次はコードを書きます。 コードを書くと言っても、 ライルのモーション（影のみのヤツ）を先行で一回描画するだけです。 まずは実際に描画させて画像の中の影の位置を微調整します。 次は影が落ちる高さの演算です。 と言っても、ライルの重力処理で使ってるモノが そのまま参照出来るので、特に新たに書く必要はありません。 そんなこんなでアッサリ出来た、本家のランドストーカーに無かった新要素・影の有るライルです。 分かり易いように動画ではジャンプ力を強化し、途中から速度を半減、30fpsで動かしてます。 「速度を下げねェと分からんって、やっぱ要らねェんじゃ・・・」 と思いましたが、動く足場とかにも影が有れば少しは難易度が下がったのかも知れないので、影派の人達の言うことも一理有るかな、という感じですね。 実際、速度を下げた場合は位置関係を把握し易くなってます。 NPC作成を開始 遂に逃げる先が無くなって追い込まれました。 村の全景と個別の建物が出来たんで、もうNPCを作るしか無いです。 NPCとはゲーム用語で、Non Playable Characterの略・・・と思ってますが、合ってますかね。 まあ要するに自分の意思と無関係に動くキャラクターです。 RPGには付きモ
続きを読む

ランドストーカー on JavaScript作成記（2）

イメージ
ランドストーカー on JavaScript作成記（2） 初めに 前項 のランドストーカーのウォーキングシミュレーターを更新し続け、 無人のメルカトルの町を歩くという、個人的には爽快な所まで行けました。 町の南側から港に向かう際に必死に誤魔化してますが、 レイヤー処理、要するに背景とライルの重ね合わせの処理が出来ていません。 通常の2DのRPGでは 「この部分はメインキャラクターより手前」 「この部分はメインキャラクターより奥」 と決まっている事が多いです。 しかしランドストーカーは、描画こそ2Dですが内容は3Dですので、 何らかのオブジェクトに対し 「ライルが手前なら手前、ライルが奥なら奥」に描画する事で奥行きを表現しています。 ゲーム開始直後のマサンの村で言えば、村長の家の前の広場に有る謎の石像、各種建物、竹製っぽく見える柵などです。 上の画像を見るとライルの描画されている絶対座標はホボ同じですが、 右のライルは手前に描画されていて、 左のライルは奥に描画されています。 カメラから見ると右のライルは石像よりも手前でジャンプしてるので、石像よりも手前に描画されます。 同様に左のライルも、カメラから見ると石像より奥に立っている為に、石像よりも奥に描画されます。 ゲームを操作しているプレイヤーの視点で考えると、至極当然な見え方です。 つまり全てのスプライトは高さを持つBGオブジェクトに対し、手前か奥を判別して描画する順番を変えているわけです。 コレを作らないと、キャラクターを普通に動かすというとりあえずの目標に届きそうに有りません。 HTMLやCSSでレイヤーと言えば、z-indexです。 コレを動的に書き換えれば良さそうです。 早速コードを書いて実行してみましたが、何故か動きません。 色々と考えて色々と試してみましたが、どうにも動きません。 そんな時は検索。 色々と調べていて、ふと検索ワードを変えてみました。 「JavaScript ゲーム」 遂にCanvasを使い始める そのワードで得た検索結果に、 JavaScriptで作ったゲームやJavaScriptでのゲーム製作講座等がありました。 最初の方にシューティングゲーム製作の講座のyoutube動画が有ったので、何かの参考になるかなと徐に観始めます。 以前からゲーム関連の話題で 「ゲー
続きを読む

チートの話

イメージ
  チートの話 （以下の内容はLINEのタイムラインに投稿して、（薄く）反響が有った内容を再編集し投稿した。）   初めに 前回の投稿（ NoDVD ）  で「デバッガは約15年振り」と書いたが、気になったのでアレやコレやと調べてみた。 どうやら2005年発売のPCゲーム「イース -フェルガナの誓い-」に使った事がわかった。 発売日が6/30なのに、7/4には既に各種アドレスを調べ始めてた記録が残っている。 買って超速攻でクリアして、HardやNightmareやタイムアタックモードに挑戦せず、チートに走っちゃった16年前の俺。 もうガッカリだよ。   チートとは ところで、ココで言うチート/cheatとは英語の方の意味ではなく、 「ゲーム実行中のメモリ上のデータやセーブデータを書き換えて、パラメータやフラグを操作する事」を意味する。 PAR等でのチートを、かなりやり込んでしまったゲームなんかで使うのは楽しい。 「難しすぎるからインチキして楽にクリアする」みたいな使い方も出来るが、 「仕様上有り得ない事を起こす」みたいな方が好きだ。 前者は例えば、チートに有りがちなコード「無敵、最強装備、金MAX、レベルMAX等々」だ。 苦労したゲーム程、使うのが楽しいコードなのだが、割とスグに飽きてしまう。 作り手が苦労して整えたバランスを一気に崩すわけだから、ツマらなく成って当然だ。 昔のRPGだったら「入手経験値n倍」「移動速度高速化」とか、その辺りで留めるとイイ感じになる。 以下に自分流のゲーム改造/チートの楽しみ方の一つの側面を紹介する。 没アイテムの発見 上記後者の「有り得ない事を起こす」とは、例えば、未登場不使用の没アイテムの発見だ。 遥か昔にファミコン版ドラクエIIIで「ちいさなメダル」を見つけて驚いた事がある。 前作にも有った「しのオルゴール」は知ってたが、「ちいさなメダル」はIVからが常識だし、 「あのイベントはIIIから有ったけど容量の都合で無くした」、みたいなストーリーを勝手に想像して、初めて見たときはかなり感動した。 実は、バグ技を使
続きを読む

TWRPにてバックアップ成功

イメージ
TWRPにてバックアップ成功 やっと常用出来る状態に 先日購入して弄りまくってるLenovo Yoga Smart Tab YT-X705f ZA3V0052JPの続報。 紆余曲折を経て、バックアップ出来たっぽい。 とりあえずSystemイメージがバックアップ出来なかった件は、外部SDのフォーマットに起因すると睨み、exFATにする事で解決。 本当はext4辺りでフォーマットしたかったが・・・時間が有るときにUSBメモリにUbuntuでも突っ込んでフォーマットし直すかな。 それでもdataパーティションのバックアップには失敗していた。 きっと端末の暗号化とかその辺りだろうと考え、解除。 結果、バックアップ成功。   コレでRootedでTWRPもバッチリ使えるようになった。 選択可能なパーティションは全てバックアップ/リストア出来る。   暗号化解除は、なにやら文鎮スレスレな所まで追い込まれ、運良く逃れた感じなのでStableな手順はイマイチ分からない。 Stock bootとStock Recoveryを入れてFactory ResetしてもBoot Loopし始めた時には軽く泣きそうになった・・・ 御質問・御意見・御感想は @m_o_p_u までお気軽にどうぞ   << 前の記事 次の記事>>    YT-X705fのROOT化＆TWRP作成 その2 TWRP その後・・・  
続きを読む