写真の深度から作った地形に、本当に歩ける橋を置く
執筆・制作:何でも自作する人(運営者について)
個人開発 / Webアプリ / ゲーム開発 / テスト
写真の相対的な深度を高さに変えて、その上を歩き回れる自作アプリ「Photo World」の探検モードに、最大3本まで置ける、回収もできる橋を追加しました。
橋は、地形の谷をまたぐために使います。見た目だけ橋にするのは簡単ですが、実際に歩ける床にするには、もう少し手間がかかりました。
描いただけでは床にならない
地形とは別に橋を描くだけでは、キャラクターはその上を歩けません。移動の判定は地形の高さを使っているので、橋の絵は画面に出るだけで、判定には何も関係しないからです。
もう1つ、橋の中心線だけで検査すると、橋の幅の端が地形に埋まることがありました。中心では高さが合っていても、端は斜面に突き刺さることがあります。
4つを共通にする
そこで、次の4つを同じ情報から作りました。
- 見た目:橋の描画
- 連続した移動:橋の上を歩く判定
- 置ける場所の制約:橋を置いてよい条件
- リセット:橋を回収して置き直す処理
具体的には、次のように実装しました。
- 地形の格子の境界と、橋の幅全体を調べて、両端の接地と干渉を検証する
- 移動を橋の境界で分割して、地形の上と橋の上で、同じ高さの値を足と影にも使う
- 橋の上では回収できない。回収は、地上の端から橋の材料へ戻す形にする
足の位置、影、判定がすべて同じ高さを参照するので、橋の上で足が浮く、影がずれる、といったことが起きにくくなります。
谷を往復する試験
実際の入力を再現して、谷を橋で往復するNodeの試験を追加しました。また、既存のWindows向けの試験が、改行コードの違い(CRLF)でimportの除去に失敗していたので、LFとCRLFの両方に対応させました。
確認できているのは、数値とモックによる試験までです。橋の見た目と、Androidでの操作性は、まだ実機で確認していません。
学んだこと
ゲームの部品を足すときは、見た目、移動、配置の制約、リセットの4つが同じ情報を見ているかを最初に確認すると、後から不具合が出にくくなります。また、数値やモックの試験が通ることと、実機で気持ちよく動くことは別なので、報告するときは分けて書くようにしています。